资产管理-鼠标移至物品名称处显示物品最新状态

src/views/material/asset.vue

@@ -90,7 +90,35 @@
                   height="calc(100vh - 180px)"
                   size="mini">
           <el-table-column label="唯一编码" prop="deptAssetNumber" :show-overflow-tooltip="true"/>
-          <el-table-column label="物品名称" prop="assetName" min-width="100" :show-overflow-tooltip="true"/>
+          <el-table-column label="物品名称" prop="assetName" min-width="100" :show-overflow-tooltip="true">
+            <template slot-scope="scope">
+              <el-popover
+                placement="right"
+                width="500"
+                trigger="hover">
+                <div class="assset-popover">
+                  <span class="a-p-title">入库来源:</span>
+                  <el-tag>{{ getSourceName(scope.row.source) }}</el-tag>
+                </div>
+                <div class="assset-popover">
+                  <span class="a-p-title">详细描述:</span>
+                  <span class="a-p-des">{{ scope.row.remark }}</span>
+                </div>
+                <div class="assset-popover">
+                  <span class="a-p-title">当前状态:</span>
+                  <el-tag v-if="scope.row.status!='1'">{{'【' + scope.row.transferRecord.receiveUserName + '】正在领用' }}</el-tag>
+                  <el-tag v-else>{{ '【在库】' }}</el-tag>
+                  <span class="a-p-des">{{ parseTime(scope.row.transferRecord.transferDate) }}</span>
+                  <span class="a-p-des a-p-user">{{ scope.row.transferRecord.transferUserName }}</span>
+                  <span class="a-p-des"><i class="el-icon-right"/></span>
+                  <span class="a-p-des a-p-user">{{ scope.row.transferRecord.receiveUserName }}</span>
+                  <span class="a-p-des">{{ '【' + scope.row.transferRecord.transferRemark + '】' }}</span>
+                </div>
+
+                <div slot="reference">{{ scope.row.assetName }}</div>
+              </el-popover>
+            </template>
+          </el-table-column>
           <el-table-column label="公司资产编号" prop="assetNumber" :show-overflow-tooltip="true"/>
           <el-table-column label="资产类型" width="80">
             <template slot-scope="scope">
@@ -733,7 +761,15 @@ export default {
       cell.style.color = '#606266';
       cell.style.textDecoration = 'none';
     },
-
+    getSourceName(sourceCode) {
+      let label = ''
+      this.dict.type.s_source.forEach(dict => {
+        if (dict.value === sourceCode) {
+          label = dict.label
+        }
+      })
+      return label
+    }
   }
 }
 </script>
@@ -768,4 +804,22 @@ export default {
   text-align: right;
   margin-top: 20px;
 }
+
+.assset-popover {
+  margin: 5px 0;
+
+  .a-p-title {
+    font-size: 12px;
+    font-weight: bold;
+  }
+
+  .a-p-des {
+    font-size: 11px;
+    margin-left: 5px;
+  }
+
+  .a-p-user {
+    color: #409eff;
+  }
+}
 </style>