完善

src/views/sb/count/SbPositionCount.vue

@@ -1,64 +1,121 @@
 <template>
-  <div v-show="visible" class="main">
+  <div>
     <div>
-      <div class="one_title">
-        <a-row type="flex" :gutter="[20,20]">
-          <a-col :span="6" v-for="position in sbPositionData" :key="position.id" @click="selectCountByPosition(position)" v-show="position.type === 1">
-            <div class="one_title_option" :class="parentId==position.id?'opt_one_title_option':''">
-              <div><my-icon type="icon-lianyouchangqu-copy" style="font-size:107px;"/></div>
-              <div>
-                <div> {{ position.name }}</div>
-                <div style="color:#296BEF;font-size: 42px;">{{ position.num }}台，总{{ position.childNum }}台</div>
-              </div>
-            </div>
-          </a-col>
-        </a-row>
+      <div class="search">
+        <a-input-search
+          v-info.trim="queryParam.sampleName"
+          allowClear
+          enter-button
+          size="large"
+          style="width:500px"
+          placeholder="请输入设备名称"
+        >
+          <my-icon slot="addonBefore" :style="{ padding:'5px' }" type="icon-shaixuan" @click="drawerVisible = true"/>
+        </a-input-search>
+        <a-drawer
+          title="筛选"
+          placement="top"
+          :closable="false"
+          :visible="drawerVisible"
+          @close="drawerClose"
+        >
+          <a-form layout="inline">
+            <a-row :gutter="20">
+              <a-col :xxl="8" :md="12" :sm="24">
+                <a-form-item label="样品名称">
+                  <a-input v-model.trim="queryParam.sampleName" placeholder="请输入样品名称"/>
+                </a-form-item>
+              </a-col>
+              <a-col :xxl="8" :md="12" :sm="24">
+                <a-form-item label="批次号">
+                  <a-input v-model.trim="queryParam.batchNo" placeholder="请输入批次号"/>
+                </a-form-item>
+              </a-col>
+
+            </a-row>
+          </a-form>
+          <div
+            :style="{
+              position: 'absolute',
+              right: 0,
+              bottom: 0,
+              width: '100%',
+              padding: '10px 16px',
+              textAlign: 'center',
+              zIndex: 1,
+            }">
+            <a-button type="primary" size="large" @click="getInfo">查询</a-button>
+            <a-button style="margin-left: 88px" size="large" @click="queryParam={}">重置</a-button>
+          </div>
+        </a-drawer>
       </div>
-      <br />
-      <div class="two_title">
-        <a-row type="flex" :gutter="[20,40]">
-          <a-col :span="3" v-for="position in sbPositionData" v-show="position.type === 2 && position.parentId === parentId" :key="position.id" @click="selectCountByPositionGroupBySbType(position)">
-            <div class="two_title_option" :class="code==position.code?'opt_two_title_option':''">
-              <div> {{ position.name }}</div>
-              <div style="color:#296BEF;margin-top: 22px;">{{ position.num }}台</div>
+      <a-row :gutter="40">
+        <a-col :span="6">
+          <div class="">
+            <div style=" overflow: auto;height: 350px;">
+              <div
+                class="one_title_option"
+                v-for="position in sbPositionData"
+                :key="position.id"
+                @click="selectCountByPosition(position)"
+                v-show="position.type === 1"
+                :class="parentId==position.id?'opt_one_title_option':''">
+                <div><my-icon :type="item==1?'icon-lianyouchangqu-white':'icon-lianyouchangqu-copy'" style="font-size:80px; color:#fff;margin-right: 30px;"/></div>
+                <div>
+                  <div>{{ position.name }}</div>
+                  <div>{{ position.num }}台，总{{ position.childNum }}台</div>
+                </div>
+              </div>
             </div>
-          </a-col>
-        </a-row>
+          </div>
+        </a-col>
+        <a-col :span="18" class="gutter-box">
+          <a-row :gutter="[20,20]">
+            <a-col :span="6" v-for="position in sbPositionData" v-show="position.type === 2 && position.parentId === parentId" :key="position.id" @click="selectCountByUseTypeGroup(position)">
+              <div class="gutter-btn gutter-color " :class="code==position.code?'opt_option':''">
+                <div style="font-size:32px">{{ position.name }}</div>
+                <div style="font-size:16px">3楼</div>
+                <div style="font-size:28px ;color:#3462FD">{{ position.num }}台</div>
+              </div>
+            </a-col>
+          </a-row>
+        </a-col>
+      </a-row>
+      <div>
+        <div class="main gutter-color">
+          <!-- <div class="title">报修数据</div> -->
+          <div>
+            <a-descriptions :column="6" bordered>
+              <a-descriptions-item v-for="item in typeData" :key="item.id" :label="BaseTool.Object.getField(useTypeMap,item.useType)">{{ item.num }}台</a-descriptions-item>
+            </a-descriptions>
+          </div>
+        </div>
       </div>
-      <div class="three_title" v-if="typeData.length >0">
-        <!-- <div class="title">丙二车间：28台</div> -->
-        <a-row type="flex" justify="space-around" :gutter="[40,40]">
-          <a-col :span="3" v-for="item in typeData" :key="item.id" >
-            <div class="three_title_option" @click="jumpSbInfo(item)">
-              <div>{{ item.typeName }}</div>
-              <div style="padding:5px;background: #CDDBFA;opacity: 0.56;border-radius: 2px; color:#2C5DC7;margin-top: 10px;">{{ item.num }}台</div>
-            </div>
-          </a-col>
-        </a-row>
+      <div class="btn">
       </div>
     </div>
   </div>
 </template>
-
 <script>
 
 import {
   selectCountByPositionGroup,
-  selectCountByPositionGroupBySbType
+  selectCountByUseTypeGroup
 } from '@/api/sb/count'
 
 export default {
-  name: 'SbPositionNum',
-  components: {
-  },
   data () {
     return {
+      value: 1,
+      drawerVisible: false,
+      queryParam: {},
       confirmLoading: false,
       modalTitle: null,
       configMap: {},
       parentId: null,
       code: null,
       sbPositionData: [],
+      useTypeMap: {},
       typeData: [],
       factoryStr: null,
       form: this.$form.createForm(this),
@@ -66,16 +123,18 @@ export default {
       user: this.$store.getters.userInfo
     }
   },
-  props: {
-  },
   created () {
     // 下拉框map
+    this.useTypeMap = this.DictCache.getLabelByValueMapByType(this.DictCache.TYPE.SB_USE_TYPE)
     selectCountByPositionGroup().then(res => {
       this.sbPositionData = res.data
       this.selectCountByPosition(res.data[0])
     })
   },
   methods: {
+    drawerClose () {
+      this.drawerVisible = false
+    },
     base (record) {
       this.visible = true
       // 如果是空标识添加
@@ -99,9 +158,9 @@ export default {
       this.code = null
       this.typeData = []
     },
-    selectCountByPositionGroupBySbType (position) {
+    selectCountByUseTypeGroup (position) {
       this.code = position.code
-      selectCountByPositionGroupBySbType(position).then(res => {
+      selectCountByUseTypeGroup(position).then(res => {
         this.typeData = res.data
       })
     },
@@ -112,63 +171,83 @@ export default {
   }
 }
 </script>
-
 <style lang="less" scoped>
+  .search{
+    width: 100%;
+background: #fff;
+text-align: center;
+padding:10px;
+margin-bottom: 20px;
+  }
+.gutter-box{
+  height: 350px;
+  overflow: auto;
+}
+.gutter-color{
+  background: #fff;
+  border: 1px solid #DDDDDD;
+}
+
+.gutter-btn{
+  height: 165px;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  font-size: 50px;
+  color:#333;
+  &:hover{
+    cursor: pointer;
+  }
+}
+.act{
+  color:#3462FD;
+}
 .main{
-  padding:20px;
-  // background: #fff;
-  .one_title_option{
+ margin-top:30px;
+}
+.title{
+ font-size: 28px;
+ font-family: PingFang SC;
+ font-weight: 500;
+ color: #3462FD;
+ padding:10px 42px;
+ border-bottom: 1px solid #DDDDDD;
+}
+.btn{
+   position: fixed;
+   bottom: 50px;
+   width: 100%;
+    display: flex;
+    justify-content: center;
+}
+.center{
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+.opt_option{
+    background: linear-gradient(-3deg, #cce2f0 0%, #99D1F6 100%);
+    color:#fff;
+}
+.one_title_option{
     background:#fff;
     display: flex;
-    justify-content: space-between;
+    // width: 100%;
+    // justify-content: space-between;
     align-items: center;
-    font-size: 26px;
+    margin-bottom:10px;
+    font-size: 25px;
     font-family: PingFang SC;
-    font-weight: bold;
     color: #333333;
     cursor: pointer;
     border-radius: 10px;
-    padding:17px 50px 17px 17px;
+    border: 1px solid #C0BEBE;
+    padding:17px ;
   }
    .opt_one_title_option{
     background: linear-gradient(-3deg, #99D1F6 0%, #9196F3 100%);
     color:#fff;
    }
-  .two_title_option{
-    background:#fff;
-    text-align: center;
-    font-size: 26px;
-    padding:20px;
-    cursor: pointer;
-    box-shadow: 1px 14px 29px 0px rgba(138,97,250,0.19);
-    border-radius: 10px;
-  }
-  .opt_two_title_option{
-    background: linear-gradient(-3deg, #cce2f0 0%, #99D1F6 100%);
-   }
-   .three_title{
-    margin-top: 50px;
-    background: #FFFFFF;
-    border: 1px solid #D2D5D9;
-    border-radius: 4px;
-    font-family: PingFang SC;
-    padding: 20px;
-    min-height:100vh;
-    .title{
-      width: 500px;
-      font-size: 34px;
-      font-weight: bold;
-      padding: 10px 0 30px 0;
-      color: #2C5DC7;
-      border-bottom: 2px solid #2c5dc7;
-      margin-bottom: 30px;
-    }
-    .three_title_option{
-      cursor: pointer;
-      font-size: 22px;
-      font-weight: 500;
-      text-align: center;
-    }
-   }
-}
+::-webkit-scrollbar { width: 0; height: 0; color: transparent; }
 </style>

src/views/sb/count/SbStatusCount copy.vue

@@ -0,0 +1,176 @@
+<template>
+  <div v-show="visible" class="main">
+    <div>
+      <div class="one_title">
+        <a-row type="flex" :gutter="[20,20]">
+          <a-col :span="6" v-for="position in sbPositionData" :key="position.id" @click="selectCountByPosition(position)" v-show="position.type === 1">
+            <div class="one_title_option" :class="parentId==position.id?'opt_one_title_option':''">
+              <div><my-icon type="icon-lianyouchangqu-copy" style="font-size:107px;"/></div>
+              <div>
+                <div> {{ position.name }}</div>
+                <div style="color:#296BEF;font-size: 42px;">{{ position.num }}台，总{{ position.childNum }}台</div>
+              </div>
+            </div>
+          </a-col>
+        </a-row>
+      </div>
+      <br />
+      <div class="two_title">
+        <a-row type="flex" :gutter="[20,40]">
+          <a-col :span="3" v-for="position in sbPositionData" v-show="position.type === 2 && position.parentId === parentId" :key="position.id" @click="selectCountBySbStatusGroup(position)">
+            <div class="two_title_option" :class="code==position.code?'opt_two_title_option':''">
+              <div> {{ position.name }}</div>
+              <div style="color:#296BEF;margin-top: 22px;">{{ position.num }}台</div>
+            </div>
+          </a-col>
+        </a-row>
+      </div>
+      <div class="three_title" v-if="typeData.length >0">
+        <!-- <div class="title">丙二车间：28台</div> -->
+        <a-row type="flex" justify="space-around" :gutter="[40,40]">
+          <a-col :span="3" v-for="item in typeData" :key="item.id" >
+            <div class="three_title_option" @click="jumpSbInfo(item)">
+              <div>{{ BaseTool.Object.getField(statusMap,item.status) }}</div>
+              <div style="padding:5px;background: #CDDBFA;opacity: 0.56;border-radius: 2px; color:#2C5DC7;margin-top: 10px;">{{ item.num }}台</div>
+            </div>
+          </a-col>
+        </a-row>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+
+import {
+  selectCountByPositionGroup,
+  selectCountBySbStatusGroup
+} from '@/api/sb/count'
+
+export default {
+  name: 'SbPositionNum',
+  components: {
+  },
+  data () {
+    return {
+      confirmLoading: false,
+      modalTitle: null,
+      configMap: {},
+      parentId: null,
+      code: null,
+      sbPositionData: [],
+      statusMap: {},
+      typeData: [],
+      factoryStr: null,
+      form: this.$form.createForm(this),
+      visible: true,
+      user: this.$store.getters.userInfo
+    }
+  },
+  props: {
+  },
+  created () {
+    // 下拉框map
+    this.statusMap = this.DictCache.getLabelByValueMapByType(this.DictCache.TYPE.SB_INFO_STATUS)
+    selectCountByPositionGroup().then(res => {
+      this.sbPositionData = res.data
+      this.selectCountByPosition(res.data[0])
+    })
+  },
+  methods: {
+    base (record) {
+      this.visible = true
+      // 如果是空标识添加
+      if (this.BaseTool.Object.isBlank(record)) {
+        this.modalTitle = '添加'
+        this.data = []
+      }
+    },
+    handleCancel (values) {
+      this.visible = false
+      this.confirmLoading = false
+      this.form.resetFields()
+      if (this.BaseTool.Object.isNotBlank(values)) {
+        this.$emit('ok', values)
+      } else {
+        this.$emit('ok')
+      }
+    },
+    selectCountByPosition (position) {
+      this.parentId = position.id
+      this.code = null
+      this.typeData = []
+    },
+    selectCountBySbStatusGroup (position) {
+      this.code = position.code
+      selectCountBySbStatusGroup(position).then(res => {
+        this.typeData = res.data
+      })
+    },
+    jumpSbInfo (type) {
+      const routeUrl = this.$router.resolve({ path: '/sb/info/company', query: { typeId: type.typeId } })
+      window.open(routeUrl.href, '_blank')
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.main{
+  padding:20px;
+  // background: #fff;
+  .one_title_option{
+    background:#fff;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    font-size: 26px;
+    font-family: PingFang SC;
+    font-weight: bold;
+    color: #333333;
+    cursor: pointer;
+    border-radius: 10px;
+    padding:17px 50px 17px 17px;
+  }
+   .opt_one_title_option{
+    background: linear-gradient(-3deg, #99D1F6 0%, #9196F3 100%);
+    color:#fff;
+   }
+  .two_title_option{
+    background:#fff;
+    text-align: center;
+    font-size: 26px;
+    padding:20px;
+    cursor: pointer;
+    box-shadow: 1px 14px 29px 0px rgba(138,97,250,0.19);
+    border-radius: 10px;
+  }
+  .opt_two_title_option{
+    background: linear-gradient(-3deg, #cce2f0 0%, #99D1F6 100%);
+   }
+   .three_title{
+    margin-top: 50px;
+    background: #FFFFFF;
+    border: 1px solid #D2D5D9;
+    border-radius: 4px;
+    font-family: PingFang SC;
+    padding: 20px;
+    min-height:100vh;
+    .title{
+      width: 500px;
+      font-size: 34px;
+      font-weight: bold;
+      padding: 10px 0 30px 0;
+      color: #2C5DC7;
+      border-bottom: 2px solid #2c5dc7;
+      margin-bottom: 30px;
+    }
+    .three_title_option{
+      cursor: pointer;
+      font-size: 22px;
+      font-weight: 500;
+      text-align: center;
+    }
+   }
+}
+</style>

src/views/sb/count/SbStatusCount.vue

@@ -1,45 +1,101 @@
 <template>
-  <div v-show="visible" class="main">
+  <div>
     <div>
-      <div class="one_title">
-        <a-row type="flex" :gutter="[20,20]">
-          <a-col :span="6" v-for="position in sbPositionData" :key="position.id" @click="selectCountByPosition(position)" v-show="position.type === 1">
-            <div class="one_title_option" :class="parentId==position.id?'opt_one_title_option':''">
-              <div><my-icon type="icon-lianyouchangqu-copy" style="font-size:107px;"/></div>
-              <div>
-                <div> {{ position.name }}</div>
-                <div style="color:#296BEF;font-size: 42px;">{{ position.num }}台，总{{ position.childNum }}台</div>
+      <div class="search">
+        <a-input-search
+          v-info.trim="queryParam.sampleName"
+          allowClear
+          enter-button
+          size="large"
+          style="width:500px"
+          placeholder="请输入设备名称"
+        >
+          <my-icon slot="addonBefore" :style="{ padding:'5px' }" type="icon-shaixuan" @click="drawerVisible = true"/>
+        </a-input-search>
+        <a-drawer
+          title="筛选"
+          placement="top"
+          :closable="false"
+          :visible="drawerVisible"
+          @close="drawerClose"
+        >
+          <a-form layout="inline">
+            <a-row :gutter="20">
+              <a-col :xxl="8" :md="12" :sm="24">
+                <a-form-item label="样品名称">
+                  <a-input v-model.trim="queryParam.sampleName" placeholder="请输入样品名称"/>
+                </a-form-item>
+              </a-col>
+              <a-col :xxl="8" :md="12" :sm="24">
+                <a-form-item label="批次号">
+                  <a-input v-model.trim="queryParam.batchNo" placeholder="请输入批次号"/>
+                </a-form-item>
+              </a-col>
+
+            </a-row>
+          </a-form>
+          <div
+            :style="{
+              position: 'absolute',
+              right: 0,
+              bottom: 0,
+              width: '100%',
+              padding: '10px 16px',
+              textAlign: 'center',
+              zIndex: 1,
+            }">
+            <a-button type="primary" size="large" @click="getInfo">查询</a-button>
+            <a-button style="margin-left: 88px" size="large" @click="queryParam={}">重置</a-button>
+          </div>
+        </a-drawer>
+      </div>
+      <a-row :gutter="40">
+        <a-col :span="6">
+          <div class="">
+            <div style=" overflow: auto;height: 350px;">
+              <div
+                class="one_title_option"
+                v-for="position in sbPositionData"
+                :key="position.id"
+                @click="selectCountByPosition(position)"
+                v-show="position.type === 1"
+                :class="parentId==position.id?'opt_one_title_option':''">
+                <div><my-icon :type="item==1?'icon-lianyouchangqu-white':'icon-lianyouchangqu-copy'" style="font-size:80px; color:#fff;margin-right: 30px;"/></div>
+                <div>
+                  <div>{{ position.name }}</div>
+                  <div>{{ position.num }}台，总{{ position.childNum }}台</div>
+                </div>
               </div>
             </div>
-          </a-col>
-        </a-row>
+          </div>
+        </a-col>
+        <a-col :span="18" class="gutter-box">
+          <a-row :gutter="[20,20]">
+            <a-col :span="6" v-for="position in sbPositionData" v-show="position.type === 2 && position.parentId === parentId" :key="position.id" @click="selectCountBySbStatusGroup(position)">
+              <div class="gutter-btn gutter-color " :class="code==position.code?'opt_option':''">
+                <div style="font-size:32px">{{ position.name }}</div>
+                <div style="font-size:16px">3楼</div>
+                <div style="font-size:28px ;color:#3462FD">{{ position.num }}台</div>
+              </div>
+            </a-col>
+          </a-row>
+        </a-col>
+      </a-row>
+      <div>
+        <div class="main gutter-color">
+          <!-- <div class="title">报修数据</div> -->
+          <div>
+            <a-descriptions :column="6" bordered>
+              <a-descriptions-item v-for="item in typeData" :key="item.id" :label="BaseTool.Object.getField(statusMap,item.status)">{{ item.num }}台</a-descriptions-item>
+            </a-descriptions>
+          </div>
+        </div>
       </div>
-      <br />
-      <div class="two_title">
-        <a-row type="flex" :gutter="[20,40]">
-          <a-col :span="3" v-for="position in sbPositionData" v-show="position.type === 2 && position.parentId === parentId" :key="position.id" @click="selectCountBySbStatusGroup(position)">
-            <div class="two_title_option" :class="code==position.code?'opt_two_title_option':''">
-              <div> {{ position.name }}</div>
-              <div style="color:#296BEF;margin-top: 22px;">{{ position.num }}台</div>
-            </div>
-          </a-col>
-        </a-row>
-      </div>
-      <div class="three_title" v-if="typeData.length >0">
-        <!-- <div class="title">丙二车间：28台</div> -->
-        <a-row type="flex" justify="space-around" :gutter="[40,40]">
-          <a-col :span="3" v-for="item in typeData" :key="item.id" >
-            <div class="three_title_option" @click="jumpSbInfo(item)">
-              <div>{{ BaseTool.Object.getField(statusMap,item.status) }}</div>
-              <div style="padding:5px;background: #CDDBFA;opacity: 0.56;border-radius: 2px; color:#2C5DC7;margin-top: 10px;">{{ item.num }}台</div>
-            </div>
-          </a-col>
-        </a-row>
+      <div class="btn">
       </div>
     </div>
   </div>
 </template>
-
 <script>
 
 import {
@@ -54,7 +110,9 @@ export default {
   data () {
     return {
       confirmLoading: false,
+      drawerVisible: false,
       modalTitle: null,
+      queryParam: {},
       configMap: {},
       parentId: null,
       code: null,
@@ -78,6 +136,9 @@ export default {
     })
   },
   methods: {
+    drawerClose () {
+      this.drawerVisible = false
+    },
     base (record) {
       this.visible = true
       // 如果是空标识添加
@@ -116,61 +177,82 @@ export default {
 </script>
 
 <style lang="less" scoped>
+  .search{
+    width: 100%;
+background: #fff;
+text-align: center;
+padding:10px;
+margin-bottom: 20px;
+  }
+.gutter-box{
+  height: 350px;
+  overflow: auto;
+}
+.gutter-color{
+  background: #fff;
+  border: 1px solid #DDDDDD;
+}
+
+.gutter-btn{
+  height: 165px;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  font-size: 50px;
+  color:#333;
+  &:hover{
+    cursor: pointer;
+  }
+}
+.act{
+  color:#3462FD;
+}
 .main{
-  padding:20px;
-  // background: #fff;
-  .one_title_option{
+ margin-top:30px;
+}
+.title{
+ font-size: 28px;
+ font-family: PingFang SC;
+ font-weight: 500;
+ color: #3462FD;
+ padding:10px 42px;
+ border-bottom: 1px solid #DDDDDD;
+}
+.btn{
+   position: fixed;
+   bottom: 50px;
+   width: 100%;
+    display: flex;
+    justify-content: center;
+}
+.center{
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+.opt_option{
+    background: linear-gradient(-3deg, #cce2f0 0%, #99D1F6 100%);
+    color:#fff;
+}
+.one_title_option{
     background:#fff;
     display: flex;
-    justify-content: space-between;
+    // width: 100%;
+    // justify-content: space-between;
     align-items: center;
-    font-size: 26px;
+    margin-bottom:10px;
+    font-size: 25px;
     font-family: PingFang SC;
-    font-weight: bold;
     color: #333333;
     cursor: pointer;
     border-radius: 10px;
-    padding:17px 50px 17px 17px;
+    border: 1px solid #C0BEBE;
+    padding:17px ;
   }
    .opt_one_title_option{
     background: linear-gradient(-3deg, #99D1F6 0%, #9196F3 100%);
     color:#fff;
    }
-  .two_title_option{
-    background:#fff;
-    text-align: center;
-    font-size: 26px;
-    padding:20px;
-    cursor: pointer;
-    box-shadow: 1px 14px 29px 0px rgba(138,97,250,0.19);
-    border-radius: 10px;
-  }
-  .opt_two_title_option{
-    background: linear-gradient(-3deg, #cce2f0 0%, #99D1F6 100%);
-   }
-   .three_title{
-    margin-top: 50px;
-    background: #FFFFFF;
-    border: 1px solid #D2D5D9;
-    border-radius: 4px;
-    font-family: PingFang SC;
-    padding: 20px;
-    min-height:100vh;
-    .title{
-      width: 500px;
-      font-size: 34px;
-      font-weight: bold;
-      padding: 10px 0 30px 0;
-      color: #2C5DC7;
-      border-bottom: 2px solid #2c5dc7;
-      margin-bottom: 30px;
-    }
-    .three_title_option{
-      cursor: pointer;
-      font-size: 22px;
-      font-weight: 500;
-      text-align: center;
-    }
-   }
-}
+::-webkit-scrollbar { width: 0; height: 0; color: transparent; }
 </style>

src/views/sb/count/SbUseTypeCount copy.vue

@@ -0,0 +1,176 @@
+<template>
+  <div v-show="visible" class="main">
+    <div>
+      <div class="one_title">
+        <a-row type="flex" :gutter="[20,20]">
+          <a-col :span="6" v-for="position in sbPositionData" :key="position.id" @click="selectCountByPosition(position)" v-show="position.type === 1">
+            <div class="one_title_option" :class="parentId==position.id?'opt_one_title_option':''">
+              <div><my-icon type="icon-lianyouchangqu-copy" style="font-size:107px;"/></div>
+              <div>
+                <div> {{ position.name }}</div>
+                <div style="color:#296BEF;font-size: 42px;">{{ position.num }}台，总{{ position.childNum }}台</div>
+              </div>
+            </div>
+          </a-col>
+        </a-row>
+      </div>
+      <br />
+      <div class="two_title">
+        <a-row type="flex" :gutter="[20,40]">
+          <a-col :span="3" v-for="position in sbPositionData" v-show="position.type === 2 && position.parentId === parentId" :key="position.id" @click="selectCountByUseTypeGroup(position)">
+            <div class="two_title_option" :class="code==position.code?'opt_two_title_option':''">
+              <div> {{ position.name }}</div>
+              <div style="color:#296BEF;margin-top: 22px;">{{ position.num }}台</div>
+            </div>
+          </a-col>
+        </a-row>
+      </div>
+      <div class="three_title" v-if="typeData.length >0">
+        <!-- <div class="title">丙二车间：28台</div> -->
+        <a-row type="flex" justify="space-around" :gutter="[40,40]">
+          <a-col :span="3" v-for="item in typeData" :key="item.id" >
+            <div class="three_title_option" @click="jumpSbInfo(item)">
+              <div>{{ BaseTool.Object.getField(useTypeMap,item.useType) }}</div>
+              <div style="padding:5px;background: #CDDBFA;opacity: 0.56;border-radius: 2px; color:#2C5DC7;margin-top: 10px;">{{ item.num }}台</div>
+            </div>
+          </a-col>
+        </a-row>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+
+import {
+  selectCountByPositionGroup,
+  selectCountByUseTypeGroup
+} from '@/api/sb/count'
+
+export default {
+  name: 'SbPositionNum',
+  components: {
+  },
+  data () {
+    return {
+      confirmLoading: false,
+      modalTitle: null,
+      configMap: {},
+      parentId: null,
+      code: null,
+      sbPositionData: [],
+      useTypeMap: {},
+      typeData: [],
+      factoryStr: null,
+      form: this.$form.createForm(this),
+      visible: true,
+      user: this.$store.getters.userInfo
+    }
+  },
+  props: {
+  },
+  created () {
+    // 下拉框map
+    this.useTypeMap = this.DictCache.getLabelByValueMapByType(this.DictCache.TYPE.SB_USE_TYPE)
+    selectCountByPositionGroup().then(res => {
+      this.sbPositionData = res.data
+      this.selectCountByPosition(res.data[0])
+    })
+  },
+  methods: {
+    base (record) {
+      this.visible = true
+      // 如果是空标识添加
+      if (this.BaseTool.Object.isBlank(record)) {
+        this.modalTitle = '添加'
+        this.data = []
+      }
+    },
+    handleCancel (values) {
+      this.visible = false
+      this.confirmLoading = false
+      this.form.resetFields()
+      if (this.BaseTool.Object.isNotBlank(values)) {
+        this.$emit('ok', values)
+      } else {
+        this.$emit('ok')
+      }
+    },
+    selectCountByPosition (position) {
+      this.parentId = position.id
+      this.code = null
+      this.typeData = []
+    },
+    selectCountByUseTypeGroup (position) {
+      this.code = position.code
+      selectCountByUseTypeGroup(position).then(res => {
+        this.typeData = res.data
+      })
+    },
+    jumpSbInfo (type) {
+      const routeUrl = this.$router.resolve({ path: '/sb/info/company', query: { typeId: type.typeId } })
+      window.open(routeUrl.href, '_blank')
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.main{
+  padding:20px;
+  // background: #fff;
+  .one_title_option{
+    background:#fff;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    font-size: 26px;
+    font-family: PingFang SC;
+    font-weight: bold;
+    color: #333333;
+    cursor: pointer;
+    border-radius: 10px;
+    padding:17px 50px 17px 17px;
+  }
+   .opt_one_title_option{
+    background: linear-gradient(-3deg, #99D1F6 0%, #9196F3 100%);
+    color:#fff;
+   }
+  .two_title_option{
+    background:#fff;
+    text-align: center;
+    font-size: 26px;
+    padding:20px;
+    cursor: pointer;
+    box-shadow: 1px 14px 29px 0px rgba(138,97,250,0.19);
+    border-radius: 10px;
+  }
+  .opt_two_title_option{
+    background: linear-gradient(-3deg, #cce2f0 0%, #99D1F6 100%);
+   }
+   .three_title{
+    margin-top: 50px;
+    background: #FFFFFF;
+    border: 1px solid #D2D5D9;
+    border-radius: 4px;
+    font-family: PingFang SC;
+    padding: 20px;
+    min-height:100vh;
+    .title{
+      width: 500px;
+      font-size: 34px;
+      font-weight: bold;
+      padding: 10px 0 30px 0;
+      color: #2C5DC7;
+      border-bottom: 2px solid #2c5dc7;
+      margin-bottom: 30px;
+    }
+    .three_title_option{
+      cursor: pointer;
+      font-size: 22px;
+      font-weight: 500;
+      text-align: center;
+    }
+   }
+}
+</style>

src/views/sb/count/SbUseTypeCount.vue

@@ -1,45 +1,101 @@
 <template>
-  <div v-show="visible" class="main">
+  <div>
     <div>
-      <div class="one_title">
-        <a-row type="flex" :gutter="[20,20]">
-          <a-col :span="6" v-for="position in sbPositionData" :key="position.id" @click="selectCountByPosition(position)" v-show="position.type === 1">
-            <div class="one_title_option" :class="parentId==position.id?'opt_one_title_option':''">
-              <div><my-icon type="icon-lianyouchangqu-copy" style="font-size:107px;"/></div>
-              <div>
-                <div> {{ position.name }}</div>
-                <div style="color:#296BEF;font-size: 42px;">{{ position.num }}台，总{{ position.childNum }}台</div>
+      <div class="search">
+        <a-input-search
+          v-info.trim="queryParam.sampleName"
+          allowClear
+          enter-button
+          size="large"
+          style="width:500px"
+          placeholder="请输入设备名称"
+        >
+          <my-icon slot="addonBefore" :style="{ padding:'5px' }" type="icon-shaixuan" @click="drawerVisible = true"/>
+        </a-input-search>
+        <a-drawer
+          title="筛选"
+          placement="top"
+          :closable="false"
+          :visible="drawerVisible"
+          @close="drawerClose"
+        >
+          <a-form layout="inline">
+            <a-row :gutter="20">
+              <a-col :xxl="8" :md="12" :sm="24">
+                <a-form-item label="样品名称">
+                  <a-input v-model.trim="queryParam.sampleName" placeholder="请输入样品名称"/>
+                </a-form-item>
+              </a-col>
+              <a-col :xxl="8" :md="12" :sm="24">
+                <a-form-item label="批次号">
+                  <a-input v-model.trim="queryParam.batchNo" placeholder="请输入批次号"/>
+                </a-form-item>
+              </a-col>
+
+            </a-row>
+          </a-form>
+          <div
+            :style="{
+              position: 'absolute',
+              right: 0,
+              bottom: 0,
+              width: '100%',
+              padding: '10px 16px',
+              textAlign: 'center',
+              zIndex: 1,
+            }">
+            <a-button type="primary" size="large" @click="getInfo">查询</a-button>
+            <a-button style="margin-left: 88px" size="large" @click="queryParam={}">重置</a-button>
+          </div>
+        </a-drawer>
+      </div>
+      <a-row :gutter="40">
+        <a-col :span="6">
+          <div class="">
+            <div style=" overflow: auto;height: 350px;">
+              <div
+                class="one_title_option"
+                v-for="position in sbPositionData"
+                :key="position.id"
+                @click="selectCountByPosition(position)"
+                v-show="position.type === 1"
+                :class="parentId==position.id?'opt_one_title_option':''">
+                <div><my-icon :type="item==1?'icon-lianyouchangqu-white':'icon-lianyouchangqu-copy'" style="font-size:80px; color:#fff;margin-right: 30px;"/></div>
+                <div>
+                  <div>{{ position.name }}</div>
+                  <div>{{ position.num }}台，总{{ position.childNum }}台</div>
+                </div>
               </div>
             </div>
-          </a-col>
-        </a-row>
+          </div>
+        </a-col>
+        <a-col :span="18" class="gutter-box">
+          <a-row :gutter="[20,20]">
+            <a-col :span="6" v-for="position in sbPositionData" v-show="position.type === 2 && position.parentId === parentId" :key="position.id" @click="selectCountByUseTypeGroup(position)">
+              <div class="gutter-btn gutter-color " :class="code==position.code?'opt_option':''">
+                <div style="font-size:32px">{{ position.name }}</div>
+                <div style="font-size:16px">3楼</div>
+                <div style="font-size:28px ;color:#3462FD">{{ position.num }}台</div>
+              </div>
+            </a-col>
+          </a-row>
+        </a-col>
+      </a-row>
+      <div>
+        <div class="main gutter-color">
+          <!-- <div class="title">报修数据</div> -->
+          <div>
+            <a-descriptions :column="6" bordered>
+              <a-descriptions-item v-for="item in typeData" :key="item.id" :label="BaseTool.Object.getField(useTypeMap,item.useType)">{{ item.num }}台</a-descriptions-item>
+            </a-descriptions>
+          </div>
+        </div>
       </div>
-      <br />
-      <div class="two_title">
-        <a-row type="flex" :gutter="[20,40]">
-          <a-col :span="3" v-for="position in sbPositionData" v-show="position.type === 2 && position.parentId === parentId" :key="position.id" @click="selectCountByUseTypeGroup(position)">
-            <div class="two_title_option" :class="code==position.code?'opt_two_title_option':''">
-              <div> {{ position.name }}</div>
-              <div style="color:#296BEF;margin-top: 22px;">{{ position.num }}台</div>
-            </div>
-          </a-col>
-        </a-row>
-      </div>
-      <div class="three_title" v-if="typeData.length >0">
-        <!-- <div class="title">丙二车间：28台</div> -->
-        <a-row type="flex" justify="space-around" :gutter="[40,40]">
-          <a-col :span="3" v-for="item in typeData" :key="item.id" >
-            <div class="three_title_option" @click="jumpSbInfo(item)">
-              <div>{{ BaseTool.Object.getField(useTypeMap,item.useType) }}</div>
-              <div style="padding:5px;background: #CDDBFA;opacity: 0.56;border-radius: 2px; color:#2C5DC7;margin-top: 10px;">{{ item.num }}台</div>
-            </div>
-          </a-col>
-        </a-row>
+      <div class="btn">
       </div>
     </div>
   </div>
 </template>
-
 <script>
 
 import {
@@ -54,7 +110,9 @@ export default {
   data () {
     return {
       confirmLoading: false,
+      drawerVisible: false,
       modalTitle: null,
+      queryParam: {},
       configMap: {},
       parentId: null,
       code: null,
@@ -78,6 +136,9 @@ export default {
     })
   },
   methods: {
+    drawerClose () {
+      this.drawerVisible = false
+    },
     base (record) {
       this.visible = true
       // 如果是空标识添加
@@ -116,61 +177,82 @@ export default {
 </script>
 
 <style lang="less" scoped>
+  .search{
+    width: 100%;
+background: #fff;
+text-align: center;
+padding:10px;
+margin-bottom: 20px;
+  }
+.gutter-box{
+  height: 350px;
+  overflow: auto;
+}
+.gutter-color{
+  background: #fff;
+  border: 1px solid #DDDDDD;
+}
+
+.gutter-btn{
+  height: 165px;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  font-size: 50px;
+  color:#333;
+  &:hover{
+    cursor: pointer;
+  }
+}
+.act{
+  color:#3462FD;
+}
 .main{
-  padding:20px;
-  // background: #fff;
-  .one_title_option{
+ margin-top:30px;
+}
+.title{
+ font-size: 28px;
+ font-family: PingFang SC;
+ font-weight: 500;
+ color: #3462FD;
+ padding:10px 42px;
+ border-bottom: 1px solid #DDDDDD;
+}
+.btn{
+   position: fixed;
+   bottom: 50px;
+   width: 100%;
+    display: flex;
+    justify-content: center;
+}
+.center{
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+.opt_option{
+    background: linear-gradient(-3deg, #cce2f0 0%, #99D1F6 100%);
+    color:#fff;
+}
+.one_title_option{
     background:#fff;
     display: flex;
-    justify-content: space-between;
+    // width: 100%;
+    // justify-content: space-between;
     align-items: center;
-    font-size: 26px;
+    margin-bottom:10px;
+    font-size: 25px;
     font-family: PingFang SC;
-    font-weight: bold;
     color: #333333;
     cursor: pointer;
     border-radius: 10px;
-    padding:17px 50px 17px 17px;
+    border: 1px solid #C0BEBE;
+    padding:17px ;
   }
    .opt_one_title_option{
     background: linear-gradient(-3deg, #99D1F6 0%, #9196F3 100%);
     color:#fff;
    }
-  .two_title_option{
-    background:#fff;
-    text-align: center;
-    font-size: 26px;
-    padding:20px;
-    cursor: pointer;
-    box-shadow: 1px 14px 29px 0px rgba(138,97,250,0.19);
-    border-radius: 10px;
-  }
-  .opt_two_title_option{
-    background: linear-gradient(-3deg, #cce2f0 0%, #99D1F6 100%);
-   }
-   .three_title{
-    margin-top: 50px;
-    background: #FFFFFF;
-    border: 1px solid #D2D5D9;
-    border-radius: 4px;
-    font-family: PingFang SC;
-    padding: 20px;
-    min-height:100vh;
-    .title{
-      width: 500px;
-      font-size: 34px;
-      font-weight: bold;
-      padding: 10px 0 30px 0;
-      color: #2C5DC7;
-      border-bottom: 2px solid #2c5dc7;
-      margin-bottom: 30px;
-    }
-    .three_title_option{
-      cursor: pointer;
-      font-size: 22px;
-      font-weight: 500;
-      text-align: center;
-    }
-   }
-}
+::-webkit-scrollbar { width: 0; height: 0; color: transparent; }
 </style>