交互背景色

2023-05-26 19:12:08 +08:00
parent c091a2af83
commit 20135fc031
9 changed files with 223 additions and 42 deletions
--- a/config/index.js
+++ b/config/index.js
@@ -13,7 +13,7 @@ module.exports = {
    proxyTable: {},

    // Various Dev Server settings
-    host: 'localhost', // can be overwritten by process.env.HOST
+    host: '0.0.0.0', // can be overwritten by process.env.HOST
    port: 8080, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
    autoOpenBrowser: false,
    errorOverlay: true,
--- a/src/components/alert.vue
+++ b/src/components/alert.vue
@@ -111,6 +111,6 @@ export default {
  width 100%
  height .5rem
  line-height .5rem
-  color #e74f1a
+  color #fff
  background-color #2778f3
 </style>
--- a/src/config/getData2.js
+++ b/src/config/getData2.js
@@ -17,6 +17,11 @@ export const getTable = (code, val, d1, d2) => post('api/produceshiftorder/getOr
  realproducestart_date: d1,
  realproduceend_date: d2
 })
+// export const getTable = (code, val, d1, d2) => {
+//   let res = {'totalElements': 2, 'content': [{'material_weight': 0.000000, 'down_id': '1', 'down_time': '2023-05-26 10:32:16.706', 'plan_qty': 111, 'is_needmove': true, 'report_qty': 0, 'create_type': '1', 'confirm_id': '20', 'realproducestart_date': '2023-05-26 10:37:00', 'down_name': '管理员', 'material_spec': '清洗S15', 'create_id': '1', 'real_qty': 0, 'current_produce_person_id': '1', 'is_error': false, 'material_name': '直接\\CG\\清洗S15\\EKTC00003', 'realproduceend_date': '2023-05-26 11:07:20', 'workorder_status': '5', 'dq_real_qty': 0, 'workprocedure_id': '1535144356586065920', 'workorder_id': '1661923147433250817', 'create_time': '2023-05-26 10:32:10', 'workorder_code': '230526007', 'nok_qty': 0, 'product_area': 'A1', 'is_delete': false, 'workprocedure_name': '镗孔', 'order_status_name': '完成', 'shift_type_scode': '1', 'repare_qty': 0, 'device_code': 'A1_TK_11', 'order_type_scode': '10', 'material_id': '1528687484865744896', 'planproduceend_date': '2023-05-26 18:30:00', 'person_real_qty': 0, 'planproducestart_date': '2023-05-26 07:30:00', 'is_canupdate_update': true, 'material_code': '24007845L', 'create_name': '管理员'}, {'material_weight': 1.000000, 'down_id': '1', 'down_time': '2023-05-26 14:06:24.182', 'plan_qty': 1234, 'is_needmove': true, 'report_qty': 0, 'create_type': '1', 'confirm_id': '20', 'realproducestart_date': '2023-05-26 14:11:28', 'down_name': '管理员', 'material_spec': '清洗S15', 'create_id': '1', 'real_qty': 0, 'current_produce_person_id': '1', 'is_error': false, 'material_name': '直接\\CG\\清洗S15\\EKTC00003', 'realproduceend_date': '2023-05-26 14:52:54', 'workorder_status': '5', 'dq_real_qty': 0, 'workprocedure_id': '1535144356586065920', 'workorder_id': '1661976821887012864', 'create_time': '2023-05-26 14:05:27', 'workorder_code': '230526010', 'nok_qty': 0, 'product_area': 'A1', 'is_delete': false, 'workprocedure_name': '镗孔', 'order_status_name': '完成', 'shift_type_scode': '1', 'repare_qty': 0, 'device_code': 'A1_TK_11', 'order_type_scode': '10', 'material_id': '1528687484865744896', 'planproduceend_date': '2023-05-26 18:30:00', 'person_real_qty': 0, 'planproducestart_date': '2023-05-26 07:30:00', 'is_canupdate_update': true, 'material_code': '24007845L', 'create_name': '管理员'}], 'code': 200, 'msg': '查询成功'}
+
+//   return res
+// }

 // 3.设备开工
 export const openStart = (id, code) => post('api/produceshiftorder/openStart', {
--- a/src/pages/modules/workorder/index.vue
+++ b/src/pages/modules/workorder/index.vue
@@ -1,17 +1,34 @@
 <template>
-<div class="content">
+<div class="content blue" ref="content">
    <div class="header">
-        <div class="header-user-content" @click="toSelect">
-            <div class="header-user-txt">
-                <span class="span1">登录人员：</span>
-                <span class="span2">admin{{userName}}</span>
+        <div class="header_wrap_left">
+            <div class="header-user-content" @click="toSelect">
+                <div class="header-user-txt">
+                    <span class="span1">登录人员：</span>
+                    <span class="span2">{{userName}}</span>
+                </div>
+                <div class="drop-button-wraper"><span class="icon_dropdown"></span></div>
+                <div v-show="show" class="dropdown-wrap">
+                    <ul class="dropdown-list drift">
+                        <li class="dropdown-item" @click="exit">退出</li>
+                    </ul>
+                    <div class="popper__arrow"></div>
+                </div>
            </div>
-            <div class="drop-button-wraper"><span class="icon_dropdown"></span></div>
-            <div v-show="show" class="dropdown-wrap">
-                <ul class="dropdown-list drift">
-                    <li class="dropdown-item" @click="exit">退出</li>
-                </ul>
-                <div class="popper__arrow"></div>
+            <div class="header-user-content set_color_wrap" @click="toSelectColor">
+                <div class="header-user-txt">
+                    <span class="span1">背景颜色</span>
+                    <span class="span2"></span>
+                </div>
+                <div class="drop-button-wraper"><span class="icon_dropdown"></span></div>
+                <div v-show="showColor" class="dropdown-wrap">
+                    <ul class="dropdown-list drift">
+                        <li class="dropdown-item" @click="switchColor(1)"><div class="color_button overall_orange"></div></li>
+                        <li class="dropdown-item" @click="switchColor(2)"><div class="color_button overall_lightgreen"></div></li>
+                        <li class="dropdown-item" @click="switchColor(3)"><div class="color_button overall_blue"></div></li>
+                    </ul>
+                    <div class="popper__arrow"></div>
+                </div>
            </div>
        </div>
        <div class="header-time-wrap">
@@ -49,6 +66,7 @@ export default {
      date: '',
      week: '',
      show: false,
+      showColor: false,
      menus: [
        {
          label: '工单作业',
@@ -90,6 +108,22 @@ export default {
    exit () {
      this.$store.dispatch('delUserInfo')
      this.$router.push('/login')
+    },
+    toSelectColor () {
+      this.showColor = !this.showColor
+    },
+    switchColor (type) {
+      switch (type) {
+        case 1:
+          this.$refs.content.classList.value = 'content overall_orange'
+          break
+        case 2:
+          this.$refs.content.classList.value = 'content overall_lightgreen'
+          break
+        case 3:
+          this.$refs.content.classList.value = 'content overall_blue'
+          break
+      }
    }
  }
 }
@@ -99,16 +133,20 @@ export default {
@import '~@style/mixin.styl'
 .content
    _wh(100%, 100vh)
-    background linear-gradient(#031f6d 0%,#011a60 20%,#060346 100%)
 .header
    height 45px
    _fj()
    padding 0 15px
+.header_wrap_left
+    height 45px
+    _fj(flex-start)
 .header-user-content
    position relative
    height 45px
    _fj(flex-start)
    cursor pointer
+.set_color_wrap
+    margin-left 20px
 .header-user-txt
    padding 14.5px 0
    line-height 1
@@ -130,6 +168,7 @@ export default {
    width 100%
    top 39px
    right 0
+    z-index 1
    transform-origin center top
    transition transform .3s ease-in-out
    border 1px solid #e4e7ed
@@ -198,4 +237,19 @@ export default {
        border-top-right-radius 12px
 .main-container
    _wh(100%, calc(100% - 44px))
+.color_button
+    _wh(30px, 30px)
+    border-radius 50%
+.set_color_wrap
+    .dropdown-wrap
+        width 132px
+        left 50%
+        transform translateX(-50%)
+    .dropdown-list
+        padding 0 10px
+    .dropdown-item
+        float left
+        padding 10px 0
+        &:nth-child(2)
+            padding 10px 10px
 </style>
--- a/src/pages/modules/workorder/work-order-assignment.vue
+++ b/src/pages/modules/workorder/work-order-assignment.vue
@@ -5,7 +5,7 @@
                <div class="filter_item">
                    <div class="filter_label">设备</div>
                    <div class="filter-input-wrap">
-                        <el-select v-model="value" placeholder="请选择">
+                        <el-select v-model="value" filterable clearable placeholder="请选择">
                          <el-option
                              v-for="item in options"
                              :key="item.device_code"
@@ -19,8 +19,8 @@
            <div class="wrap-buttons">
                <button class="button button--primary" @click="getDatas">查询</button>
                <button class="button button--primary" :class="{'button--defalut': pkId === ''}" :disabled="disabled1" @click="_openStart">开工</button>
-                <button class="button button--primary" :class="{'button--defalut': pkId === ''}" :disabled="disabled2" @click="_saveReport">报工</button>
-                <button class="button button--primary" :class="{'button--defalut': pkId === ''}" :disabled="disabled3" @click="showDialog">强制完成</button>
+                <button class="button button--primary" :class="{'button--defalut': pkId === ''}" :disabled="disabled2" @click="showDialog('1')">报工</button>
+                <button class="button button--primary" :class="{'button--defalut': pkId === ''}" :disabled="disabled3" @click="showDialog('2')">强制完成</button>
            </div>
        </div>
        <div class="grid_wraper">
@@ -29,14 +29,15 @@
                    <th width="4%"></th>
                    <th width="8%">工单日期</th>
                    <th width="8%">工单号</th>
-                    <th width="10%">状态</th>
+                    <th width="7%">状态</th>
                    <th width="8%">设备</th>
+                    <th width="8%">物料名称</th>
                    <th width="10%">物料规格</th>
                    <th width="10%">工序</th>
-                    <th width="10%">计划生产</th>
+                    <th width="9%">计划生产</th>
                    <th width="9%">待生产</th>
                    <th width="9%">已生产</th>
-                    <th width="13%">开工时间</th>
+                    <th width="9%">开工时间</th>
                </tr>
                <tr v-for="e in dataList" :key="e.workorder_id">
                    <td>
@@ -44,8 +45,9 @@
                    </td>
                    <td>{{e.create_time}}</td>
                    <td>{{e.workorder_code}}</td>
-                    <td>{{['创建','下发','生产中','暂停', '完成'][Number(e.workorder_status) - 1]}}</td>
+                    <td>{{['创建','下发','生产中','暂停', '完成', '强制完成'][Number(e.workorder_status) - 1]}}</td>
                    <td>{{e.device_code}}</td>
+                    <td>{{e.material_name}}</td>
                    <td>{{e.material_spec}}</td>
                    <td>{{e.workprocedure_name}}</td>
                    <td>{{e.plan_qty}}</td>
@@ -57,10 +59,35 @@
        </div>
        <jxDialog
          ref="child"
-          title="提示"
+          :title="title"
+          :type="type"
          @toSure="toSureDialog"
          >
-          <div class="form_wraper">当前操作为强制确认，确定继续操作吗？</div>
+          <div v-if="type === '1'" class="form_wraper">
+            <div class="form">
+              <div class="form_item">
+                <div class="form_item__label">合格数量</div>
+                <div class="form_item__content">
+                  <input type="number" class="form_item__input" v-model="reportQty">
+                </div>
+              </div>
+              <div class="form_item">
+                <div class="form_item__label">报废数量</div>
+                <div class="form_item__content">
+                  <input type="number" class="form_item__input" v-model="nokQty">
+                </div>
+              </div>
+            </div>
+            <div class="form">
+              <div class="form_item">
+                <div class="form_item__label">报修数量</div>
+                <div class="form_item__content">
+                  <input type="number" class="form_item__input" v-model="repareQty">
+                </div>
+              </div>
+            </div>
+          </div>
+          <div v-if="type === '2'" class="form_wraper">当前操作为强制确认，确定继续操作吗？</div>
        </jxDialog>
    </div>
 </template>
@@ -82,7 +109,24 @@ export default {
      disabled3: false,
      dataList: [],
      pkId: '',
-      pkObj: {}
+      pkObj: {},
+      title: '',
+      type: '',
+      reportQty: '',
+      nokQty: '',
+      repareQty: ''
+    }
+  },
+  watch: {
+    type (val) {
+      switch (val) {
+        case '1':
+          this.title = '请输入数量'
+          break
+        case '2':
+          this.title = '提示'
+          break
+      }
    }
  },
  created () {
@@ -127,6 +171,7 @@ export default {
    },
    // 报工
    async _saveReport () {
+      this.$refs.child.disabled = true
      this.disabled2 = true
      if (!this.pkId) {
        this.toast('请选择一行')
@@ -134,22 +179,36 @@ export default {
        return
      }
      try {
-        let res = await saveReport(this.pkId, this.pkObj.report_qty, this.pkObj.nok_qty, this.pkObj.repare_qty)
+        let res = await saveReport(this.pkId, this.reportQty, this.nokQty, this.repareQty)
        this.toast(res.message)
        this.disabled2 = false
        this.pkId = ''
        this.pkObj = {}
+        this.$refs.child.active = false
+        this.$refs.child.disabled = false
        this.getDatas()
      } catch (e) {
        this.disabled2 = false
+        this.$refs.child.active = false
+        this.$refs.child.disabled = false
      }
    },
-    showDialog () {
+    showDialog (type) {
+      this.type = type
      if (!this.pkId) {
        this.toast('请选择一行')
        return
      }
      this.$refs.child.active = true
+      switch (type) {
+        case '1':
+          this.reportQty = ''
+          this.nokQty = ''
+          this.repareQty = ''
+          break
+        case '2':
+          break
+      }
    },
    // 完工
    async _tofinish () {
@@ -159,6 +218,8 @@ export default {
        let res = await tofinish(this.pkObj)
        this.toast(res.message)
        this.disabled3 = false
+        this.pkId = ''
+        this.pkObj = {}
        this.$refs.child.active = false
        this.$refs.child.disabled = false
        this.getDatas()
@@ -168,8 +229,15 @@ export default {
        this.$refs.child.disabled = false
      }
    },
-    toSureDialog () {
-      this._tofinish()
+    toSureDialog (type) {
+      switch (type) {
+        case '1':
+          this._saveReport()
+          break
+        case '2':
+          this._tofinish()
+          break
+      }
    },
    toRadio (e) {
      this.pkId = this.pkId === e.workorder_id ? '' : e.workorder_id
--- a/src/pages/modules/workorder/work-order-query.vue
+++ b/src/pages/modules/workorder/work-order-query.vue
@@ -17,7 +17,7 @@
              <div class="filter_item">
                  <div class="filter_label filter_label_z2">设备</div>
                  <div class="filter-input-wrap filter-input-wrap_z2">
-                    <el-select v-model="value" placeholder="请选择">
+                    <el-select v-model="value" filterable placeholder="请选择">
                      <el-option
                          v-for="item in options"
                          :key="item.device_code"
@@ -44,10 +44,11 @@
              <tr>
                  <th width="8%">工单日期</th>
                  <th width="8%">工单号</th>
-                  <th width="8%">设备</th>
-                  <th width="8%">状态</th>
+                  <th width="7%">设备</th>
+                  <th width="4%">状态</th>
                  <th width="8%">物料名称</th>
-                  <th width="8%">工序</th>
+                  <th width="8%">物料规格</th>
+                  <th width="5%">工序</th>
                  <th width="8%">工单数量</th>
                  <th width="8%">实际数量</th>
                  <th width="8%">报废数量</th>
@@ -61,6 +62,7 @@
                  <td>{{e.device_code}}</td>
                  <td>{{['创建','下发','生产中','暂停', '完成'][Number(e.workorder_status) - 1]}}</td>
                  <td>{{ e.material_name }}</td>
+                  <td>{{e.material_spec}}</td>
                  <td>{{e.workprocedure_name}}</td>
                  <td>{{e.plan_qty}}</td>
                  <td>{{ e.real_qty }}</td>
--- a/src/pages/modules/workorder/work-report-query.vue
+++ b/src/pages/modules/workorder/work-report-query.vue
@@ -17,7 +17,7 @@
              <div class="filter_item">
                  <div class="filter_label filter_label_z2">设备</div>
                  <div class="filter-input-wrap filter-input-wrap_z2">
-                    <el-select v-model="value" placeholder="请选择">
+                    <el-select v-model="value" filterable placeholder="请选择">
                      <el-option
                          v-for="item in options"
                          :key="item.device_code"
@@ -48,14 +48,15 @@
                  <th width="6%">工单号</th>
                  <th width="6%">设备</th>
                  <th width="6%">顺序号</th>
-                  <th width="4%">班次</th>
+                  <th width="5%">班次</th>
                  <th width="8%">物料名称</th>
+                  <th width="8%">物料规格</th>
                  <th width="8%">开始时间</th>
                  <th width="8%">结束时间</th>
                  <th width="7%">电气数量</th>
-                  <th width="10%">上报合格数</th>
-                  <th width="10%">上报报废数</th>
-                  <th width="10%">上报报修数</th>
+                  <th width="7%">上报合格数</th>
+                  <th width="7%">上报报废数</th>
+                  <th width="7%">上报报修数</th>
                  <th width="6%">操作工</th>
                  <th width="5%">状态</th>
              </tr>
@@ -68,6 +69,7 @@
                  <td>{{e.seq_number}}</td>
                  <td>{{e.shift_type_scode}}</td>
                  <td>{{e.material_name}}</td>
+                  <td>{{e.material_spec}}</td>
                  <td>{{e.operatetime_start}}</td>
                  <td>{{e.operatetime_end}}</td>
                  <td>{{ e.dq_report_qty }}</td>
@@ -128,7 +130,7 @@ export default {
      workorder: '',
      disabled1: false,
      disabled2: false,
-      dataList: [{macoperate_id: '1'}],
+      dataList: [],
      pkId: '',
      pkObj: {},
      reportQty: '',
--- a/src/style/layout.styl
+++ b/src/style/layout.styl
@@ -129,8 +129,8 @@
  font-size: 14px;
  border-radius: 4px;
 .button--primary
-  background-color #008f8f
-  border-color #008f8f
+  background-color #409EFF
+  border-color #409EFF
 .button--defalut
  color #fff
  border 1px solid #c9c9c9
@@ -365,4 +365,53 @@ input::-webkit-input-placeholder
  outline: none;
  padding: 0 15px;
  transition: border-color .2s cubic-bezier(.645,.045,.355,1);
-  width: 100%;
+  width: 100%;
+
+.overall_orange
+    background linear-gradient(#ff7a31 0%,#ff6b00 20%,#ff5200 100%)
+    .body-container
+      border-color $orange !important
+    .tabs li a
+      border-color #ffbb31 !important
+    .tabs li .router-link-active
+      background linear-gradient(#f5e24a 0%,#ffbb31 100%) !important
+    .button--primary
+      background-color #fff
+      border-color $red
+      color $red
+    .button--defalut
+      color: #fff;
+      border-color #c9c9c9
+      background-color: #c9c9c9;
+    .selected_icon
+      background-color: #fff;
+      color: $red
+    .filter-table
+      border-color #fff
+      th, td
+        border-color #fff
+.overall_lightgreen
+    background linear-gradient(#00d9a1 0%,#00c0a5 30%,#115fae 100%)
+    .body-container
+      border-color $lightgreen !important
+    .tabs li a
+      border-color #008f8f !important
+    .tabs li .router-link-active
+      background linear-gradient(#b7e15d 0%,#008f8f 100%) !important
+    .button--primary
+      background-color #008f8f
+      border-color #008f8f
+      color #fff
+    .button--defalut
+      color: #fff;
+      border-color #c9c9c9;
+      background-color: #c9c9c9;
+    .selected_icon
+      background-color: #fff;
+      color: #008f8f
+    .filter-table
+      border-color #fff
+      th, td
+        border-color #fff
+.overall_blue
+    background linear-gradient(#031f6d 0%,#011a60 20%,#060346 100%)
--- a/src/style/mixin.styl
+++ b/src/style/mixin.styl
@@ -9,7 +9,8 @@ $gray = #c9c9c9
 $gray1 = #8B90A6
 $gray2 = #DFE1E6
 $fc1 = #323232
-
+$orange = #ffa530
+$lightgreen = #b7e15d


 //宽高