ibp盘调整

This commit is contained in:
fan 2019-09-06 10:27:13 +08:00
parent f8df75252f
commit 20acc0e667
2 changed files with 73 additions and 60 deletions

View File

@ -1,5 +1,6 @@
import Group from 'zrender/src/container/Group'; import Group from 'zrender/src/container/Group';
import Text from 'zrender/src/graphic/Text'; import Text from 'zrender/src/graphic/Text';
import Rect from 'zrender/src/graphic/shape/Rect';
export default class ibpText extends Group { export default class ibpText extends Group {
constructor(device) { constructor(device) {
@ -34,17 +35,28 @@ export default class ibpText extends Group {
textAlign: model.textAlign, textAlign: model.textAlign,
textPosition: model.textPosition || 'inside', textPosition: model.textPosition || 'inside',
textVerticalAlign: model.textVerticalAlign || null, textVerticalAlign: model.textVerticalAlign || null,
textLineHeight: model.fontSize, textLineHeight: model.fontSize
textRect: model.textRect?{
x: model.textRect.x,
y: model.textRect.y,
width: model.textRect.width,
height: model.textRect.height
}: '',
textBackgroundColor: model.textBackgroundColor
} }
}); });
// if ( model.hasRect) {
// this.grouper.add(this.tip);
// this.tip = new Rect({
// zlevel: model.zlevel,
// z: model.z-1,
// draggable: false,
// shape: {
// x: model.textRect.x- model.point.x,
// y: model.textRect.x - model.point.y,
// width: model.textRect.width,
// height: model.textRect.height
// },
// style: {
// fill: model.textBackgroundColor
// }
// });
// }
this.grouper.add(this.textName); this.grouper.add(this.textName);
this.add(this.grouper); this.add(this.grouper);
} }
setModel(dx, dy) { setModel(dx, dy) {

View File

@ -24,24 +24,24 @@
<el-form-item label="Y轴坐标"> <el-form-item label="Y轴坐标">
<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-input-number>
</el-form-item> </el-form-item>
<el-form-item label="文字背景"> <!--<el-form-item label="文字背景">-->
<el-switch v-model="form.hasRect" @change="handleChange"></el-switch> <!--<el-switch v-model="form.hasRect" @change="handleChange"></el-switch>-->
</el-form-item> <!--</el-form-item>-->
<el-form-item v-show="form.hasRect" label="背景X轴坐标"> <!--<el-form-item v-show="form.hasRect" label="背景X轴坐标">-->
<el-input-number v-model="form.xBg" controls-position="right" :min="0"></el-input-number> <!--<el-input-number v-model="form.xBg" controls-position="right" :min="0"></el-input-number>-->
</el-form-item> <!--</el-form-item>-->
<el-form-item v-show="form.hasRect" label="背景Y轴坐标"> <!--<el-form-item v-show="form.hasRect" label="背景Y轴坐标">-->
<el-input-number v-model="form.yBg" controls-position="right" :min="0"></el-input-number> <!--<el-input-number v-model="form.yBg" controls-position="right" :min="0"></el-input-number>-->
</el-form-item> <!--</el-form-item>-->
<el-form-item v-show="form.hasRect" label="背景宽度"> <!--<el-form-item v-show="form.hasRect" label="背景宽度">-->
<el-input-number v-model="form.bgWidth" controls-position="right" :min="1"></el-input-number> <!--<el-input-number v-model="form.bgWidth" controls-position="right" :min="1"></el-input-number>-->
</el-form-item> <!--</el-form-item>-->
<el-form-item v-show="form.hasRect" label="背景高度"> <!--<el-form-item v-show="form.hasRect" label="背景高度">-->
<el-input-number v-model="form.bgHeight" controls-position="right" :min="1"></el-input-number> <!--<el-input-number v-model="form.bgHeight" controls-position="right" :min="1"></el-input-number>-->
</el-form-item> <!--</el-form-item>-->
<el-form-item v-show="form.hasRect" label="背景颜色" prop="elevatorColor"> <!--<el-form-item v-show="form.hasRect" label="背景颜色" prop="elevatorColor">-->
<el-color-picker v-model="form.textBackgroundColor"></el-color-picker> <!--<el-color-picker v-model="form.textBackgroundColor"></el-color-picker>-->
</el-form-item> <!--</el-form-item>-->
<el-form-item> <el-form-item>
<el-button type="primary" @click="onSubmit('form')">{{ buttonText }}</el-button> <el-button type="primary" @click="onSubmit('form')">{{ buttonText }}</el-button>
<el-button v-show="showDeleteButton" @click="deleteDevice" type="danger">删除</el-button> <el-button v-show="showDeleteButton" @click="deleteDevice" type="danger">删除</el-button>
@ -69,12 +69,12 @@
fontWeight: '', fontWeight: '',
x: 10, x: 10,
y: 10, y: 10,
hasRect: false, // hasRect: false,
xBg: 10, // xBg: 10,
yBg: 10, // yBg: 10,
bgWidth: 0, // bgWidth: 0,
bgHeight: 0, // bgHeight: 0,
textBackgroundColor: '' // textBackgroundColor: ''
}, },
rules: { rules: {
code: [ code: [
@ -113,12 +113,12 @@
this.form.fontWeight = model.fontWeight; this.form.fontWeight = model.fontWeight;
this.form.x = model.point.x; this.form.x = model.point.x;
this.form.y = model.point.y; this.form.y = model.point.y;
this.form.hasRect = model.hasRect; // this.form.hasRect = model.hasRect;
this.form.xBg = model.textRect ? model.textRect.x : 10; // this.form.xBg = model.textRect ? model.textRect.x : 10;
this.form.yBg = model.textRect ? model.textRect.y : 10; // this.form.yBg = model.textRect ? model.textRect.y : 10;
this.form.bgWidth = model.textRect ? model.textRect.width : 0; // this.form.bgWidth = model.textRect ? model.textRect.width : 0;
this.form.bgHeight = model.textRect ? model.textRect.height : 0; // this.form.bgHeight = model.textRect ? model.textRect.height : 0;
this.form.textBackgroundColor = model.textRect ? model.textRect.textBackgroundColor : ''; // this.form.textBackgroundColor = model.textRect ? model.textRect.textBackgroundColor : '';
} }
} }
}, },
@ -140,15 +140,15 @@
fontSize: this.form.fontSize , fontSize: this.form.fontSize ,
fontWeight: this.form.fontWeight, fontWeight: this.form.fontWeight,
fontFamily: 'consolas', fontFamily: 'consolas',
hasRect: this.form.hasRect, // hasRect: this.form.hasRect,
textRect: this.form.hasRect ? // textRect: this.form.hasRect ?
{ // {
x: this.form.xBg, // x: this.form.xBg,
y: this.form.yBg, // y: this.form.yBg,
width: this.form.bgWidth, // width: this.form.bgWidth,
height: this.form.bgHeight // height: this.form.bgHeight
}:'', // }:'',
textBackgroundColor: this.form.hasRect?this.form.textBackgroundColor: '' // textBackgroundColor: this.form.hasRect?this.form.textBackgroundColor: ''
}; };
this.$emit('createText', textModel); this.$emit('createText', textModel);
this.initPage(); this.initPage();
@ -172,15 +172,15 @@
fontSize: this.form.fontSize , fontSize: this.form.fontSize ,
fontWeight: this.form.fontWeight, fontWeight: this.form.fontWeight,
fontFamily: 'consolas', fontFamily: 'consolas',
hasRect: this.form.hasRect, // hasRect: this.form.hasRect,
textRect: this.form.hasRect ? // textRect: this.form.hasRect ?
{ // {
x: this.form.xBg, // x: this.form.xBg,
y: this.form.yBg, // y: this.form.yBg,
width: this.form.bgWidth, // width: this.form.bgWidth,
height: this.form.bgHeight // height: this.form.bgHeight
}:'', // }:'',
textBackgroundColor: this.form.hasRect?this.form.textBackgroundColor: '' // textBackgroundColor: this.form.hasRect?this.form.textBackgroundColor: ''
}; };
this.$emit('deleteDataModel',textModel); this.$emit('deleteDataModel',textModel);
this.initPage(); this.initPage();
@ -203,10 +203,11 @@
const mydate = new Date(); const mydate = new Date();
this.form.code = "text_"+mydate.getDay()+ mydate.getHours()+ mydate.getMinutes()+mydate.getSeconds()+mydate.getMilliseconds()+ Math.round(Math.random() * 10000); this.form.code = "text_"+mydate.getDay()+ mydate.getHours()+ mydate.getMinutes()+mydate.getSeconds()+mydate.getMilliseconds()+ Math.round(Math.random() * 10000);
}, },
handleChange(e) { // handleChange(e) {
// this.form.hasRect = !this.form.hasRect; // this.form.hasRect = e;
console.log('-------',e,this.form.hasRect); // // this.form.hasRect = !this.form.hasRect;
} // console.log('-------',e,this.form.hasRect);
// }
} }
}; };
</script> </script>