<!-- 绘制围栏表单组件 -->
|
<template>
|
<view :class="{'m-form':!isStart,'m-form-1':isStart}">
|
<view class="m-form-head" v-show="!isStart"><u-icon name="close-circle" color="#fff" size="40"
|
@click="cancel"></u-icon></view>
|
<view class="m-form-label" v-show="!isStart">
|
<u--form labelPosition="left" :model="model" :rules="rules" ref="form" labelWidth="100"
|
:labelStyle="{ color: 'rgb(129, 129, 129)' }">
|
<u-form-item v-if="Step == 'first'" label="选择标签" prop="type" borderBottom ref="item">
|
<uni-data-select v-model="value_name" :localdata="range" @change="changeRange"></uni-data-select>
|
</u-form-item>
|
<u-form-item v-if="Step == 'first'" label="标签ID" prop="p_tagid" borderBottom ref="item">
|
<u--input :customStyle="{
|
'background-color': 'rgb(233, 233, 233)',
|
'box-shadow': 'inset 2px 1.464px 5px 0px #ccccc4, 1.464px 1.464px 5px 0px rgba(255, 255, 255, 0.75)'
|
}" readonly placeholderStyle="color:#6a6a6a" color="#000" v-model="model.p_tagid" border="none"></u--input>
|
</u-form-item>
|
|
<u-form-item v-if="Step == 'first'" label="围栏名称" prop="name" borderBottom ref="item">
|
<u--input :customStyle="{
|
'background-color': 'rgb(233, 233, 233)',
|
'box-shadow': 'inset 2px 1.464px 5px 0px #ccccc4, 1.464px 1.464px 5px 0px rgba(255, 255, 255, 0.75)'
|
}" placeholderStyle="color:#6a6a6a" color="#000" v-model="model.name" border="none"></u--input>
|
</u-form-item>
|
<u-form-item v-if="Step == 'first'" label="围栏类型" prop="fencetype" borderBottom ref="type">
|
<uni-data-select v-model="model.fencetype" :localdata="rangetype"
|
@change="changeRangeLevel"></uni-data-select>
|
</u-form-item>
|
<u-form-item v-if="Step == 'first'" label="关联部门" prop="bumen" borderBottom ref="item">
|
<uni-data-select v-model="value_bumen" :localdata="rangeBuMen"
|
@change="changeRangeBuMen"></uni-data-select>
|
</u-form-item>
|
|
<u-form-item v-if="Step == 'first'" label="带电高度" prop="chargedHeight" borderBottom ref="item">
|
<u--input :customStyle="{
|
'background-color': 'rgb(233, 233, 233)',
|
'box-shadow': 'inset 2px 1.464px 5px 0px #ccccc4, 1.464px 1.464px 5px 0px rgba(255, 255, 255, 0.75)'
|
}" @change="jisuangj" placeholderStyle="color:#6a6a6a" color="#000" v-model="model.chargedHeight"
|
border="none"></u--input>
|
</u-form-item>
|
<u-form-item v-if="Step == 'first'" label="电压等级" prop="voltageLevel" borderBottom ref="voitem">
|
<uni-data-select v-model="model.voltageLevel" :localdata="rangeLevel"
|
@change="changeRangeLevel"></uni-data-select>
|
</u-form-item>
|
<u-form-item v-if="Step == 'first'" label="告警高度" prop="baoliu1" borderBottom ref="item">
|
<u--input :customStyle="{
|
'background-color': 'rgb(233, 233, 233)',
|
'box-shadow': 'inset 2px 1.464px 5px 0px #ccccc4, 1.464px 1.464px 5px 0px rgba(255, 255, 255, 0.75)'
|
}" placeholderStyle="color:#6a6a6a" placeholder="单位米" color="#000" v-model="model.baoliu1"
|
border="none"></u--input>
|
</u-form-item>
|
<u-form-item v-if="Step == 'first'" label="启用围栏" prop="valueSwitch" borderBottom ref="item">
|
<u-switch v-model="model.valueSwitch" asyncChange @change="asyncChange"></u-switch>
|
</u-form-item>
|
|
|
<u-form-item v-if="Step == 'crane'" label="围栏名称" prop="name" borderBottom ref="item">
|
<u--input :customStyle="{
|
'background-color': 'rgb(233, 233, 233)',
|
'box-shadow': 'inset 2px 1.464px 5px 0px #ccccc4, 1.464px 1.464px 5px 0px rgba(255, 255, 255, 0.75)'
|
}" placeholderStyle="color:#6a6a6a" color="#000" v-model="model.name" border="none"></u--input>
|
</u-form-item>
|
<u-form-item v-if="Step == 'crane'" label="关联部门" prop="bumen" borderBottom ref="item">
|
<uni-data-select v-model="value_bumen" :localdata="rangeBuMen"
|
@change="changeRangeBuMen"></uni-data-select>
|
</u-form-item>
|
<u-form-item v-if="Step == 'crane'" label="带电高度" prop="chargedHeight" borderBottom ref="item">
|
<u--input :customStyle="{
|
'background-color': 'rgb(233, 233, 233)',
|
'box-shadow': 'inset 2px 1.464px 5px 0px #ccccc4, 1.464px 1.464px 5px 0px rgba(255, 255, 255, 0.75)'
|
}" @change="jisuangj" placeholderStyle="color:#6a6a6a" color="#000" v-model="model.chargedHeight"
|
border="none"></u--input>
|
</u-form-item>
|
<u-form-item v-if="Step == 'crane'" label="电压等级" prop="voltageLevel" borderBottom ref="voitem">
|
<uni-data-select v-model="model.voltageLevel" :localdata="rangeLevel"
|
@change="changeRangeLevel"></uni-data-select>
|
</u-form-item>
|
<u-form-item v-if="Step == 'crane'" label="告警高度" prop="baoliu1" borderBottom ref="item">
|
<u--input :customStyle="{
|
'background-color': 'rgb(233, 233, 233)',
|
'box-shadow': 'inset 2px 1.464px 5px 0px #ccccc4, 1.464px 1.464px 5px 0px rgba(255, 255, 255, 0.75)'
|
}" placeholderStyle="color:#6a6a6a" placeholder="单位米" color="#000" v-model="model.baoliu1"
|
border="none"></u--input>
|
</u-form-item>
|
<!-- <u-form-item v-if="Step == 'crane'" label="提醒标签" prop="p_warn" borderBottom ref="item">
|
<view v-if="Step == 'crane'" class="uni-px-5 uni-pb-5" style="width: 100%">
|
<mySelectCheckbox v-model="value1" multiple dataKey="text" dataValue="value" :localdata="range"
|
clear style="margin-right: -10px;" @change="change"></mySelectCheckbox>
|
</view>
|
</u-form-item> -->
|
</u-form-item>
|
<u-form-item v-if="Step == 'crane'" label="启用吊高" prop="valueSwitch" borderBottom ref="item">
|
<u-switch v-model="model.valueSwitch" asyncChange @change="asyncChange"></u-switch>
|
</u-form-item>
|
</u--form>
|
</view>
|
<view class="m-form-button-list" v-show="!isStart">
|
<u-button :disabled="isDisabled" type="primary" text="开始绘制" @click="startDraw"
|
v-if="Step == 'first' && isShow"></u-button>
|
<u-button type="primary" text="吊车模式" @click="save" v-if="Step == 'first'"></u-button>
|
<!-- <u-button type="primary" text="结束绘制" @click="endDraw" v-if="Step == 'first'"></u-button> -->
|
<u-button type="primary" text="下一步" @click="nextStep" v-if="Step == 'first' && !isShow"></u-button>
|
<u-button type="primary" text="保存围栏" @click="save" v-if="Step == 'second' || Step == 'crane'"></u-button>
|
</view>
|
<view class="m-form-btn" @click="endDraw" v-if="Step == 'first' && isStart">
|
结束绘制
|
</view>
|
</view>
|
</template>
|
|
<script>
|
import mySelectCheckbox from './my-selelctCheckbox.vue'
|
import {
|
connChart,
|
getPointsCenter
|
} from '@/common/utils.js';
|
import {
|
formatDate
|
} from '@/common/tools.js'
|
import {
|
gps2xybiandianzhan
|
} from '@/common/GnssToXY.js'
|
export default {
|
props: {
|
deviceId: String,
|
},
|
components: {
|
mySelectCheckbox
|
},
|
data() {
|
return {
|
isDisabled: true,
|
labelModel: '',
|
// tally: [],
|
value1: '',
|
model: {
|
selecttanum: '选择标签',
|
name: '',
|
chargedHeight: '',
|
voltageLevel: '',
|
fencetype: '',
|
valueSwitch: false,
|
baoliu1: '',
|
bumen: '',
|
p_tagid: ''
|
},
|
rules: {
|
baoliu1: {
|
validator: (rule, value, callback) => {
|
// 返回true表示校验通过，返回false表示不通过
|
var pattern = /^\d+(\.\d{1,2})?$/;
|
return pattern.test(value);
|
},
|
required: true,
|
message: '精度0.01m',
|
trigger: ['blur', 'change']
|
}
|
},
|
Step: 'first',
|
valueList: [],
|
range: [],
|
value_name: '',
|
value_bumen: '',
|
rangeBuMen: [],
|
rangeLevel: [{
|
value: '0.7m',
|
text: '10kV(0.7m)'
|
}, {
|
value: '1m',
|
text: '20~35kV(1m)'
|
}, {
|
value: '1.5m',
|
text: '66~110kV(1.5m)'
|
}, {
|
value: '3m',
|
text: '220kV(3m)'
|
}, {
|
value: '4m',
|
text: '330kV(4m)'
|
}, {
|
value: '5m',
|
text: '500kV(5m)'
|
}, {
|
value: '6m',
|
text: '750kV(6m)'
|
}, {
|
value: '7m',
|
text: '1000kV(7m)'
|
}],
|
rangetype: [{
|
value: '区域围栏',
|
text: '区域围栏'
|
}, {
|
value: '吊高围栏',
|
text: '吊高围栏'
|
}],
|
|
// rangeLevel:[
|
// '10kV：0.7m',
|
// '20~35kV：1m',
|
// '66~110kV：1.5m',
|
// '220kV：3m',
|
// '330kV：4m',
|
// '500kV：5m',
|
// '750kV：6m',
|
// '1000kV：7m',
|
// ],
|
isShow: true,
|
isStart: false
|
};
|
},
|
methods: {
|
//开始绘制
|
startDraw() {
|
if (this.model.name == '') {
|
|
uni.$u.toast('围栏名称不能为空')
|
// this.isStart=true
|
// return false
|
} else if (this.model.fencetype == '') {
|
|
uni.$u.toast('围栏类型不能为空')
|
// this.isStart=true
|
// return false
|
} else if (this.model.baoliu1 == '') {
|
|
uni.$u.toast('告警高度不能为空')
|
// this.isStart=true
|
// return false
|
} else {
|
var sys = this.$store.state.sys;
|
if (sys.local==false) {
|
var method ='GET'
|
var data = {}
|
data.serialNumber = this.deviceId
|
data.name = this.model.name
|
console.log(data);
|
var contentType='application/x-www-form-urlencoded'
|
uni.request({
|
// url: "http://192.168.31.101:8181/Fence/", //接口地址。
|
// url: "http://111.198.60.6:6008/Fence/", //接口地址。
|
url: "http://"+sys.baoliu20host+":8181/Fence/", //接口地址。
|
data: data,
|
method: method,
|
header: { //请求头可自定义
|
'content-type': contentType,
|
},
|
timeout:5000,//设置超时时间,默认5秒
|
success: (rep) => { //具体捕获请看自己接口返回的形式
|
console.log(87654345678);
|
console.log(rep)
|
|
|
// this.railList = [];
|
// if (rep.statusCode==200) {
|
// rep.data.forEach((e, i) => {
|
// e.name=e.name.split(this.deviceId)[0]
|
// e.addtime=e.baoliu12
|
// this.status = 'loadmore'
|
// })
|
// this.valueList.push(...rep.data)
|
// }else{
|
// // this.status = 'nomore'
|
// }
|
// console.log(e);
|
// console.log(r);
|
if (rep.statusCode==200) {
|
uni.$u.toast('围栏名称重复')
|
// this.Step = 'first';
|
// this.isStart=true
|
// this.$emit('submitDrawForm');
|
} else {
|
var baoliu77 = this.model.valueSwitch ? '1' : '0'
|
// this.model.p_tagid
|
uni.$u.toast('围栏绘制中:手持URT走个闭合围栏然后结束绘制');
|
this.isStart = true
|
this.$store.commit('setDefaultData')
|
var ipa = this.model.name + "," + this.model.fencetype + "," + this.model.bumen + "," +
|
this.model.baoliu1 + "," + this.model.p_tagid + "," + this.model.chargedHeight +
|
"," + this.model.voltageLevel + "," + baoliu77
|
console.log(ipa);
|
this.$emit('startDraw', {
|
ipa: ipa,
|
tag: this.model.p_tagid
|
});
|
}
|
},
|
// fail(error) {
|
// console.log(error);
|
// uni.hideLoading();
|
// uni.$u.toast('网络不通');
|
// // reject(error)
|
// },
|
complete() {
|
uni.hideLoading();
|
}
|
});
|
}else{
|
var fence = connChart('fence');
|
fence.find(`name='${this.model.name}'`, (e, r) => {
|
console.log(e);
|
console.log(r);
|
if (r.length > 0) {
|
uni.$u.toast('围栏名称重复')
|
// this.Step = 'first';
|
// this.isStart=true
|
// this.$emit('submitDrawForm');
|
} else {
|
var baoliu77 = this.model.valueSwitch ? '1' : '0'
|
// this.model.p_tagid
|
uni.$u.toast('围栏绘制中:手持URT走个闭合围栏然后结束绘制');
|
this.isStart = true
|
this.$store.commit('setDefaultData')
|
var ipa = this.model.name + "," + this.model.fencetype + "," + this.model.bumen + "," +
|
this.model.baoliu1 + "," + this.model.p_tagid + "," + this.model.chargedHeight +
|
"," + this.model.voltageLevel + "," + baoliu77
|
console.log(ipa);
|
this.$emit('startDraw', {
|
ipa: ipa,
|
tag: this.model.p_tagid
|
});
|
}
|
|
})
|
}
|
|
|
}
|
// this.$emit('startDraw',{tagid:this.model.p_tagid})
|
},
|
craneDraw() {
|
this.Step = 'crane';
|
// this.model.p_tagid
|
// uni.$u.toast('围栏绘制中:手持URT走个闭合围栏然后结束绘制');
|
// this.isStart=true
|
// this.$store.commit('setDefaultData')
|
// this.$emit('startDraw',{tagid:this.model.p_tagid})
|
},
|
|
|
|
|
|
//结束绘制
|
endDraw() {
|
this.isShow = false
|
// this.isStart=false
|
this.Step = '';
|
this.$emit('endDraw',{tagid:this.model.p_tagid})
|
// this.$emit('endDraw')
|
uni.$u.toast('保存成功')
|
},
|
//下一步
|
nextStep() {
|
this.Step = 'second';
|
},
|
//保存围栏
|
save() {
|
var sys = this.$store.state.sys;
|
if (sys.local==false) {
|
var method ='GET'
|
var data = {}
|
data.serialNumber = this.deviceId
|
data.name = this.model.name
|
console.log(data);
|
var contentType='application/x-www-form-urlencoded'
|
uni.request({
|
// url: "http://192.168.31.101:8181/Fence/", //接口地址。
|
// url: "http://111.198.60.6:6008/Fence/", //接口地址。
|
url: "http://"+sys.baoliu20host+":8181/Fence/", //接口地址。
|
data: data,
|
method: method,
|
header: { //请求头可自定义
|
'content-type': contentType,
|
},
|
timeout:5000,//设置超时时间,默认5秒
|
success: (rep) => { //具体捕获请看自己接口返回的形式
|
console.log(87654345678);
|
console.log(rep)
|
if (rep.statusCode==200) {
|
uni.$u.toast('围栏名称重复')
|
// this.Step = 'first';
|
// this.isStart=true
|
// this.$emit('submitDrawForm');
|
} else {
|
var baoliu77 = this.model.valueSwitch ? '1' : '0'
|
// var fencetype2 = this.Step == 'second' ? '区域围栏' : '吊高围栏'
|
// if (!e) {
|
|
// for (var i = 0; i < this.value1.length; i++) {
|
// this.value1[i]
|
// this.labelModel = connChart('label')
|
// this.labelModel.update(`id='${this.value1[i]}'`, {
|
// baoliu12: this.model.name,
|
// // p_warn: list,
|
// // p_tagid: this.model.p_tagid,
|
// // baoliu12: this.model.baoliu12
|
// }, (err, results) => {
|
// // this.$emit('submitTallyForm');
|
// });
|
// }
|
uni.$u.toast('保存成功')
|
// console.log(this.model.bumen);
|
// console.log(list);
|
// var ipa = this.model.name+"," +this.model.bumen+","+this.model.baoliu1+","+this.model.chargedHeight+","+this.model.p_tagid
|
|
var ipa = this.model.name + "," + this.model.fencetype + "," + this.model
|
.bumen + "," + this.model.baoliu1 + "," + this.model.p_tagid + "," +
|
this.model.chargedHeight + "," + this.model.voltageLevel + "," +
|
baoliu77
|
console.log(ipa);
|
this.$emit('submitDrawForm', {
|
ipa: ipa
|
});
|
// this.$emit('submitDrawForm');
|
// }
|
|
this.isShow = false
|
this.isStart = false
|
this.Step = '';
|
this.$emit('endDraw')
|
}
|
},
|
// fail(error) {
|
// console.log(error);
|
// uni.hideLoading();
|
// uni.$u.toast('网络不通');
|
// // reject(error)
|
// },
|
complete() {
|
uni.hideLoading();
|
}
|
});
|
}else{
|
|
|
|
var fence = connChart('fence');
|
fence.find(`name='${this.model.name}'`, (e, r) => {
|
console.log(e);
|
console.log(r);
|
if (r.length > 0) {
|
uni.$u.toast('围栏名称重复')
|
// this.Step = 'first';
|
// this.isStart=true
|
// this.$emit('submitDrawForm');
|
} else {
|
var center = getPointsCenter(this.$store.state.tallyRailPositon_j_w_list)
|
// console.log(center.split(',')[0],center.split(',')[1])
|
var max_x = Math.max.apply(Math, this.$store.state.tallyRailPositon_j_w.map(item => {
|
return item.x
|
}))
|
var max_y = Math.max.apply(Math, this.$store.state.tallyRailPositon_j_w.map(item => {
|
return item.y
|
}))
|
var min_x = Math.min.apply(Math, this.$store.state.tallyRailPositon_j_w.map(item => {
|
return item.x
|
}))
|
var min_y = Math.min.apply(Math, this.$store.state.tallyRailPositon_j_w.map(item => {
|
return item.y
|
}))
|
var max_point = gps2xybiandianzhan(this.$store.state.yuandian_jingdu, this.$store.state
|
.yuandian_weidu, max_x, max_y)
|
var min_point = gps2xybiandianzhan(this.$store.state.yuandian_jingdu, this.$store.state
|
.yuandian_weidu, min_x, min_y)
|
var centerpoint = gps2xybiandianzhan(this.$store.state.yuandian_jingdu, this.$store.state
|
.yuandian_weidu, center[0], center[1])
|
var labelModel = connChart('fence');
|
labelModel.insert({
|
baoliu1: this.model.baoliu1,
|
floor: '0',
|
fencetype: this.Step == 'second' ? '区域围栏' : '吊高围栏',
|
chargedHeight: this.model.chargedHeight,
|
voltageLevel: this.model.voltageLevel,
|
fencetype: this.model.fencetype,
|
name: this.model.name,
|
// chargedHeight:this.model.chargedHeight,
|
bumen: this.model.bumen,
|
baoliu7: this.model.valueSwitch ? '1' : '0',
|
zuobiao: JSON.stringify(this.$store.state.tallyRailPositon),
|
pts: JSON.stringify(this.$store.state.tallyRailPositon_j_w),
|
max: max_point[0] + ',' + max_point[1],
|
min: min_point[0] + ',' + min_point[1],
|
addtime: formatDate(new Date(), 'yyyy-MM-dd hh:mm:ss'),
|
centerpoint: centerpoint[0] + ',' + centerpoint[1],
|
}, (e, r) => {
|
var baoliu77 = this.model.valueSwitch ? '1' : '0'
|
var fencetype2 = this.Step == 'second' ? '区域围栏' : '吊高围栏'
|
if (!e) {
|
|
for (var i = 0; i < this.value1.length; i++) {
|
this.value1[i]
|
this.labelModel = connChart('label')
|
this.labelModel.update(`id='${this.value1[i]}'`, {
|
baoliu12: this.model.name,
|
// p_warn: list,
|
// p_tagid: this.model.p_tagid,
|
// baoliu12: this.model.baoliu12
|
}, (err, results) => {
|
// this.$emit('submitTallyForm');
|
});
|
}
|
uni.$u.toast('保存成功')
|
// console.log(this.model.bumen);
|
// console.log(list);
|
// var ipa = this.model.name+"," +this.model.bumen+","+this.model.baoliu1+","+this.model.chargedHeight+","+this.model.p_tagid
|
|
var ipa = this.model.name + "," + this.model.fencetype + "," + this.model
|
.bumen + "," + this.model.baoliu1 + "," + this.model.p_tagid + "," +
|
this.model.chargedHeight + "," + this.model.voltageLevel + "," +
|
baoliu77
|
console.log(ipa);
|
this.$emit('submitDrawForm', {
|
ipa: ipa
|
});
|
// this.$emit('submitDrawForm');
|
}
|
})
|
this.isShow = false
|
this.isStart = false
|
this.Step = '';
|
this.$emit('endDraw')
|
}
|
})
|
|
}
|
|
|
},
|
//取消
|
cancel() {
|
this.$emit('cancelDrawForm');
|
},
|
change(e) {
|
console.log('e:', e);
|
},
|
//启用围栏-开关
|
asyncChange(e) {
|
this.model.valueSwitch = e;
|
// uni.showModal({
|
// content: e ? '确定要打开吗' : '确定要关闭吗',
|
// confirmColor:"#68B0FE",
|
// cancelColor:"#68B0FE",
|
// success: res => {
|
// if (res.confirm) {
|
// this.model.valueSwitch = e;
|
// }
|
// }
|
// });
|
},
|
//获取标签列表数据
|
getTallyList() {
|
var labelModel = connChart('label');
|
labelModel.find((e, r) => {
|
// console.log(e,r)
|
if (r.length != 0) {
|
this.range = [];
|
r.forEach((e, index) => {
|
this.range.push({
|
text: e.p_tagid + ' ' + e.p_name,
|
value: e.p_tagid
|
});
|
});
|
}
|
})
|
},
|
//部门查询
|
jiedepartment() {
|
var labelModel = connChart('department');
|
labelModel.find((e, r) => {
|
if (r.length != 0) {
|
r.forEach(e => {
|
this.rangeBuMen.push({
|
text: e.department_name,
|
value: e.department_name
|
});
|
if (e.department_name == '系统默认') {
|
this.value_bumen = e.department_name;
|
this.model.bumen = e.department_name;
|
}
|
});
|
|
}
|
})
|
},
|
changeRange(e) {
|
this.value_name = e;
|
this.model.p_tagid = e;
|
if (this.model.p_tagid != '') {
|
this.isDisabled = false;
|
}
|
|
},
|
changeRangeBuMen(e) {
|
this.value_bumen = e;
|
this.model.bumen = e;
|
},
|
changeRangeLevel(e) {
|
if (this.model.chargedHeight != '') {
|
this.model.baoliu1 = (this.model.chargedHeight - e.split("m")[0]).toFixed(2)
|
}
|
this.voltageLevel = e;
|
this.model.voltageLevel = e;
|
},
|
changeRangetype(e) {
|
this.fencetype = e;
|
this.model.fencetype = e;
|
},
|
|
jisuangj(e) {
|
if (this.model.voltageLevel != '') {
|
|
this.model.baoliu1 = (e - this.model.voltageLevel.split("m")[0]).toFixed(2)
|
}
|
// this.value_bumen = e;
|
// this.model.bumen = e;
|
},
|
|
},
|
mounted() {
|
console.log(this.Step);
|
this.getTallyList();
|
this.jiedepartment();
|
}
|
};
|
</script>
|
|
<style lang="scss" scoped>
|
.m-form {
|
position: fixed;
|
top: 50%;
|
left: 50%;
|
transform: translate(-50%, -50%);
|
background-color: rgba(233, 233, 233, 0.8);
|
width: 60%;
|
display: flex;
|
flex-direction: column;
|
z-index: 700;
|
box-shadow: -3.536px -3.536px 5px 0px rgba(255, 255, 255, 0.75), 4.721px 6.457px 8px -5px rgba(191, 191, 191, 1);
|
}
|
|
.m-form-1 {
|
position: fixed;
|
bottom: 8em;
|
left: 50%;
|
transform: translate(-50%, 0);
|
z-index: 700;
|
|
.m-form-btn {
|
background-color: rgba(69, 158, 255, 0.9);
|
border-radius: 3em;
|
width: 10em;
|
padding: 15px 0;
|
color: #fff;
|
font-size: 1.5em;
|
text-align: center;
|
}
|
}
|
|
.m-form-head {
|
width: 100%;
|
border-bottom: 1px solid #fff;
|
}
|
|
.m-form-head .u-icon {
|
float: right;
|
}
|
|
/deep/ .u-form-item__body__left__content__label {
|
color: #fff;
|
}
|
|
.m-form-label {
|
width: 80%;
|
margin: 0 auto;
|
margin-bottom: 0.5em;
|
}
|
|
.m-form-button-list {
|
width: 100%;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
margin-bottom: 1em;
|
}
|
|
.m-form-button-list .u-button {
|
width: 5em;
|
}
|
|
// .m-form-button-list .u-button:nth-child(2),
|
// .m-form-button-list .u-button:nth-child(3),
|
// .m-form-button-list .u-button:nth-child(4) {
|
// margin-top: 1em;
|
// }
|
</style>
|
