From 4584a4dece74368d9fa635573fcd26fad9d86b6f Mon Sep 17 00:00:00 2001
From: xiangxy <shione_xxy@163.com>
Date: Wed, 26 Oct 2022 15:23:19 +0800
Subject: [PATCH] =?UTF-8?q?=E5=B8=83=E5=B1=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages/proj/RunOperate.1.vue | 225 ++++++++++++++++++++++++++++++++
 src/pages/proj/RunOperate.vue   | 223 +++++++++++++++++++++----------
 src/style/layout.styl           |  13 --
 3 files changed, 382 insertions(+), 79 deletions(-)
 create mode 100644 src/pages/proj/RunOperate.1.vue

diff --git a/src/pages/proj/RunOperate.1.vue b/src/pages/proj/RunOperate.1.vue
new file mode 100644
index 0000000..e28ec45
--- /dev/null
+++ b/src/pages/proj/RunOperate.1.vue
@@ -0,0 +1,225 @@
+<template>
+  <div class="inner-wrap">
+    <nav-bar title="运行操作"></nav-bar>
+    <div class="wrap2">
+      <div class="wrap-filter-button">
+        <div class="wrap-filter clearfix">
+          <div class="fl filter_item">
+            <div class="filter_input">
+              <label class="filter-label">管径（mm）</label>
+              <div class="iliblock">
+                <div class="showbox" @click="toChange(1, val1)">{{val1}}</div>
+              </div>
+            </div>
+          </div>
+          <div class="fl filter_item">
+            <div class="filter_input">
+              <label class="filter-label">管长（mm）</label>
+              <div class="iliblock">
+                <!-- <input type="number" class="input" v-model="val2"> -->
+                <div class="showbox" @click="toChange(2, val2)">{{val2}}</div>
+              </div>
+            </div>
+          </div>
+          <div class="fl filter_item">
+            <div class="filter_input">
+              <label class="filter-label">壁厚（mm）</label>
+              <div class="iliblock">
+                <!-- <input type="number" class="input" v-model="val3"> -->
+                <div class="showbox" @click="toChange(3, val3)">{{val3}}</div>
+              </div>
+            </div>
+          </div>
+          <div class="fl filter_item">
+            <div class="filter_input">
+              <label class="filter-label">颜色</label>
+              <div class="iliblock from_item">
+                <el-select v-model="val4" placeholder="请选择">
+                  <el-option
+                    v-for="item in options"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value">
+                  </el-option>
+                </el-select>
+              </div>
+            </div>
+          </div>
+          <div class="fl filter_item">
+            <div class="filter_input">
+              <label class="filter-label">合格提升每次提升根数</label>
+              <div class="iliblock">
+                <!-- <input type="number" class="input" v-model="val5"> -->
+                <div class="showbox" @click="toChange(5, val5)">{{val5}}</div>
+              </div>
+            </div>
+          </div>
+          <div class="fl filter_item">
+            <div class="filter_input">
+              <label class="filter-label">每捆根数</label>
+              <div class="iliblock">
+                <!-- <input type="number" class="input" v-model="val6"> -->
+                <div class="showbox" @click="toChange(6, val6)">{{val6}}</div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class="wrap-button clearfix">
+          <!-- <button class="button--primary" :disabled="disabled1" @touchstart="handleTouchStart" @touchend="handleTouchEnd">启动</button>
+          <button class="button--primary" :disabled="disabled1" @click="toStop">停止</button>
+          <button class="button--primary" :class="{'button--defalut': 1}" :disabled="disabled1" @click="toSendMessage1">A测摇杆出料异常复位</button>
+          <button class="button--primary" :class="{'button--defalut': 1}" :disabled="disabled1" @click="toSendMessage1">A测皮带出料异常复位</button>
+          <button class="button--primary" :class="{'button--defalut': 1}" :disabled="disabled1" @click="toSendMessage1">裹膜机控制权</button>
+          <button class="button--primary" :class="{'button--defalut': 1}" :disabled="disabled1" @click="toSendMessage1">捆扎完成</button>
+          <button class="button--primary" :class="{'button--defalut': 1}" :disabled="disabled1" @click="toSendMessage1">B测摇杆出料异常复位</button>
+          <button class="button--primary" :class="{'button--defalut': 1}" :disabled="disabled1" @click="toSendMessage1">B测皮带出料异常复位</button>
+          <button class="button--primary" :class="{'button--defalut': 1}" :disabled="disabled1" @click="toSendMessage1">故障复位</button> -->
+        </div>
+      </div>
+    </div>
+    <div v-if="active" class="msg_wrapper">
+      <div class="msg_box">
+        <div class="msg_item">
+          <div class="label_item">修改</div>
+          <div class="from_item">
+            <input type="number" class="msg_input" v-model="val">
+          </div>
+        </div>
+        <div class="msg_btns">
+          <button class="msg_btn" :disabled="disabled2" @click="msgSure">确认</button>
+          <button class="msg_btn" @click="msgCancle">取消</button>
+        </div>
+      </div>
+    </div>
+    <div v-if="active" class="mask"></div>
+  </div>
+</template>
+
+<script>
+import {queryDeviceInfo, putPoint} from '@config/getData'
+import NavBar from '@components/NavBar.vue'
+export default {
+  name: 'RunOperate',
+  components: {
+    NavBar
+  },
+  data () {
+    return {
+      opt: '', // 标识
+      interTime: this.$store.getters.setTime,
+      timer: null,
+      active: false,
+      val: '', // 弹框值
+      val1: '',
+      val2: '',
+      val3: '',
+      val4: '',
+      val5: '',
+      val6: '',
+      options: [
+        {
+          value: '1',
+          label: '1蓝'
+        },
+        {
+          value: '2',
+          label: '2黑'
+        },
+        {
+          value: '3',
+          label: '3红'
+        },
+        {
+          value: '4',
+          label: '4白'
+        },
+        {
+          value: '5',
+          label: '5黄'
+        },
+        {
+          value: '6',
+          label: '6绿'
+        },
+        {
+          value: '7',
+          label: '7粉'
+        },
+        {
+          value: '8',
+          label: '8墨绿'
+        },
+        {
+          value: '9',
+          label: '9紫'
+        }
+      ],
+      disabled1: false,
+      disabled2: false
+    }
+  },
+  // created () {
+  //   this.refresh()
+  // },
+  // beforeDestroy () {
+  //   clearInterval(this.timer)
+  //   this.timer = null
+  // },
+  methods: {
+    refresh () {
+      this._queryDeviceInfo()
+      this.timer = setInterval(() => {
+        this._queryDeviceInfo()
+      }, this.interTime)
+    },
+    toChange (a, v) {
+      this.opt = a
+      this.val = v
+      this.active = true
+    },
+    msgSure () {
+      if (this.opt === 1) {
+        this.val1 = this.val
+      }
+      if (this.opt === 2) {
+        this.val2 = this.val
+      }
+      if (this.opt === 3) {
+        this.val3 = this.val
+      }
+      if (this.opt === 5) {
+        this.val5 = this.val
+      }
+      if (this.opt === 6) {
+        this.val6 = this.val
+      }
+      this.active = false
+    },
+    msgCancle () {
+      this.active = false
+    },
+    handleTouchStart (event) {
+      event.preventDefault()
+      console.log(1)
+      let _this = this
+      _this.val1 = '100'
+    },
+    handleTouchEnd (event) {
+      console.log(2)
+      let _this = this
+      _this.val1 = '200'
+    }
+  }
+}
+</script>
+<style lang="stylus" scoped>
+.wrap-filter-button
+  padding 0.05rem 0.2rem
+  margin 0
+.wrap-button
+  margin 0.01rem auto
+.filter-table
+  margin 0.08rem 0
+.filter_item
+  margin 0.08rem 0 0 0
+</style>
diff --git a/src/pages/proj/RunOperate.vue b/src/pages/proj/RunOperate.vue
index e28ec45..a3ac72b 100644
--- a/src/pages/proj/RunOperate.vue
+++ b/src/pages/proj/RunOperate.vue
@@ -1,79 +1,88 @@
 <template>
   <div class="inner-wrap">
     <nav-bar title="运行操作"></nav-bar>
-    <div class="wrap2">
-      <div class="wrap-filter-button">
-        <div class="wrap-filter clearfix">
-          <div class="fl filter_item">
-            <div class="filter_input">
-              <label class="filter-label">管径（mm）</label>
-              <div class="iliblock">
-                <div class="showbox" @click="toChange(1, val1)">{{val1}}</div>
-              </div>
-            </div>
+    <div class="box">
+      <div class="box1">
+        <div class="d-status">
+          <label class="d-label1">设备状态</label>
+          <span class="obt obt1">自动</span>
+          <span class="obt obt2">系统运行</span>
+          <span class="obt obt3">联机模式</span>
+        </div>
+        <div class="d_item">
+          <div class="d_input">
+            <label class="d-label2">A侧档压压力(kg)</label>
+            <div class="showbox bggray">222{{val1}}</div>
           </div>
-          <div class="fl filter_item">
-            <div class="filter_input">
-              <label class="filter-label">管长（mm）</label>
-              <div class="iliblock">
-                <!-- <input type="number" class="input" v-model="val2"> -->
-                <div class="showbox" @click="toChange(2, val2)">{{val2}}</div>
-              </div>
-            </div>
+        </div>
+        <div class="d_item">
+          <div class="d_input">
+            <label class="d-label2">B侧档压压力(kg)</label>
+            <div class="showbox bggray">{{val1}}</div>
           </div>
-          <div class="fl filter_item">
-            <div class="filter_input">
-              <label class="filter-label">壁厚（mm）</label>
-              <div class="iliblock">
-                <!-- <input type="number" class="input" v-model="val3"> -->
-                <div class="showbox" @click="toChange(3, val3)">{{val3}}</div>
-              </div>
-            </div>
+        </div>
+        <div class="d_item">
+          <div class="d_input">
+            <label class="d-label2">管径（mm）</label>
+            <div class="showbox" @click="toChange(1, val1)">{{val1}}</div>
           </div>
-          <div class="fl filter_item">
-            <div class="filter_input">
-              <label class="filter-label">颜色</label>
-              <div class="iliblock from_item">
-                <el-select v-model="val4" placeholder="请选择">
-                  <el-option
-                    v-for="item in options"
-                    :key="item.value"
-                    :label="item.label"
-                    :value="item.value">
-                  </el-option>
-                </el-select>
-              </div>
-            </div>
+        </div>
+        <div class="d_item">
+          <div class="d_input">
+            <label class="d-label2">管长（mm）</label>
+            <div class="showbox" @click="toChange(2, val2)">{{val2}}</div>
           </div>
-          <div class="fl filter_item">
-            <div class="filter_input">
-              <label class="filter-label">合格提升每次提升根数</label>
-              <div class="iliblock">
-                <!-- <input type="number" class="input" v-model="val5"> -->
-                <div class="showbox" @click="toChange(5, val5)">{{val5}}</div>
-              </div>
-            </div>
+        </div>
+        <div class="d_item">
+          <div class="d_input">
+            <label class="d-label2">壁厚（mm）</label>
+            <div class="showbox" @click="toChange(3, val3)">{{val3}}</div>
           </div>
-          <div class="fl filter_item">
-            <div class="filter_input">
-              <label class="filter-label">每捆根数</label>
-              <div class="iliblock">
-                <!-- <input type="number" class="input" v-model="val6"> -->
-                <div class="showbox" @click="toChange(6, val6)">{{val6}}</div>
-              </div>
+        </div>
+        <div class="d_item">
+          <div class="d_input">
+            <label class="d-label2">颜色</label>
+            <div class="f_item">
+              <el-select v-model="val4" placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
             </div>
           </div>
         </div>
-        <div class="wrap-button clearfix">
-          <!-- <button class="button--primary" :disabled="disabled1" @touchstart="handleTouchStart" @touchend="handleTouchEnd">启动</button>
-          <button class="button--primary" :disabled="disabled1" @click="toStop">停止</button>
-          <button class="button--primary" :class="{'button--defalut': 1}" :disabled="disabled1" @click="toSendMessage1">A测摇杆出料异常复位</button>
-          <button class="button--primary" :class="{'button--defalut': 1}" :disabled="disabled1" @click="toSendMessage1">A测皮带出料异常复位</button>
-          <button class="button--primary" :class="{'button--defalut': 1}" :disabled="disabled1" @click="toSendMessage1">裹膜机控制权</button>
-          <button class="button--primary" :class="{'button--defalut': 1}" :disabled="disabled1" @click="toSendMessage1">捆扎完成</button>
-          <button class="button--primary" :class="{'button--defalut': 1}" :disabled="disabled1" @click="toSendMessage1">B测摇杆出料异常复位</button>
-          <button class="button--primary" :class="{'button--defalut': 1}" :disabled="disabled1" @click="toSendMessage1">B测皮带出料异常复位</button>
-          <button class="button--primary" :class="{'button--defalut': 1}" :disabled="disabled1" @click="toSendMessage1">故障复位</button> -->
+        <div class="d_item">
+          <div class="d_input">
+            <label class="d-label2">合格提升每次提升根数</label>
+            <div class="showbox" @click="toChange(5, val5)">{{val5}}</div>
+          </div>
+        </div>
+        <div class="d_item">
+          <div class="d_input">
+            <label class="d-label2">每捆根数</label>
+            <div class="showbox" @click="toChange(6, val6)">{{val6}}</div>
+          </div>
+        </div>
+        <div class="d_btm">
+          <button class="button--primary">启动</button>
+          <button class="button--primary">停止</button>
+        </div>
+      </div>
+      <div class="box2"></div>
+      <div class="box3">
+        <div class="b3_btm fl">
+          <button class="button--primary" :class="{'button--defalut': 1}" :disabled="disabled1" @click="toSure">A测摇杆出料异常复位</button>
+          <button class="button--primary" :class="{'button--defalut': 1}" :disabled="disabled1" @click="toSure">A测皮带出料异常复位</button>
+          <button class="button--primary" :class="{'button--defalut': 1}" :disabled="disabled1" @click="toSure">裹膜机控制权</button>
+          <button class="button--primary" :class="{'button--defalut': 1}" :disabled="disabled1" @click="toSure">捆扎完成</button>
+        </div>
+        <div class="b3_btm fr">
+          <button class="button--primary" :class="{'button--defalut': 1}" :disabled="disabled1" @click="toSure">B测摇杆出料异常复位</button>
+          <button class="button--primary" :class="{'button--defalut': 1}" :disabled="disabled1" @click="toSure">B测皮带出料异常复位</button>
+          <button class="button--primary" :class="{'button--defalut': 1}" :disabled="disabled1" @click="toSure">故障复位</button>
         </div>
       </div>
     </div>
@@ -96,7 +105,7 @@
 </template>
 
 <script>
-import {queryDeviceInfo, putPoint} from '@config/getData'
+// import {queryDeviceInfo, putPoint} from '@config/getData'
 import NavBar from '@components/NavBar.vue'
 export default {
   name: 'RunOperate',
@@ -208,11 +217,93 @@ export default {
       console.log(2)
       let _this = this
       _this.val1 = '200'
+    },
+    toSure () {
+      console.log(2)
     }
   }
 }
 </script>
 <style lang="stylus" scoped>
+.box
+  display flex
+  width 100%
+  .box1
+    width 28%
+    height 800px
+    // background #fff
+    padding .1rem
+  .box2
+    width 42%
+    height 800px
+    background #fc0
+  .box3
+    width 30%
+    height 800px
+    background #ccc
+    position relative
+    display flex
+.d-status
+  margin-bottom 8px
+.d-label1
+  font-size 15px
+  margin-right 5px
+.obt
+  display inline-block
+  width 20%
+  text-align center
+  line-height .2rem
+  font-size 15px
+  color #fff
+  border 1px solid #eee
+.obt1
+  background-color blue
+.obt2
+  background-color green
+.obt3
+  background-color #fc0
+.d-label2
+  font-size: 15px;
+  color: #464646;
+  width: 1.2rem;
+  line-height: .34rem;
+  height: .34rem;
+  // text-align: justify;
+  // text-align-last: justify;
+.d_input
+  width: 100%;
+  display: flex;
+  justify-content: space-between;
+.showbox
+  display inline-block
+  // width calc(100% - .8rem)
+  width 60%
+  height .34rem
+  line-height .34rem
+  font-size 13px
+  color #606266
+  text-indent .16rem
+  background-color #fff
+  border 1px solid #D1D1D1
+  border-radius 4px
+  margin-bottom 8px
+.bggray
+  background-color #f2f6ff
+.f_item
+  display inline-block
+  width 60%
+.d_btm
+  margin-top .12rem
+  button
+    font-size 20px
+.b3_btm
+  // position fixed
+  // bottom .5rem
+  display inline-block
+  .button--primary
+    font-size 18px
+    width 90%
+    margin .02rem
 .wrap-filter-button
   padding 0.05rem 0.2rem
   margin 0
diff --git a/src/style/layout.styl b/src/style/layout.styl
index 14ecbab..311c9c5 100644
--- a/src/style/layout.styl
+++ b/src/style/layout.styl
@@ -771,16 +771,3 @@ header
 button:disabled
   background-color #e1e1e1
   color #444
-// same input
-.showbox
-  display inline-block
-  // width calc(100% - .8rem)
-  width 100%
-  height .4rem
-  line-height .3rem
-  font-size .13rem
-  color #606266
-  text-indent .16rem
-  background-color #fff
-  border 1px solid #D1D1D1
-  border-radius 4px
\ No newline at end of file