GuoYuFu123 6 年之前
父节点
当前提交
05d35dfe88

+ 40 - 0
src/components/config_point/step3_edit/auto_handle.vue

@@ -0,0 +1,40 @@
+<template>
+    <el-form ref='form' :model='form' label-width='120px'>
+        <el-form-item label='设备标识:'>
+            <el-input v-model='form.name'></el-input>
+        </el-form-item>
+        <el-form-item label='原始点位单位:'>
+            <el-select v-model='form.unit' placeholder='请选择'>
+                <el-option v-for='item in unitArr' :key='item.value' :label='item.label' :value='item.value'></el-option>
+            </el-select>
+            <p class='tip'>数据字典信息点-额定电压(v)</p>
+        </el-form-item>
+    </el-form>
+</template>
+
+<script>
+export default {
+    name: 'step3_auto-handle',
+    data() {
+        return {
+            form: {
+                name: '',
+                unit: '0'
+            },
+            unitArr: [{
+                label: 'Kv',
+                value: '0'
+            },{
+                label: 'Cm',
+                value: '1'
+            }]
+        }
+    }
+}
+</script>
+
+<style scoped lang='scss'>
+.tip {
+    color: #ccc;
+}
+</style>

+ 103 - 0
src/components/config_point/step3_edit/enum_handle.vue

@@ -0,0 +1,103 @@
+<template>
+    <div class='edit-box'>
+        <el-form ref='form' :model='form' label-width='120px'>
+            <el-form-item label='设备标识:'>
+                <el-input v-model='form.name'></el-input>
+            </el-form-item>
+        </el-form>
+        <ul class='point-box'>
+            <p class='character'>
+                <span>如果</span>
+            </p>
+            <p class='character nm'>
+                <span>那么</span>
+            </p>
+            <li v-for='(item,index) in pointArr' :key='index'>
+                <p>
+                    <span class='name'>原始点位值 =</span>
+                    <span class='value'>
+                        <el-input v-model='item.old'></el-input>
+                    </span>
+                </p>
+                <p>
+                    <span class='name'>转换为标准值 =</span>
+                    <span class='value'>
+                        <el-input v-model='item.new'></el-input>
+                    </span>
+                    <i class='el-icon-delete delete'></i>
+                </p>
+            </li>
+        </ul>
+        <div class='add-btn-box'>
+            <el-button type='primary'>+添加新转换规则</el-button>
+        </div>
+    </div>
+</template>
+
+<script>
+export default {
+    name: 'step3_auto-handle',
+    data() {
+        return {
+            form: {
+                name: ''
+            },
+            pointArr: [{
+                old: '',
+                new: ''
+            },{
+                old: '',
+                new: ''
+            }]
+        }
+    }
+}
+</script>
+
+<style scoped lang='scss'>
+.edit-box {
+    padding: 20px 0; 
+    .tip {
+        color: #ccc;
+    }
+    .point-box {
+        margin-top: 45px;
+        position: relative;
+        width: 600px;
+        .character {
+            position: absolute;
+            top: -25px;
+            left: 0;
+            font-size: 22px;
+            width: 600px;
+            text-align: left;
+        }
+        .nm {
+            text-align: center;
+        }
+        li {
+            display: flex;
+            justify-content: space-between;
+            margin-top:5px;
+            p {
+                .name {
+                    padding-left: 80px;
+                }
+                .value {
+                    margin-left: 10px;
+                    display: inline-block;
+                    width: 80px;
+                }
+                .delete {
+                    margin-left: 5px;
+                    cursor: pointer;
+                }
+            }
+        }
+    }
+    .add-btn-box {
+        margin-top: 20px;
+        text-align: center;
+    }
+}
+</style>

+ 75 - 0
src/components/config_point/step3_edit/formula_handle.vue

@@ -0,0 +1,75 @@
+<template>
+    <div class='edit-box'>
+        <el-form ref='form' :model='form' label-width='120px'>
+            <el-form-item label='设备标识'>
+                <el-input v-model='form.name'></el-input>
+            </el-form-item>
+        </el-form>
+        <div class='formula-box'>
+            <p>原始点位</p>
+            <p class='xia-1'>👇</p>
+            <p>
+                截取:
+                <el-switch v-model='subStrVal' active-color='#13ce66' inactive-color='#ff4949'></el-switch>
+            </p>
+            <p class='xia-2'>👇</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="请选择">
+                    <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'></el-input>
+            </p>
+        </div>
+    </div>
+</template>
+
+<script>
+export default {
+    name: 'step3_formula-handle',
+    data() {
+        return {
+            form: {
+                name: ''
+            },
+            subStrVal: true,
+            valCountVal: true,
+            mark:'0',
+            markValue: '',
+            markArr:[{
+                label: '✖',
+                value: '0'
+            },{
+                label: '➗',
+                value: '1'
+            }]
+        }
+    }
+}
+</script>
+
+<style lang='scss' scoped>
+.edit-box {
+    .formula-box {
+        padding-left: 40px;
+        .xia-2 {
+            padding-left: 50px;
+        }
+        .mark {
+            width: 100px;
+        }
+        .mark-value {
+            margin-left: 30px;
+            width: 200px;
+        }
+    }
+}
+</style>

+ 141 - 0
src/components/config_point/step3_edit/index.vue

@@ -0,0 +1,141 @@
+<template>
+    <div class='box'>
+        <div class='left'>
+            <ul>
+                <li>
+                    <span>原始点位信息:</span>&nbsp;&nbsp;&nbsp;
+                    <span>XXX</span>
+                </li>
+                <li>
+                    <span>点位地址:</span>&nbsp;&nbsp;&nbsp;
+                    <span>XXX</span>
+                </li>
+                <li>
+                    <span>点位描述:</span>&nbsp;&nbsp;&nbsp;
+                    <span>XXX</span>
+                </li>
+                <li>
+                    <span>位置标签:</span>&nbsp;&nbsp;&nbsp;
+                    <span>XXX</span>
+                </li>
+                <li>
+                    <span>模式(读/写):</span>&nbsp;&nbsp;&nbsp;
+                    <span>XXX</span>
+                </li>
+                <li>
+                    <span>值/单位说明:</span>&nbsp;&nbsp;&nbsp;
+                    <span>XXX</span>
+                </li>
+                <li>
+                    <span>备注:</span>&nbsp;&nbsp;&nbsp;
+                    <span>XXX</span>
+                </li>
+            </ul>
+        </div>
+        <div class='right'>
+            <el-form class='form' ref='form' :model='form' label-width='120px'>
+                <el-form-item label='对应数据字典'>
+                    <el-input v-model='form.name'></el-input>
+                    <div class='dict'>
+                        <p class='top'>
+                            <i class='el-icon-plus'></i>
+                            <el-button type='text'>添加自定义信息点</el-button>
+                        </p>
+                        <p class='btm'>
+                            <el-input type='textarea' :rows='2' placeholder='信息点的单位及值的说明' v-model='textarea'></el-input>
+                        </p>
+                    </div>
+                </el-form-item>
+                <el-form-item label='值处理方式'>
+                    <el-select v-model='form.type' placeholder='请选择'>
+                        <el-option v-for='item in handleTypeArr' :key='item.value' :label='item.label' :value='item.value'></el-option>
+                    </el-select>
+                </el-form-item>
+                 <!-- components -->
+                <no-handle v-if='form.type == 0'></no-handle>
+                <auto-handle v-else-if='form.type == 1'></auto-handle>
+                <enum-handle v-else-if='form.type == 2'></enum-handle>
+                <formula-handle v-else-if='form.type == 3'></formula-handle>
+                <split-handle v-else></split-handle>
+            </el-form>
+           
+        </div>
+    </div>
+</template>
+
+<script>
+import noHandle from './no_handle';
+import autoHandle from './auto_handle'
+import enumHandle from './enum_handle'
+import formulaHandle from './formula_handle'
+import splitHandle from './split_handle'
+export default {
+    name: 'point_config_step3_edit',
+    data() {
+        return {
+            form: {
+                name: '',
+                type: ''
+            },
+            textarea: '',
+            handleTypeArr: [
+                {
+                    label: '无需处理,直接使用',
+                    value: '0'
+                },{
+                    label: '需自动单位转换',
+                    value: '1',
+                },{
+                    label: '需按设置枚举转换',
+                    value: '2'
+                },{
+                    label: '需按公式转换',
+                    value: '3'
+                },{
+                    label: '需按拆分枚举转换',
+                    value: '4'
+                }
+            ]
+        }
+    },
+    components: {
+        noHandle,
+        autoHandle,
+        enumHandle,
+        formulaHandle,
+        splitHandle
+    }
+}
+</script>
+
+<style lang='scss' scoped>
+.box {
+    border: 1px solid #ccc;
+    display: flex;
+    padding: 20px 0;
+    .left {
+        width: 40%;
+        ul li {
+            display: flex;
+            height: 40px;
+            line-height: 40px;
+            span:nth-of-type(1) {
+                text-align: right;
+                width: 120px;
+            }
+        }
+    }
+    .right {
+        width: 60%;
+        .form {
+            width: 80%;
+            .dict {
+                .top {
+                    text-align: right;
+                    line-height: 33px;
+                }
+            }
+        }
+    }
+}
+</style>

+ 23 - 0
src/components/config_point/step3_edit/no_handle.vue

@@ -0,0 +1,23 @@
+<template>
+    <el-form ref='form' :model='form' label-width='120px'>
+        <el-form-item label='设备标识'>
+            <el-input v-model='form.name'></el-input>
+        </el-form-item>
+    </el-form>
+</template>
+
+<script>
+export default {
+    name: 'step3_no-handle',
+    data() {
+        return {
+            form: {
+                name: ''
+            }
+        }
+    }
+}
+</script>
+
+<style>
+</style>

+ 127 - 0
src/components/config_point/step3_edit/split_handle.vue

@@ -0,0 +1,127 @@
+<template>
+    <div class='edit-box'>
+        <el-form class='form' ref='form' :model='form' label-width='120px'>
+            <div class='dev-know'>
+                <el-form-item label='设备标识:'>
+                    <el-input v-model='form.name'></el-input>
+                </el-form-item>
+                <p class='strsub'>
+                    截取 第
+                    <el-input-number v-model='form.name' :min='1' :max='10' label='描述文字'></el-input-number>位 - 第
+                    <el-input-number v-model='form.name' :min='1' :max='10' label='描述文字'></el-input-number>位(从1开始)
+                </p>
+            </div>
+        </el-form>
+        <p class='tranf-box'>
+            需要将截取值转换为标准值:
+            <el-switch v-model='tranfVal' active-color='#13ce66' inactive-color='#ff4949'></el-switch>
+        </p>
+        <ul class='point-box'>
+            <p class='character'>
+                <span>如果</span>
+            </p>
+            <p class='character nm'>
+                <span>那么</span>
+            </p>
+            <li v-for='(item,index) in pointArr' :key='index'>
+                <p>
+                    <span class='name'>原始点位值 =</span>
+                    <span class='value'>
+                        <el-input v-model='item.old'></el-input>
+                    </span>
+                </p>
+                <p>
+                    <span class='name'>转换为标准值 =</span>
+                    <span class='value'>
+                        <el-input v-model='item.new'></el-input>
+                    </span>
+                    <i class='el-icon-delete delete'></i>
+                </p>
+            </li>
+        </ul>
+        <div class='add-btn-box'>
+            <el-button type='primary'>+添加新转换规则</el-button>
+        </div>
+    </div>
+</template>
+
+<script>
+export default {
+    name: 'step3_auto-handle',
+    data() {
+        return {
+            form: {
+                name: ''
+            },
+            tranfVal: true,
+            pointArr: [
+                {
+                    old: '',
+                    new: ''
+                },
+                {
+                    old: '',
+                    new: ''
+                }
+            ]
+        }
+    }
+}
+</script>
+
+<style scoped lang='scss'>
+.edit-box {
+    .form {
+        .dev-know {
+            background: #e6e6e6;
+            padding: 5px 5px 5px 0;
+            .strsub {
+                padding-left: 50px;
+            }
+        }
+    }
+    .tranf-box {
+        height: 50px;
+        line-height: 80px;
+    }
+    .point-box {
+        margin-top: 35px;
+        position: relative;
+        width: 600px;
+        .character {
+            position: absolute;
+            top: -25px;
+            left: 0;
+            font-size: 22px;
+            width: 600px;
+            text-align: left;
+        }
+        .nm {
+            text-align: center;
+        }
+        li {
+            display: flex;
+            justify-content: space-between;
+            margin-top: 5px;
+            p {
+                .name {
+                    padding-left: 80px;
+                }
+                .value {
+                    margin-left: 10px;
+                    display: inline-block;
+                    width: 80px;
+                }
+                .delete {
+                    margin-left: 5px;
+                    cursor: pointer;
+                }
+            }
+        }
+    }
+    .add-btn-box {
+        margin-top: 20px;
+        text-align: center;
+    }
+}
+</style>