This commit is contained in:
zyy 2019-12-09 14:33:30 +08:00
commit 01501ce364
5 changed files with 377 additions and 297 deletions

View File

@ -2200,6 +2200,9 @@ export const IbpOperation = {
Ban_Up_Open_Screen_Door: {operate: '', event: 'BanUpOpenScreenDoor'},
Ban_Down_Open_Screen_Door: {operate: '', event: 'BanDownOpenScreenDoor'}
};
/**
* ibp状态显示条件
*/
export const IbpShowCondition = {
Show_Detain: {statusKey: 'holdStatus', statusValue:['02', '03', '04'], defaultStatus: 'close'},
Show_Open_Screen_Door: {statusKey: 'screenDoorOpenStatus', statusValue:['02'], defaultStatus: 'close'},

View File

@ -1,143 +1,165 @@
<template>
<div>
<el-form ref="form" :rules="rules" :model="form" label-width="80px">
<el-form-item :label="this.$t('ibp.buttonCode')" prop="code">
<el-input :disabled="true" v-model="form.code" >
<el-button slot="append" :disabled="isUpdate" type="primary" @click="generateCode">{{$t('ibp.generateCode')}}</el-button>
</el-input>
</el-form-item>
<el-form-item :label="this.$t('ibp.buttonColor')" prop="buttonColor">
<el-select v-model="form.buttonColor" :placeholder="this.$t('ibp.selectTheButtonColor')">
<el-option :label="this.$t('ibp.redButton')" value="red"></el-option>
<el-option :label="this.$t('ibp.yellowButton')" value="yellow"></el-option>
<el-option :label="this.$t('ibp.greenButton')" value="green"></el-option>
<el-option :label="this.$t('ibp.blueButton')" value="blue"></el-option>
<el-option :label="this.$t('ibp.grayButton')" value="gray"></el-option>
</el-select>
</el-form-item>
<el-form-item :label="this.$t('ibp.buttonWidth')" prop="buttonWidth">
<el-input-number v-model="form.buttonWidth" controls-position="right" :min="1"></el-input-number>
</el-form-item>
<el-form-item :label="this.$t('ibp.xCoordinate')">
<el-input-number v-model="form.x" controls-position="right" :min="1"></el-input-number>
</el-form-item>
<el-form-item :label="this.$t('ibp.yCoordinate')">
<el-input-number v-model="form.y" controls-position="right" :min="1"></el-input-number>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit('form')">{{ buttonText }}</el-button>
<el-button v-show="showDeleteButton" @click="deleteDevice" type="danger">{{$t('global.delete')}}</el-button>
<el-button v-show="showDeleteButton" @click="initPage">{{$t('global.cancel')}}</el-button>
</el-form-item>
</el-form>
</div>
<div>
<el-form ref="form" :rules="rules" :model="form" label-width="80px">
<el-form-item :label="this.$t('ibp.buttonCode')" prop="code">
<el-input v-model="form.code" :disabled="true">
<el-button slot="append" :disabled="isUpdate" type="primary" @click="generateCode">{{ $t('ibp.generateCode') }}</el-button>
</el-input>
</el-form-item>
<el-form-item :label="this.$t('ibp.buttonColor')" prop="buttonColor">
<el-select v-model="form.buttonColor" :placeholder="this.$t('ibp.selectTheButtonColor')">
<el-option :label="this.$t('ibp.redButton')" value="red" />
<el-option :label="this.$t('ibp.yellowButton')" value="yellow" />
<el-option :label="this.$t('ibp.greenButton')" value="green" />
<el-option :label="this.$t('ibp.blueButton')" value="blue" />
<el-option :label="this.$t('ibp.grayButton')" value="gray" />
</el-select>
</el-form-item>
<el-form-item :label="this.$t('ibp.buttonWidth')" prop="buttonWidth">
<el-input-number v-model="form.buttonWidth" controls-position="right" :min="1" />
</el-form-item>
<el-form-item :label="this.$t('ibp.xCoordinate')">
<el-input-number v-model="form.x" controls-position="right" :min="1" />
</el-form-item>
<el-form-item :label="this.$t('ibp.yCoordinate')">
<el-input-number v-model="form.y" controls-position="right" :min="1" />
</el-form-item>
<el-form-item label="操作">
<el-select v-model="form.mean" placeholder="请选择">
<el-option
v-for="item in operateMeanList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit('form')">{{ buttonText }}</el-button>
<el-button v-show="showDeleteButton" type="danger" @click="deleteDevice">{{ $t('global.delete') }}</el-button>
<el-button v-show="showDeleteButton" @click="initPage">{{ $t('global.cancel') }}</el-button>
</el-form-item>
</el-form>
</div>
</template>
<script>
export default {
name: 'ButtonDraft',
components: {
},
data() {
return {
isUpdate: false,
buttonText: this.$t('ibp.createNow'),
showDeleteButton: false,
form: {
code: '',
buttonColor: 'red',
buttonWidth: 25,
x: 10,
y: 10
},
rules: {
code: [
{ required: true, message: this.$t('ibp.enterTheButtonCode'), trigger: 'blur' },
],
buttonColor: [
{ required: true, message: this.$t('ibp.selectTheButtonColor'), trigger: 'change'}
],
buttonWidth: [
{ required: true, message: this.$t('ibp.enterTheButtonWidth'), trigger: 'blur' },
]
}
};
},
computed: {
},
watch: {
'$store.state.ibp.rightClickCount': function (val) {
const model = this.$store.getters['ibp/updateDeviceData'];
if (model._type === 'SquareButton' ){
this.buttonText = this.$t('global.modify');
this.showDeleteButton = true;
this.isUpdate = true;
this.form.code = model.code;
this.form.buttonColor = model.color;
this.form.buttonWidth = model.width;
this.form.x = model.point.x;
this.form.y = model.point.y;
}
export default {
name: 'ButtonDraft',
components: {
},
data() {
return {
isUpdate: false,
buttonText: this.$t('ibp.createNow'),
showDeleteButton: false,
operateMeanList: [
{ label: '上行扣车', value: 'Up_Hold_Train' },
{ label: '下行扣车', value: 'Down_Hold_Train' },
{ label: '上行取消扣车', value: 'Up_Cancel_Hold_Train' },
{ label: '下行取消扣车', value: 'Down_Cancel_Hold_Train' },
{ label: '上行打开屏蔽门', value: 'Up_Open_Screen_Door' },
{ label: '下行打开屏蔽门', value: 'Down_Open_Screen_Door' }
],
form: {
code: '',
buttonColor: 'red',
buttonWidth: 25,
x: 10,
y: 10
},
rules: {
code: [
{ required: true, message: this.$t('ibp.enterTheButtonCode'), trigger: 'blur' }
],
buttonColor: [
{ required: true, message: this.$t('ibp.selectTheButtonColor'), trigger: 'change'}
],
buttonWidth: [
{ required: true, message: this.$t('ibp.enterTheButtonWidth'), trigger: 'blur' }
]
}
},
mounted() {
},
methods: {
onSubmit(form) {
this.$refs[form].validate((valid) => {
if (valid) {
const buttonModel = {
point: {
x: this.form.x,
y: this.form.y
},
_type: 'SquareButton',
code: this.form.code,
color: this.form.buttonColor,
status: 'off',
width: this.form.buttonWidth,
};
this.$emit('createButton', buttonModel);
this.initPage();
}else {
return false;
}
});
},
deleteDevice() {
const buttonModel = {
point: {
x: this.form.x,
y: this.form.y
},
_type: 'SquareButton',
code: this.form.code,
color: this.form.buttonColor,
status: 'off',
width: this.form.buttonWidth,
};
this.$emit('deleteDataModel',buttonModel );
this.initPage();
},
initPage() {
this.isUpdate = false;
this.buttonText = this.$t('ibp.createNow');
this.showDeleteButton = false;
this.form = {
code: '',
buttonColor: 'red',
buttonWidth: 25,
x: 10,
y: 10
};
},
generateCode() {
const mydate = new Date();
this.form.code = "sButton_"+mydate.getDay()+ mydate.getHours()+ mydate.getMinutes()+mydate.getSeconds()+mydate.getMilliseconds()+ Math.round(Math.random() * 10000);
};
},
computed: {
},
watch: {
'$store.state.ibp.rightClickCount': function (val) {
const model = this.$store.getters['ibp/updateDeviceData'];
if (model._type === 'SquareButton' ) {
this.buttonText = this.$t('global.modify');
this.showDeleteButton = true;
this.isUpdate = true;
this.form.code = model.code;
this.form.buttonColor = model.color;
this.form.buttonWidth = model.width;
this.form.x = model.point.x;
this.form.y = model.point.y;
this.form.mean = model.mean;
}
}
};
},
mounted() {
},
methods: {
onSubmit(form) {
this.$refs[form].validate((valid) => {
if (valid) {
const buttonModel = {
point: {
x: this.form.x,
y: this.form.y
},
_type: 'SquareButton',
code: this.form.code,
color: this.form.buttonColor,
status: 'off',
width: this.form.buttonWidth,
mean: this.from.mean
};
this.$emit('createButton', buttonModel);
this.initPage();
} else {
return false;
}
});
},
deleteDevice() {
const buttonModel = {
point: {
x: this.form.x,
y: this.form.y
},
_type: 'SquareButton',
code: this.form.code,
color: this.form.buttonColor,
status: 'off',
width: this.form.buttonWidth,
mean: this.form.mean
};
this.$emit('deleteDataModel', buttonModel );
this.initPage();
},
initPage() {
this.isUpdate = false;
this.buttonText = this.$t('ibp.createNow');
this.showDeleteButton = false;
this.form = {
code: '',
buttonColor: 'red',
buttonWidth: 25,
x: 10,
y: 10,
mean: ''
};
},
generateCode() {
const mydate = new Date();
this.form.code = 'sButton_' + mydate.getDay() + mydate.getHours() + mydate.getMinutes() + mydate.getSeconds() + mydate.getMilliseconds() + Math.round(Math.random() * 10000);
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>

View File

@ -1,163 +1,181 @@
<template>
<div>
<el-form ref="form" :rules="rules" :model="form" label-width="120px">
<el-form-item :label="this.$t('ibp.keyCode')" prop="code">
<el-input :disabled="true" v-model="form.code">
<el-button slot="append" :disabled="isUpdate" type="primary" @click="generateCode">{{$t('ibp.generateCode')}}</el-button>
</el-input>
</el-form-item>
<el-form-item :label="this.$t('ibp.keyWidth')" prop="keyWidth">
<el-input-number v-model="form.keyWidth" controls-position="right" :min="1"></el-input-number>
</el-form-item>
<el-form-item :label="this.$t('ibp.keyDirection')" prop="status">
<el-select v-model="form.status" :placeholder="this.$t('rules.selectTheKeyDirection')">
<el-option :label="this.$t('ibp.level')" value="on"></el-option>
<el-option :label="this.$t('ibp.vertical')" value="off"></el-option>
</el-select>
</el-form-item>
<el-form-item :label="this.$t('ibp.xCoordinate')">
<el-input-number v-model="form.x" controls-position="right" :min="1"></el-input-number>
</el-form-item>
<el-form-item :label="this.$t('ibp.yCoordinate')">
<el-input-number v-model="form.y" controls-position="right" :min="1"></el-input-number>
</el-form-item>
<el-form-item :label="this.$t('ibp.upperText')" prop="topText">
<el-input v-model="form.topText"></el-input>
</el-form-item>
<el-form-item :label="this.$t('ibp.lowerText')" prop="bottomText">
<el-input v-model="form.bottomText"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit('form')">{{ buttonText }}</el-button>
<el-button v-show="showDeleteButton" @click="deleteDevice" type="danger">{{$t('global.delete')}}</el-button>
<el-button v-show="showDeleteButton" @click="initPage">{{$t('global.cancel')}}</el-button>
</el-form-item>
</el-form>
</div>
<div>
<el-form ref="form" :rules="rules" :model="form" label-width="120px">
<el-form-item :label="this.$t('ibp.keyCode')" prop="code">
<el-input v-model="form.code" :disabled="true">
<el-button slot="append" :disabled="isUpdate" type="primary" @click="generateCode">{{ $t('ibp.generateCode') }}</el-button>
</el-input>
</el-form-item>
<el-form-item :label="this.$t('ibp.keyWidth')" prop="keyWidth">
<el-input-number v-model="form.keyWidth" controls-position="right" :min="1" />
</el-form-item>
<el-form-item :label="this.$t('ibp.keyDirection')" prop="status">
<el-select v-model="form.status" :placeholder="this.$t('rules.selectTheKeyDirection')">
<el-option :label="this.$t('ibp.level')" value="on" />
<el-option :label="this.$t('ibp.vertical')" value="off" />
</el-select>
</el-form-item>
<el-form-item :label="this.$t('ibp.xCoordinate')">
<el-input-number v-model="form.x" controls-position="right" :min="1" />
</el-form-item>
<el-form-item :label="this.$t('ibp.yCoordinate')">
<el-input-number v-model="form.y" controls-position="right" :min="1" />
</el-form-item>
<el-form-item :label="this.$t('ibp.upperText')" prop="topText">
<el-input v-model="form.topText" />
</el-form-item>
<el-form-item :label="this.$t('ibp.lowerText')" prop="bottomText">
<el-input v-model="form.bottomText" />
</el-form-item>
<el-form-item label="操作">
<el-select v-model="form.mean" placeholder="请选择">
<el-option
v-for="item in operateMeanList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit('form')">{{ buttonText }}</el-button>
<el-button v-show="showDeleteButton" type="danger" @click="deleteDevice">{{ $t('global.delete') }}</el-button>
<el-button v-show="showDeleteButton" @click="initPage">{{ $t('global.cancel') }}</el-button>
</el-form-item>
</el-form>
</div>
</template>
<script>
export default {
name: 'KeyDraft',
components: {
},
data() {
return {
isUpdate: false,
buttonText: this.$t('ibp.createNow'),
showDeleteButton: false,
form: {
code: '',
keyWidth: '',
status:'on',
x: 10,
y: 10,
topText:'',
bottomText:''
},
rules: {
code: [
{ required: true, message: this.$t('rules.enterTheKeyCode'), trigger: 'blur' },
],
keyWidth: [
{ required: true, message: this.$t('rules.enterTheKeyWidth'), trigger: 'blur' },
],
status: [
{ required: true, message: this.$t('rules.selectTheKeyDirection'), trigger: 'change' },
],
topText: [
{ required: true, message: this.$t('rules.enterTheUpperText'), trigger: 'blur' },
],
bottomText: [
{ required: true, message: this.$t('rules.enterTheLowerText'), trigger: 'blur' },
],
}
};
},
computed: {
},
watch: {
'$store.state.ibp.rightClickCount': function (val) {
const model = this.$store.getters['ibp/updateDeviceData'];
if (model._type === 'Key' ){
this.buttonText = this.$t('global.modify');
this.showDeleteButton = true;
this.isUpdate = true;
this.form.code = model.code;
this.form.keyWidth = model.width;
this.form.status = model.status;
this.form.x = model.point.x;
this.form.y = model.point.y;
this.form.topText = model.topText;
this.form.bottomText = model.bottomText;
}
export default {
name: 'KeyDraft',
components: {
},
data() {
return {
isUpdate: false,
buttonText: this.$t('ibp.createNow'),
showDeleteButton: false,
form: {
code: '',
keyWidth: '',
status:'on',
x: 10,
y: 10,
topText:'',
bottomText:''
},
operateMeanList: [
{ label: '上行屏蔽门操作开关', value: 'Ban_Up_Open_Screen_Door' },
{ label: '下行屏蔽门操作开关', value: 'Ban_Down_Open_Screen_Door' }
],
rules: {
code: [
{ required: true, message: this.$t('rules.enterTheKeyCode'), trigger: 'blur' }
],
keyWidth: [
{ required: true, message: this.$t('rules.enterTheKeyWidth'), trigger: 'blur' }
],
status: [
{ required: true, message: this.$t('rules.selectTheKeyDirection'), trigger: 'change' }
],
topText: [
{ required: true, message: this.$t('rules.enterTheUpperText'), trigger: 'blur' }
],
bottomText: [
{ required: true, message: this.$t('rules.enterTheLowerText'), trigger: 'blur' }
]
}
},
mounted() {
},
methods: {
onSubmit(form) {
this.$refs[form].validate((valid) => {
if(valid) {
const keyModel = {
point: {
x: this.form.x,
y: this.form.y
},
draggable: true,
_type: 'Key',
code: this.form.code,
width: this.form.keyWidth,
status:this.form.status,
topText:this.form.topText,
bottomText:this.form.bottomText,
};
this.$emit('createKey', keyModel);
this.initPage();
}else {
return false;
}
});
};
},
computed: {
},
deleteDevice() {
const keyModel = {
point: {
x: this.form.x,
y: this.form.y
},
draggable: true,
_type: 'Key',
code: this.form.code,
width: this.form .keyWidth,
status:this.form.status,
topText:this.form.topText,
bottomText:this.form.bottomText,
};
this.$emit('deleteDataModel',keyModel);
this.initPage();
},
initPage() {
this.isUpdate = false;
this.buttonText = this.$t('ibp.createNow');
this.showDeleteButton = false;
this.form = {
code: '',
keyWidth: '',
status:'on',
x: 10,
y: 10,
topText:'',
bottomText:'',
};
},
generateCode() {
const mydate = new Date();
this.form.code = "key_"+mydate.getDay()+ mydate.getHours()+ mydate.getMinutes()+mydate.getSeconds()+mydate.getMilliseconds()+ Math.round(Math.random() * 10000);
},
watch: {
'$store.state.ibp.rightClickCount': function (val) {
const model = this.$store.getters['ibp/updateDeviceData'];
if (model._type === 'Key' ) {
this.buttonText = this.$t('global.modify');
this.showDeleteButton = true;
this.isUpdate = true;
this.form.code = model.code;
this.form.keyWidth = model.width;
this.form.status = model.status;
this.form.x = model.point.x;
this.form.y = model.point.y;
this.form.topText = model.topText;
this.form.bottomText = model.bottomText;
this.form.mean = model.mean;
}
}
};
},
mounted() {
},
methods: {
onSubmit(form) {
this.$refs[form].validate((valid) => {
if (valid) {
const keyModel = {
point: {
x: this.form.x,
y: this.form.y
},
draggable: true,
_type: 'Key',
code: this.form.code,
width: this.form.keyWidth,
status:this.form.status,
topText:this.form.topText,
bottomText:this.form.bottomText,
mean:this.form.mean
};
this.$emit('createKey', keyModel);
this.initPage();
} else {
return false;
}
});
},
deleteDevice() {
const keyModel = {
point: {
x: this.form.x,
y: this.form.y
},
draggable: true,
_type: 'Key',
code: this.form.code,
width: this.form.keyWidth,
status:this.form.status,
topText:this.form.topText,
bottomText:this.form.bottomText,
mean:this.form.mean
};
this.$emit('deleteDataModel', keyModel);
this.initPage();
},
initPage() {
this.isUpdate = false;
this.buttonText = this.$t('ibp.createNow');
this.showDeleteButton = false;
this.form = {
code: '',
keyWidth: '',
status:'on',
x: 10,
y: 10,
topText:'',
bottomText:'',
mean:''
};
},
generateCode() {
const mydate = new Date();
this.form.code = 'key_' + mydate.getDay() + mydate.getHours() + mydate.getMinutes() + mydate.getSeconds() + mydate.getMilliseconds() + Math.round(Math.random() * 10000);
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>

View File

@ -14,7 +14,20 @@
</el-form-item>
<el-form-item :label="this.$t('ibp.yCoordinate')">
<el-input-number v-model="form.y" controls-position="right" :min="1"></el-input-number>
</el-form-item>
</el-form-item>
<el-form-item label="表示状态">
<el-select v-model="form.mean" placeholder="请选择">
<el-option
v-for="item in showMeanList"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="关联设备">
<el-input v-model="form.linkDevice"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit('form')">{{ buttonText }}</el-button>
<el-button v-show="showDeleteButton" @click="deleteDevice" type="danger">{{$t('global.delete')}}</el-button>
@ -34,11 +47,18 @@
isUpdate: false,
buttonText: this.$t('ibp.createNow'),
showDeleteButton: false,
showMeanList: [
{label: '扣车', value: 'Show_Detain'},
{label: '屏蔽门打开', value: 'Show_Open_Screen_Door'},
{label: '屏蔽门紧闭', value: 'Show_Close_Screen_Door'}
],
form: {
code: '',
r: '',
x: 10,
y: 10
y: 10,
mean: '',
linkDevice: ''
},
rules: {
code: [
@ -64,6 +84,8 @@
this.form.r = model.r;
this.form.x = model.point.x;
this.form.y = model.point.y;
this.form.mean = model.mean;
this.form.linkDevice = model.linkDevice;
}
}
},
@ -81,6 +103,8 @@
_type: 'CircularLamp',
code: this.form.code,
r: this.form.r,
mean: this.form.mean,
linkDevice: this.form.linkDevice,
fillColor: '#332C22'
};
this.$emit('createLamp', lampModel);
@ -100,6 +124,8 @@
_type: 'CircularLamp',
code: this.form.code,
r: this.form.r,
mean: this.form.mean,
linkDevice: this.form.linkDevice,
fillColor: '#332C22'
};
this.$emit('deleteDataModel',lampModel );
@ -113,7 +139,9 @@
code: '',
r: '',
x: 10,
y: 10
y: 10,
mean: '',
linkDevice: '',
};
},
generateCode() {

View File

@ -73,7 +73,8 @@ export default {
members: [],
stationList: [],
standList: [],
doorList: []
doorList: [],
timer: null
};
},
computed: {
@ -109,19 +110,27 @@ export default {
//
'$store.state.socket.realDeviceInfo': async function (val) {
await this.getStandList();
},
//
'$route': async function() {
await this.loadInit();
}
},
async created() {
await this.getRoomInfo();
await this.getUserList();
await this.getStandList();
await this.getStaionList(this.room.mapId);
await this.getDoorList(this.room.mapId, this.stationList);
this.timeDemon = setInterval(() => {
checkLoginLine();
}, 5000 * 60);
await this.loadInit();
},
methods: {
async loadInit() {
await this.getRoomInfo();
await this.getUserList();
await this.getStandList();
await this.getStaionList(this.room.mapId);
await this.getDoorList(this.room.mapId, this.stationList);
if (this.timer) { clearInterval(this.timer); }
this.timer = setInterval(() => {
checkLoginLine();
}, 5000 * 60);
},
async getRoomInfo() {
const resp = await postRoomDetail(this.group);
this.room = {