冰箱显示

src/dashoo.cn/frontend_web/src/pages/equipment/_opera/manage_new.vue

@@ -91,50 +91,63 @@
                   <i class="icon icon-stop2" style="color:#20A0FF"></i>容量(25%-50%)
                   <i class="icon icon-stop2" style="color:#836FFF"></i>容量(50%-75%)
                   <i class="icon icon-stop2" style="color:#000080"></i>容量(75%-100%)
-                  <table cellspacing="0" cellpadding="0">
-                    <thead>
-                      <th></th>
-                      <th v-for="ind in colorTableWidth">{{ind}}</th>
-                    </thead>
-                    <tbody>
-                      <tr v-for=" (xcolorTable,k1) in colorTableHeight">
-                        <td style="text-align:center;font-size:20px;">{{numtoengs[xcolorTable-1]}}</td>
-                        <td v-for="(ycolorTable,k2) in colorTableWidth"
-                          v-bind:class="{ 'tdborder': true, 'tdleftborder': k2 === 0, 'tdtopborder': k1 === 0, 'tdrightborder': k2 === colorTableWidth-1 }">
-                          <div class="ulbgcolor"
-                            v-bind:style="{ width: unitwidth/colorTableWidth + 'px', height: unitheight/colorTableHeight + 'px' }">
-                            <div v-for="(shelfitem, index) in samplelist">
-                              <div v-if="samplelist[index].XStation === k2+1 && samplelist[index].YStation === k1+1">
-                                <div v-for="rowindex in samplelist[index].RowNum">
-                                  <div class="hoverdiv" v-for=" colindex in samplelist[index].ColumnNum">
+                  <el-row :gutter="20">
+                    <el-col :span="18">
+                      <table cellspacing="0" cellpadding="0">
+                        <thead>
+                          <th></th>
+                          <th v-for="ind in colorTableWidth">{{ind}}</th>
+                        </thead>
+                        <tbody>
+                          <tr v-for=" (xcolorTable,k1) in colorTableHeight">
+                            <td style="text-align:center;font-size:20px;">{{numtoengs[xcolorTable-1]}}</td>
+                            <td v-for="(ycolorTable,k2) in colorTableWidth"
+                              v-bind:class="{ 'tdborder': true, 'tdleftborder': k2 === 0, 'tdtopborder': k1 === 0, 'tdrightborder': k2 === colorTableWidth-1 }">
+                              <div class="ulbgcolor"
+                              v-bind:style="{ width: unitwidth/colorTableWidth + 'px', height: unitheight/colorTableHeight + 'px' }">
+                              <div v-for="(shelfitem, index) in samplelist">
+                                <div v-if="samplelist[index].XStation === k2+1 && samplelist[index].YStation === k1+1">
+                                  <div class="hoverdiv" v-for="rowindex in samplelist[index].RowNum">
                                     <div v-bind:style="{ 
-                                width: (unitwidth/colorTableWidth/samplelist[index].ColumnNum-2.5) + 'px',
+                                width: (unitwidth/colorTableWidth-2.5) + 'px',
                                 height: (unitheight/colorTableHeight/samplelist[index].RowNum-2.5) + 'px',
-                                backgroundColor: xbox == colindex && ybox == rowindex && 
-                                xshelf == k1+1 && yshelf == k2+1 ? COLORARR[2] : 
-                                (samplelist[index][numtoengs[rowindex-1]+colindex] == -2 ? COLORARR[0] : 
-                                (samplelist[index][numtoengs[rowindex-1]+colindex] == -1 ? COLORARR[1] : 
-                                (samplelist[index][numtoengs[rowindex-1]+colindex] > 0 && 
-                                samplelist[index][numtoengs[rowindex-1]+colindex] <= 25 ? COLORARR[3] : 
-                                (samplelist[index][numtoengs[rowindex-1]+colindex] > 25 && 
-                                samplelist[index][numtoengs[rowindex-1]+colindex] <= 50 ? COLORARR[4] : 
-                                (samplelist[index][numtoengs[rowindex-1]+colindex] > 50 && 
-                                samplelist[index][numtoengs[rowindex-1]+colindex] <= 75 ? COLORARR[5] : 
-                                (samplelist[index][numtoengs[rowindex-1]+colindex] > 75 ? COLORARR[6] : 
-                                COLORARR[7])))))) }" style="margin: 1px"
-                                      @click="handleclk(colindex-1, rowindex-1, k1+1, k2+1)"></div>
+                                backgroundColor: ybox == rowindex && xshelf == k1+1 && yshelf == k2+1 ? COLORARR[7] : COLORARR[0]}" style="margin: 1px"
+                                  @click="getEquipPosition(rowindex-1, k1+1, k2+1)"></div>
                                   </div>
                                 </div>
                               </div>
                             </div>
-                          </div>
-                        </td>
-                      </tr>
-                    </tbody>
-                  </table>
-                  <div>
-                    <img :src="fridgebottomimg" class="fridge">
-                  </div>
+                            </td>
+                          </tr>  
+                        </tbody>
+                      </table>
+                      <div>
+                        <img :src="fridgebottomimg" class="fridge">
+                      </div>
+                    </el-col>
+                    <!-- <el-col :span="6">
+                      <div class="ulbgcolor" v-for="g in Math.ceil(selectdtedanguan.ColumnNum / 21)"
+                        style="width:50px;float:left;margin-left:1px">
+                        <div v-for="b in selectdtedanguan.ColumnNum">
+                          <div class="hoverdiv" v-if="(b <= g*21) && (b > (g - 1)*21)"
+                            @click="handleclk(b-1, 0, selectdtedanguan.YStation, selectdtedanguan.XStation)"
+                            v-bind:style="{ 
+                        backgroundColor: xbox == b && ybox == 1 && 
+                        xshelf == selectdtedanguan.YStation && yshelf == selectdtedanguan.XStation ? COLORARR[2] : 
+                        (selectdtedanguan['A'+b] == -2 ? COLORARR[0] : 
+                        (selectdtedanguan['A'+b] == -1 ? COLORARR[1] : 
+                        (selectdtedanguan['A'+b] > 0 && 
+                        selectdtedanguan['A'+b] <= 25 ? COLORARR[3] : 
+                        (selectdtedanguan['A'+b] > 25 && 
+                        selectdtedanguan['A'+b] <= 50 ? COLORARR[4] : 
+                        (selectdtedanguan['A'+b] > 50 && 
+                        selectdtedanguan['A'+b] <= 75 ? COLORARR[5] : 
+                        (selectdtedanguan['A'+b] > 75 ? COLORARR[6] : 
+                        COLORARR[7])))))) }" style="margin: 1px;width:50px; height:20px;"></div>
+                        </div>
+                      </div>
+                    </el-col> -->
+                  </el-row>
                 </el-row>
               </div>
 
@@ -663,8 +676,6 @@
           SampleCode: '', // 样本编码
           SampleType: '', // 样本类型
           SampleTypeName: '',
-          // SamplingOrgan: '', // 组织器官
-          // SamplingSite: '', // 取材部位
           SamplingSiteName: '',
           Name: '', // 名称
           ReceiveDate: new Date(), // 接收日期
@@ -692,9 +703,6 @@
           autoprintchecked: true,
           type_flag: 'add', // 标记点预录入或者没点
           saveandadd: '', // 保存并新增：1；保存新增分管：2
-          // SampleTypeName: '', // 样本类型名称
-          // zuzhiName: '', // 组织器官名称
-          // SamplingSiteName: '', // 取材部位名称
           PositionStr: '', // 样本位置信息
           uploadeds: [], // 已上传的附件
           CreateUserId: 0, // 录入人
@@ -763,7 +771,7 @@
         tableData2: [],
         tableColumnWidth2: '160',
         // 冰箱面板
-        unitwidth: 550, // 整个冰箱的尺寸
+        unitwidth: 400, // 整个冰箱的尺寸
         unitheight: 378,
         dchxtable: -1, // 对勾所在位置
         dchytable: -1,
@@ -804,7 +812,7 @@
         selectedBox: [],
         boxSample: [],
         equipid: 0, // 新增，设备id
-        COLORARR: ['#EAEAEA', '#13CE66', '#FF4949', '#D1EEEE', '#20A0FF', '#836FFF', '#000080'],
+        COLORARR: ['#EAEAEA', '#13CE66', '#FF4949', '#D1EEEE', '#20A0FF', '#836FFF', '#000080', '#FF7777'], //灰、绿、粉、25%、蓝、紫、深蓝
         selectedorgan: [], // 级联所选组织结构
         sampleorganprops: {
           value: 'code',
@@ -2264,14 +2272,14 @@
     methods: {
       initData(eid) {
         let _this = this
-        // 获取冻存架信息
         _this.$axios.get('/shelfset/equipmentdraw/' + eid, {})
           .then(res => {
             _this.downloading = false
             _this.samplelist = res.data.items
-            _this.colorTableHeight = res.data.dimension[1]
-            _this.colorTableWidth = res.data.dimension[0]
-            _this.location()
+            console.log("klllllllllllllllllllllll",_this.samplelist)
+            _this.colorTableWidth = res.data.dimension[0] //列
+            _this.colorTableHeight = res.data.dimension[1] //层           
+            _this.location() //液氮罐
           })
           .catch(err => {
             console.error(err)
@@ -2363,7 +2371,7 @@
       // 获取是否生成编码
       getAutoCodedata() {
         let _this = this
-        _this.$axios.get('/sampleoperation/getAutoCodedata', {})
+        _this.$axios.get('/sampleoperation/getautocodedata', {})
           .then(res => {
             _this.sampleForm.code_default = res.data.code_default
             _this.sampleForm.code_codeId = res.data.code_codeId
@@ -2466,6 +2474,8 @@
             _this.selectdtedanguan = {
               ColumnNum: 0
             }
+            console.log("---------------------", _this.selectdtedanguan)
+            console.log("--1111111111111111----", _this.samplelist)
             for (var i = 0; i < _this.samplelist.length; i++) {
               if (_this.samplelist[i].XStation === v.XStation && _this.samplelist[i].YStation === v.YStation) {
                 _this.selectdtedanguan = _this.samplelist[i]
@@ -2484,6 +2494,7 @@
                   _this.yedanguanctx.closePath()
                   _this.yedanguanctx.fill()
                 }
+                console.log("---vvvvvvvvvvvvvv-------", _this.yedanguanctx)
                 // 排除搜索进来的
                 if (!_this.fristseach) {
                   _this.handleclk(-1, -1, -1, -1)
@@ -2494,7 +2505,7 @@
           }
         })
       },
-      // 获取点击canvas的坐标
+      // 获取液氮罐点击canvas的坐标
       getEventPosition(ev) {
         let x, y
         if (ev.layerX || ev.layerX === 0) {
@@ -2509,6 +2520,24 @@
           y: y
         }
       },
+      // 获取冰箱冻存架点击坐标
+      getEquipPosition(ybox, xshelf, yshelf) {
+        console.log("jnkllllllllllllllll",ybox, xshelf, yshelf)
+        let index = (xshelf - 1) * this.colorTableWidth + yshelf
+        console.log("j-----------------l",index)
+        // let x, y
+        // if (ev.layerX || ev.layerX === 0) {
+        //   x = ev.layerX
+        //   y = ev.layerY
+        // } else if (ev.offsetX || ev.offsetX === 0) { // Opera
+        //   x = ev.offsetX
+        //   y = ev.offsetY
+        // }
+        // return {
+        //   x: x,
+        //   y: y
+        // }
+      },
 
       uploadrequest(option) {
         let _this = this
@@ -2579,10 +2608,12 @@
       },
 
       handleclk(xbox, ybox, xshelf, yshelf) {
+        console.log("-=2rffffffffffffff",xbox, ybox, xshelf, yshelf)
         // 清空状态
         this.clearSampleForm()
         let _this = this
         var inputstr = _this.equipid + ',' + yshelf + ',' + xshelf + ',' + (xbox + 1) + ',' + (ybox + 1)
+        console.log("-=2kkkkkkkkkkkkkkkkkkkkkk",inputstr)
         _this.$axios.get('/shelfset/boxdraw/' + inputstr, {})
           .then(res => {
             _this.selectedBox = res.data.Boxshelf
@@ -2612,7 +2643,7 @@
       },
       tableclk(v, x, y) {
         this.checkPosition =
-          `${this.equipCode}-${this.numtoupchar(this.xshelf)}${this.yshelf}-${this.numtoupchar(this.ybox)}${this.xbox}-${this.numtoupchar(x)}${y}` 
+          `${this.equipCode}-${this.numtoupchar(this.xshelf)}${this.yshelf}-${this.numtoupchar(this.ybox)}${this.xbox}-${this.numtoupchar(x)}${y}`
         //清空状态
         this.clearSampleForm()
         if (v != null) {