joylink/rt-sim-training-client
6
0
Fork 0
Code Issues 3 Pull Requests Actions Packages Projects Releases Wiki Activity

ibp绘图部分设备添加操作表示关联设备

Browse Source
This commit is contained in:
fan 2019-12-09 11:00:25 +08:00
parent d8b0577c77
commit 28e9abe13a
4 changed files with 359 additions and 288 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/scripts/ConstDic.js
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'},

64
src/views/system/ibpDraw/ibpOperate/ibpButton.vue
View File

@ -2,39 +2,49 @@
<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 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>
<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-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-input-number>
<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-input-number>
<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-input-number>
<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" @click="deleteDevice" type="danger">{{$t('global.delete')}}</el-button>
<el-button v-show="showDeleteButton" @click="initPage">{{$t('global.cancel')}}</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 {
export default {
name: 'ButtonDraft',
components: {
},
@ -43,6 +53,14 @@
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',
@ -52,13 +70,13 @@
},
rules: {
code: [
{ required: true, message: this.$t('ibp.enterTheButtonCode'), trigger: 'blur' },
{ 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' },
{ required: true, message: this.$t('ibp.enterTheButtonWidth'), trigger: 'blur' }
]
}
};
@ -69,7 +87,7 @@
watch: {
'$store.state.ibp.rightClickCount': function (val) {
const model = this.$store.getters['ibp/updateDeviceData'];
if (model._type === 'SquareButton' ){
if (model._type === 'SquareButton' ) {
this.buttonText = this.$t('global.modify');
this.showDeleteButton = true;
this.isUpdate = true;
@ -78,6 +96,7 @@
this.form.buttonWidth = model.width;
this.form.x = model.point.x;
this.form.y = model.point.y;
this.form.mean = model.mean;
}
}
},
@ -97,10 +116,11 @@
color: this.form.buttonColor,
status: 'off',
width: this.form.buttonWidth,
mean: this.from.mean
};
this.$emit('createButton', buttonModel);
this.initPage();
}else {
} else {
return false;
}
});
@ -116,8 +136,9 @@
color: this.form.buttonColor,
status: 'off',
width: this.form.buttonWidth,
mean: this.form.mean
};
this.$emit('deleteDataModel',buttonModel );
this.$emit('deleteDataModel', buttonModel );
this.initPage();
},
initPage() {
@ -129,15 +150,16 @@
buttonColor: 'red',
buttonWidth: 25,
x: 10,
y: 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);
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>

68
src/views/system/ibpDraw/ibpOperate/ibpKey.vue
View File

@ -2,42 +2,52 @@
<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 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-input-number>
<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>
<el-option :label="this.$t('ibp.vertical')" value="off"></el-option>
<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-input-number>
<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-input-number>
<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-input>
<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-input>
<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" @click="deleteDevice" type="danger">{{$t('global.delete')}}</el-button>
<el-button v-show="showDeleteButton" @click="initPage">{{$t('global.cancel')}}</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 {
export default {
name: 'KeyDraft',
components: {
},
@ -55,22 +65,26 @@
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' },
{ required: true, message: this.$t('rules.enterTheKeyCode'), trigger: 'blur' }
],
keyWidth: [
{ required: true, message: this.$t('rules.enterTheKeyWidth'), trigger: 'blur' },
{ required: true, message: this.$t('rules.enterTheKeyWidth'), trigger: 'blur' }
],
status: [
{ required: true, message: this.$t('rules.selectTheKeyDirection'), trigger: 'change' },
{ required: true, message: this.$t('rules.selectTheKeyDirection'), trigger: 'change' }
],
topText: [
{ required: true, message: this.$t('rules.enterTheUpperText'), trigger: 'blur' },
{ required: true, message: this.$t('rules.enterTheUpperText'), trigger: 'blur' }
],
bottomText: [
{ required: true, message: this.$t('rules.enterTheLowerText'), trigger: 'blur' },
],
{ required: true, message: this.$t('rules.enterTheLowerText'), trigger: 'blur' }
]
}
};
},
@ -80,7 +94,7 @@
watch: {
'$store.state.ibp.rightClickCount': function (val) {
const model = this.$store.getters['ibp/updateDeviceData'];
if (model._type === 'Key' ){
if (model._type === 'Key' ) {
this.buttonText = this.$t('global.modify');
this.showDeleteButton = true;
this.isUpdate = true;
@ -91,6 +105,7 @@
this.form.y = model.point.y;
this.form.topText = model.topText;
this.form.bottomText = model.bottomText;
this.form.mean = model.mean;
}
}
},
@ -99,7 +114,7 @@
methods: {
onSubmit(form) {
this.$refs[form].validate((valid) => {
if(valid) {
if (valid) {
const keyModel = {
point: {
x: this.form.x,
@ -112,10 +127,11 @@
status:this.form.status,
topText:this.form.topText,
bottomText:this.form.bottomText,
mean:this.form.mean
};
this.$emit('createKey', keyModel);
this.initPage();
}else {
} else {
return false;
}
});
@ -130,12 +146,13 @@
draggable: true,
_type: 'Key',
code: this.form.code,
width: this.form .keyWidth,
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.$emit('deleteDataModel', keyModel);
this.initPage();
},
initPage() {
@ -150,14 +167,15 @@
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);
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>

32
src/views/system/ibpDraw/ibpOperate/ibpLamp.vue
View File

@ -15,6 +15,19 @@
<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="表示状态">
<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() {