Procházet zdrojové kódy

fix:仓库可视化批号长度限制

zhangjingyuan před 2 roky
rodič
revize
ebbc5e926b

+ 4 - 1
src/views/component/fwposition.vue

@@ -74,7 +74,10 @@
                                                         <p>货号:{{ it.huo_hao_ || "空" }}</p>
                                                     </div>
                                                     <div class="right-content">
-                                                        <p>入库批号:{{ it.ru_ku_pi_hao_ || "空" }}</p>
+                                                        <p v-show="it.ru_ku_pi_hao_" style="width: 150px;overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">
+                                                            入库批号:{{ it.ru_ku_pi_hao_ || "/" }}
+                                                        </p>
+                                                        <p v-show="!it.ru_ku_pi_hao_">入库批号:/</p>
                                                         <p>存储条件:{{ it.cun_chu_yao_qiu_ || "空" }}</p>
                                                         <p>有效期:{{ it.you_xiao_qi_ || "空" }}</p>
                                                         <p>库存量:{{ it.ku_cun_liang_ || "空" }}</p>

+ 37 - 15
src/views/component/zhuposition.vue

@@ -52,18 +52,21 @@
                                         <div class="level-dsc">第{{ index | indexfilter(listData) }}层</div>
                                         <div class="goods-list">
                                             <div v-for="(it, index) in listData[index]" :key="index" class="goods-dsc" :style="{background: !it.wu_liao_bian_ma_ ? '#67c23a' : '',}" @click="closeView(it)">
-                                                <div class="top-dsc">
+                                                <div class="top-dsc" style="position: relative;">
                                                     <div class="position">
-                                                        <p>名称:{{ it.wu_pin_ming_chen }}</p>
-                                                        <p>编码:{{ it.wu_liao_bian_ma_ || "" }}</p>
-                                                        <p>位置:{{ it.cun_fang_wei_zhi_ || "" }}</p>
-                                                        <p>货号:{{ it.huo_hao_ || "" }}</p>
+                                                        <p style="width: 150px;overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">名称:{{ it.wu_liao_ming_chen || '/' }}</p>
+                                                        <p>编码:{{ it.wu_liao_bian_ma_ || "/" }}</p>
+                                                        <p>位置:{{ it.cun_fang_wei_zhi_ || "/" }}</p>
+                                                        <p>货号:{{ it.huo_hao_ || "/" }}</p>
                                                     </div>
                                                     <div class="position right-content ">
-                                                        <p>入库批号:{{ it.ru_ku_pi_hao_ || "空" }}</p>
-                                                        <p>存储条件:{{ it.cun_chu_yao_qiu_ || "空" }}</p>
-                                                        <p>有效期:{{ it.you_xiao_qi_ || "空" }}</p>
-                                                        <p>库存量:{{ it.ku_cun_liang_ || "空" }}</p>
+                                                        <p v-show="it.ru_ku_pi_hao_" style="width: 150px;overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">
+                                                            入库批号:{{ it.ru_ku_pi_hao_ || "/" }}
+                                                        </p>
+                                                        <p v-show="!it.ru_ku_pi_hao_">入库批号:/</p>
+                                                        <p>存储条件:{{ it.cun_chu_yao_qiu_ || "/" }}</p>
+                                                        <p>有效期:{{ it.you_xiao_qi_ || "/" }}</p>
+                                                        <p>库存量:{{ it.ku_cun_liang_ || "/" }}</p>
                                                     </div>
                                                 </div>
                                             </div>
@@ -273,20 +276,20 @@ export default {
                             // 组件以货架分层的数据: {1:[],2:[],3:[],4:[],5:[],6}
                             const num = item.wei_zhi_.split('-')[1]
                             if (num === prop) {
-                                labelsMap[prop].push({ cun_fang_wei_zhi_: item.wei_zhi_, wu_liao_ming_chen: '' })
+                                labelsMap[prop].push({ cun_fang_wei_zhi_: item.wei_zhi_, panduan: '' })
                             }
                         })
                     }
                     this_.listData = labelsMap
                     for (const prop in this_.listData) {
                         for (const index in this_.listData[prop[0]]) {
-                            if (!this_.listData[prop[0]][index].wu_liao_ming_chen) {
+                            if (!this_.listData[prop[0]][index].panduan) {
                                 const sqlString = `select * from t_mjwlgl where cun_fang_wei_zhi_ = '${this_.listData[prop[0]][index].cun_fang_wei_zhi_}'`
                                 curdPost('sql', sqlString).then((res) => {
                                     const wuliao = res.variables.data
                                     if (wuliao.length > 0) {
                                         let arr = []
-                                        arr = this_.listData[prop[0]].filter(el => { if (el.wu_liao_ming_chen === '' && el.cun_fang_wei_zhi_ === wuliao[0].cun_fang_wei_zhi_) { return false } else { return true } })
+                                        arr = this_.listData[prop[0]].filter(el => { if (el.panduan === '' && el.cun_fang_wei_zhi_ === wuliao[0].cun_fang_wei_zhi_) { return false } else { return true } })
                                         this_.listData[prop[0]] = arr.concat(wuliao)
                                     }
                                 })
@@ -479,10 +482,10 @@ p {
             margin-right: 15px;
             .goods-dsc {
               cursor: pointer;
-              padding: 6px 12px;
+              padding: 6px 3px;
               border-radius: 5px;
               background: #e6a23c;
-              margin-left: 12px;
+              margin-left: 7px;
               margin-top: 6px;
               box-sizing: border-box;
               .top-dsc {
@@ -493,7 +496,7 @@ p {
                   line-height: 18px;
                 }
                 .right-content > p {
-                  margin-left: 15px;
+                  margin-left: 7px;
                 }
               }
               .goods-demo {
@@ -526,4 +529,23 @@ p {
     }
   }
 }
+.tooltip {
+        }
+        .tooltip::after {
+            content: attr(data-text); /* 获取 data-text 属性值作为 tooltip 内容 */
+            position: absolute; /* 绝对定位 */
+            top: 10px; /* 调整 tooltip 距离元素顶部的距离 */
+            left: 50%; /* 水平居中 */
+            transform: translateX(-50%); /* 水平居中 */
+            padding: 4px; /* 添加边距 */
+            background-color: #333; /* 背景色 */
+            color: white; /* 前景色 */
+            border-radius: 4px; /* 圆角 */
+            opacity: 1; /* 初始不可见 */
+            transition: opacity 0.3s ease; /* 过渡效果 */
+        }
+
+        .tooltip:hover::after {
+            opacity: 1; /* 鼠标悬停时显示 tooltip */
+        }
 </style>