iscs 冷冻泵/冷却泵添加
This commit is contained in:
joylink_cuiweidong
parent
02b2ce19f1
commit
394c5b776c
@ -15,4 +15,11 @@ deviceRender[deviceType.CheckBox] = {
|
||||
z: 0
|
||||
};
|
||||
|
||||
/** FrozenPump渲染配置 */
|
||||
deviceRender[deviceType.FrozenPump] = {
|
||||
_type: deviceType.FrozenPump,
|
||||
zlevel: 10,
|
||||
z: 0
|
||||
};
|
||||
|
||||
export default deviceRender;
|
||||
|
||||
@ -1,6 +1,7 @@
|
||||
const deviceType = {
|
||||
ManualAlarmButton: 'manualAlarmButton',
|
||||
CheckBox: 'CheckBox'
|
||||
CheckBox: 'CheckBox',
|
||||
FrozenPump:'FrozenPump'
|
||||
};
|
||||
|
||||
export default deviceType;
|
||||
|
||||
@ -1,11 +1,12 @@
|
||||
import ManualAlarmButton from './manualAlarmButton';
|
||||
import deviceType from '../constant/deviceType';
|
||||
import CheckBox from './checkBox';
|
||||
import FrozenPump from './frozenPump';
|
||||
|
||||
const iscsShape = {};
|
||||
iscsShape[deviceType.ManualAlarmButton] = ManualAlarmButton;
|
||||
iscsShape[deviceType.CheckBox] = CheckBox;
|
||||
|
||||
iscsShape[deviceType.FrozenPump] = FrozenPump;
|
||||
function shapefactory(device, iscs) {
|
||||
const type = device.model._type;
|
||||
const shape = iscsShape[type];
|
||||
|
||||
56
src/iscs/shape/frozenPump.js
Normal file
56
src/iscs/shape/frozenPump.js
Normal file
@ -0,0 +1,56 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Circle from 'zrender/src/graphic/shape/Circle';
|
||||
import Polygon from 'zrender/src/graphic/shape/Polygon';
|
||||
export default class frozenPump extends Group {
|
||||
constructor(device) {
|
||||
super();
|
||||
this.model = device.model;
|
||||
this._type = device.model._type;
|
||||
this._code = device.model.code;
|
||||
this.zlevel = device.model.zlevel;
|
||||
this.z = device.model.zlevel;
|
||||
this.create();
|
||||
}
|
||||
create() {
|
||||
this.grouper = new Group({
|
||||
id: this.model.code,
|
||||
position: [this.model.point.x, this.model.point.y]
|
||||
});
|
||||
this.circleOutside = new Circle({
|
||||
zlevel: this.model.zlevel,
|
||||
z: this.model.z,
|
||||
shape: {
|
||||
cx: this.model.width / 2,
|
||||
cy: this.model.width / 2,
|
||||
r: this.model.width / 2
|
||||
},
|
||||
style: {
|
||||
stroke: this.model.strokeColor,
|
||||
lineWidth:2
|
||||
}
|
||||
});
|
||||
this.triangle = new Polygon({
|
||||
zlevel: this.model.zlevel,
|
||||
z: this.model.z,
|
||||
shape:{
|
||||
points:[
|
||||
[this.model.width / 4, this.model.width / 2 * 0.133975],
|
||||
[this.model.width / 4, this.model.width / 2 * 1.866025],
|
||||
[this.model.width, this.model.width / 2],
|
||||
[this.model.width / 4, this.model.width / 2 * 0.133975]
|
||||
]
|
||||
},
|
||||
style: {
|
||||
fill: this.model.strokeColor,
|
||||
stroke:this.model.strokeColor
|
||||
}
|
||||
});
|
||||
this.grouper.add(this.circleOutside);
|
||||
this.grouper.add(this.triangle);
|
||||
this.add(this.grouper);
|
||||
}
|
||||
setModel(dx, dy) {
|
||||
this.model.point.x += dx;
|
||||
this.model.point.y += dy;
|
||||
}
|
||||
}
|
||||
@ -39,6 +39,9 @@ export function parser(data) {
|
||||
zrUtil.each(data.manualAlarmButtonList || [], elem => {
|
||||
iscsDevice[elem.code] = deviceFactory(deviceType.ManualAlarmButton, elem);
|
||||
}, this);
|
||||
zrUtil.each(data.frozenPumpList || [], elem => {
|
||||
iscsDevice[elem.code] = deviceFactory(deviceType.FrozenPump, elem);
|
||||
}, this);
|
||||
}
|
||||
|
||||
return iscsDevice;
|
||||
@ -63,9 +66,15 @@ function updateIscsListByDevice(iscs, name, device) {
|
||||
export function updateIscsData(device) {
|
||||
const iscsData = store.getters['iscs/iscs'];
|
||||
switch (device._type) {
|
||||
case deviceType.ManualAlarmButton :
|
||||
case deviceType.ManualAlarmButton : {
|
||||
updateIscsListByDevice(iscsData, 'manualAlarmButtonList', device);
|
||||
break;
|
||||
}
|
||||
case deviceType.FrozenPump : {
|
||||
updateIscsListByDevice(iscsData, 'frozenPumpList', device);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
store.dispatch('iscs/setIscsData', iscsData);
|
||||
}
|
||||
|
||||
@ -36,7 +36,9 @@ export default {
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
$route(val) {
|
||||
|
||||
}
|
||||
},
|
||||
created() {
|
||||
},
|
||||
|
||||
144
src/views/system/iscsDraw/iscsBasOperate/frozenPump.vue
Normal file
144
src/views/system/iscsDraw/iscsBasOperate/frozenPump.vue
Normal file
@ -0,0 +1,144 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-form ref="form" :rules="rules" :model="form" label-width="100px">
|
||||
<el-form-item label="编号" 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="类型" prop="type">
|
||||
<el-select v-model="form.type" placeholder="请选择类型">
|
||||
<el-option label="冷冻泵" value="frozenPump" />
|
||||
<el-option label="冷却泵" value="coolPump" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="图形宽度" prop="width">
|
||||
<el-input-number v-model="form.width" :min="10" />
|
||||
</el-form-item>
|
||||
<el-form-item label="X轴坐标" prop="x">
|
||||
<el-input-number v-model="form.x" controls-position="right" :min="1" />
|
||||
</el-form-item>
|
||||
<el-form-item label="Y轴坐标" prop="y">
|
||||
<el-input-number v-model="form.y" controls-position="right" :min="1" />
|
||||
</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:'FrozenPump',
|
||||
data() {
|
||||
return {
|
||||
isUpdate:false,
|
||||
showDeleteButton: false,
|
||||
buttonText: '立即创建',
|
||||
form:{
|
||||
code:'',
|
||||
type:'',
|
||||
width: 25,
|
||||
x: 10,
|
||||
y: 10
|
||||
},
|
||||
rules: {
|
||||
code: [
|
||||
{ required: true, message:'请生成设备图形的编码', trigger: 'blur' }
|
||||
],
|
||||
width:[
|
||||
{ required: true, message:'请输入设备图形宽度', trigger: 'blur' }
|
||||
],
|
||||
x: [
|
||||
{ required: true, message: '请输入设备图形的X轴坐标', trigger: 'blur' }
|
||||
],
|
||||
y: [
|
||||
{ required: true, message: '请输入设备图形的Y轴坐标', trigger: 'blur' }
|
||||
],
|
||||
type: [
|
||||
{ required: true, message: '请选择设备的类型', trigger: 'change' }
|
||||
]
|
||||
}
|
||||
};
|
||||
},
|
||||
computed:{
|
||||
|
||||
},
|
||||
watch:{
|
||||
'$store.state.ibp.rightClickCount': function (val) {
|
||||
const model = this.$store.getters['ibp/updateDeviceData'];
|
||||
if (model._type === 'FrozenPump' ) {
|
||||
this.buttonText = '修改';
|
||||
this.showDeleteButton = true;
|
||||
this.isUpdate = true;
|
||||
this.form.code = model.code;
|
||||
this.form.width = model.width;
|
||||
this.form.pumpType = model.pumpType;
|
||||
this.form.x = model.point.x;
|
||||
this.form.y = model.point.y;
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
methods:{
|
||||
onSubmit(form) {
|
||||
this.$refs[form].validate((valid) => {
|
||||
if (valid) {
|
||||
const frozenPumpModel = {
|
||||
point: {
|
||||
x: this.form.x,
|
||||
y: this.form.y
|
||||
},
|
||||
_type: 'FrozenPump',
|
||||
code: this.form.code,
|
||||
width: this.form.width,
|
||||
strokeColor:'#00ff00',
|
||||
pumpType:this.form.type
|
||||
};
|
||||
this.$emit('createFrozenPump', frozenPumpModel);
|
||||
this.initPage();
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
});
|
||||
|
||||
},
|
||||
initPage() {
|
||||
this.isUpdate = false;
|
||||
this.buttonText = this.$t('ibp.createNow');
|
||||
this.showDeleteButton = false;
|
||||
this.form = {
|
||||
code:'',
|
||||
type:'',
|
||||
width: 25,
|
||||
x: 10,
|
||||
y: 10
|
||||
};
|
||||
this.$refs.form.resetFields();
|
||||
},
|
||||
deleteDevice() {
|
||||
const frozenPumpModel = {
|
||||
point: {
|
||||
x: this.form.x,
|
||||
y: this.form.y
|
||||
},
|
||||
_type: 'FrozenPump',
|
||||
code: this.form.code,
|
||||
width: this.form.width,
|
||||
fillColor:'#00ff00',
|
||||
pumpType:this.form.type
|
||||
};
|
||||
this.$emit('deleteDataModel', frozenPumpModel );
|
||||
this.initPage();
|
||||
},
|
||||
generateCode() {
|
||||
const mydate = new Date();
|
||||
this.form.code = 'frozenPump_' + mydate.getDay() + mydate.getHours() + mydate.getMinutes() + mydate.getSeconds() + mydate.getMilliseconds() + Math.round(Math.random() * 10000);
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@ -3,7 +3,7 @@
|
||||
<div class="map-control heightClass">
|
||||
<el-card type="border-card" class="heightClass">
|
||||
<div slot="header" class="clearfix">
|
||||
<div>111111</div>
|
||||
<div style="display: inline-block;">111111</div>
|
||||
<el-button
|
||||
type="text"
|
||||
style="float: right; padding: 3px 0; margin-right: 5px;"
|
||||
@ -12,10 +12,10 @@
|
||||
</div>
|
||||
<el-tabs v-model="enabledTab" class="mapEdit" type="card" @tab-click="handleTabClick">
|
||||
<el-tab-pane label="冷冻泵/冷却泵" name="frozenPump">
|
||||
<manual-alarm-button
|
||||
ref="clock"
|
||||
<frozen-pump
|
||||
ref="frozenPump"
|
||||
style="width:90%"
|
||||
@createDataModel="createDataModel"
|
||||
@createFrozenPump="createDataModel"
|
||||
@deleteDataModel="deleteDataModel"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
@ -25,17 +25,25 @@
|
||||
</transition>
|
||||
</template>
|
||||
<script>
|
||||
import {deviceFactory} from '@/iscs/utils/parser';
|
||||
import FrozenPump from './frozenPump';
|
||||
export default {
|
||||
name: 'IscsOperate',
|
||||
// components: {
|
||||
// ManualAlarmButton
|
||||
// },
|
||||
components: {
|
||||
FrozenPump
|
||||
},
|
||||
mixins: [
|
||||
],
|
||||
data() {
|
||||
return {
|
||||
enabledTab: 'frozenPump'
|
||||
};
|
||||
},
|
||||
methods:{
|
||||
createDataModel(model) {
|
||||
const newModel = deviceFactory(model._type, model);
|
||||
this.$store.dispatch('iscs/updateIscsDevices', newModel.model);
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user