| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172 |
- <template>
- <div class='edit-box'>
- <el-form ref='form' :rules='rules' :model='form' label-width='140px'>
- <el-form-item v-if='devFlag' label='设备标识' prop='EquipmentMark'>
- <el-input v-model='form.EquipmentMark'></el-input>
- </el-form-item>
- </el-form>
- <div class='formula-box'>
- <p>原始点位</p>
- <p class='xia-1'>👇</p>
- <div>
- 截取:
- <el-switch v-model='subStrVal' active-color='#13ce66' inactive-color='#ff4949'></el-switch>
- <p class='sub-p'>
- <el-input-number v-model='from' :min='1' :max='10' label='描述文字' :disabled='!subStrVal'></el-input-number>位 - 第
- <el-input-number
- v-model='to'
- :min='1'
- :max='10'
- label='描述文字'
- :disabled='!subStrVal'
- @change='subToChange'
- ></el-input-number>位(从1开始)
- </p>
- </div>
- <p class='xia-2'>👇</p>
- <p>
- 仅提取其中的数值:
- <el-switch v-model='extract' active-color='#13ce66' inactive-color='#ff4949'></el-switch>
- </p>
- <p class='xia-3'>👇</p>
- <p>
- 数值计算:
- <el-switch v-model='valCountVal' active-color='#13ce66' inactive-color='#ff4949'></el-switch>
- </p>
- <p>
- <el-select class='mark' v-model='mark' placeholder='请选择' :disabled='!valCountVal'>
- <el-option v-for='item in markArr' :key='item.value' :label='item.label' :value='item.value'></el-option>
- </el-select>
- <el-input class='mark-value' v-model='markValue' :disabled='!valCountVal'></el-input>
- </p>
- </div>
- </div>
- </template>
- <script>
- export default {
- name: 'step3_formula-handle',
- data() {
- return {
- form: {
- EquipmentMark: '',
- },
- extract: true,
- rules: {
- EquipmentMark: [{ required: true, message: '请输入设备标识', trigger: 'blur' }]
- },
- subStrVal: true,
- from: 1,
- to: 1,
- valCountVal: true,
- mark: 'plus',
- markValue: '',
- markArr: [
- {
- label: '+',
- value: 'plus'
- }
- ]
- }
- },
- props: {
- devFlag: {
- default: true,
- type: Boolean
- },
- formulaHandleShow: {}
- },
- methods: {
- getForm(cb) {
- this.$refs['form'].validate(valid => {
- if (valid) {
- if (this.subStrVal) {
- this.form.from = this.from
- this.form.to = this.to
- }
- if (this.valCountVal) {
- if (!this.markValue) {
- this.$message({
- message: '请填写数值计算',
- type: 'warning'
- })
- return
- } else {
- this.form.mark = this.mark
- this.form.markValue = this.markValue
- }
- }
- this.form.extract = this.extract
- cb(this.form)
- } else {
- cb(false)
- }
- })
- },
- subToChange(val) {}
- },
- watch: {
- from(val) {
- if (val > this.to) {
- this.to = val
- }
- },
- formulaHandleShow: {
- deep: true,
- immediate: true,
- handler(val) {
- if (val) {
- this.form = val
- if (this.form.cut) {
- this.subStrVal = true
- this.from = this.form.cut.from
- this.to = this.form.cut.to
- } else {
- this.subStrVal = false
- this.from =1
- this.to = 1
- }
- if(this.form.count) {
- this.valCountVal = true
- this.mark = this.form.count.calculationtype
- this.markValue = this.form.count.value
- } else {
- this.valCountVal = false
- this.mark = 'plus'
- this.markValue = ''
- }
- if(this.form.extractArr && this.form.extractArr.length) {
- this.extract = true
- } else {
- this.extract = false
- }
- }
- }
- }
- }
- }
- </script>
- <style lang='scss' scoped>
- .edit-box {
- .formula-box {
- padding-left: 40px;
- .sub-p {
- margin-top: 10px;
- }
- .xia-2 {
- padding-left: 50px;
- }
- .xia-3 {
- padding-left: 100px;
- }
- .mark {
- width: 100px;
- }
- .mark-value {
- margin-left: 30px;
- width: 200px;
- }
- }
- }
- </style>
|