From ccfd5dc264d07471d831d2287ff03f293c295981 Mon Sep 17 00:00:00 2001
From: Goldennfish <1981343953@qq.com>
Date: 星期二, 25 七月 2023 14:22:44 +0800
Subject: [PATCH] Merge branch 'master' of https://gitee.com/yuanchu_code/lims-front-end

---
 src/views/laboratory/ledger/index.vue |  282 +++++++++++++++++++++++++++++++++++++++++++++++++++-----
 1 files changed, 256 insertions(+), 26 deletions(-)

diff --git a/src/views/laboratory/ledger/index.vue b/src/views/laboratory/ledger/index.vue
index 4f8a8ce..242feea 100644
--- a/src/views/laboratory/ledger/index.vue
+++ b/src/views/laboratory/ledger/index.vue
@@ -2,7 +2,7 @@
   <div class="ledger-main">
     <div class="page-header-search">
       <div class="search-bar">
-        <el-form ref="form" inline="true" :model="searchData">
+        <el-form ref="form" :inline="true" :model="searchData">
           <el-form-item>
             <el-input
               v-model="searchData.keyword"
@@ -38,12 +38,12 @@
           </el-row>
         </div>
         <el-tree
-          ref="tree"
-          class="filter-tree"
-          :data="data"
+          ref="classTree"
+          :data="classTree"
           :props="defaultProps"
           default-expand-all
           :filter-node-method="filterNode"
+          @node-click="nodeClickHandler"
         />
       </div>
       <div class="library-table">
@@ -65,15 +65,15 @@
         </div>
         <div class="table-box">
           <el-table
-            ref="personnerlTable"
-            :max-height="800"
+            ref="equipmentTable"
+            node-key="father_name"
             :cell-style="{textAlign: 'center'}"
             :header-cell-style="{border:'0px',background:'#f5f7fa',color:'#606266',boxShadow: 'inset 0 1px 0 #ebeef5',textAlign: 'center'}"
-            :data="personnerlTable"
+            :data="equipmentTable"
             style="width: 100%"
           >
             <el-table-column
-              prop="id"
+              type="index"
               label="搴忓彿"
               min-width="90"
             />
@@ -85,30 +85,27 @@
             <el-table-column
               prop="equipment_name"
               label="浠櫒璁惧鍚嶇О"
-              min-width="200"
+              min-width="150"
             />
             <el-table-column
-              prop="specification_models"
-              label="鍨嬪彿瑙勬牸"
-              min-width="200"
+              prop="specifications_models"
+              label="瑙勬牸鍨嬪彿"
+              min-width="150"
             />
             <el-table-column
-              prop="keeper"
+              prop="name"
               label="淇濈浜�"
               min-width="200"
             />
             <el-table-column
-              prop="term_validity"
+              prop="termValidity"
               label="璁¢噺鎴鏈夋晥鏈�"
               min-width="200"
             />
             <el-table-column
               prop="conditions"
               label="璁惧鐘舵��"
-              min-width="200"
-              :filters="[{ text: 0, value: 0 }, { text: 1, value: 1 }]"
-              :filter-method="filterTag"
-              filter-placement="bottom-end"
+              min-width="120"
             >
               <template slot-scope="scope">
                 <el-tag
@@ -123,12 +120,17 @@
               min-width="200"
             />
             <el-table-column
-              label="鎿嶄綔"
+              prop="storage_place"
+              label="瀛樻斁鍦�"
               min-width="200"
+            />
+            <el-table-column
+              label="鎿嶄綔"
+              min-width="120"
               fixed="right"
             >
               <template slot-scope="scope">
-                <el-button type="text" size="small" @click="handleClick(scope.row)">鏌ョ湅</el-button>
+                <el-button type="text" size="small" @click="openDetail(scope.row)">缂栬緫</el-button>
                 <el-button type="text" size="small">鍒犻櫎</el-button>
               </template>
             </el-table-column>
@@ -157,10 +159,10 @@
           <div>
             <el-pagination
               :current-page="currentPage"
-              :page-sizes="[100, 200, 300, 400]"
-              :page-size="100"
+              :page-sizes="[10, 15, 20, 25]"
+              :page-size="pageSize"
               layout="total, sizes, prev, pager, next, jumper"
-              :total="400"
+              :total="total"
               @size-change="handleSizeChange"
               @current-change="handleCurrentChange"
             />
@@ -341,15 +343,100 @@
                 </div>
               </div>
             </el-drawer>
+    <!--  -->
+    <el-drawer
+      title="浠櫒璁惧璇︽儏"
+      :visible.sync="detailDrawer"
+      size="80%"
+      class="detailDrawer"
+    >
+      <div>
+        <div class="detail-info">
+          <div class="tips-main">
+            <div class="tips">
+              <span />
+              <div>鍩烘湰淇℃伅</div>
+            </div>
+            <div class="tips-btn">
+              <span><i class="el-icon-edit" />鎿嶄綔锛�</span>
+              <el-button type="text" @click="dialogFormVisible = true">缂栬緫</el-button>
+            </div>
+          </div>
+          <div class="message">
+            <div class="message-item"><span><i class="el-icon-edit" />鎵�灞炲垎绫伙細</span></div>
+            <div class="message-item">
+              <span><i class="el-icon-edit" />鍒涘缓浜猴細</span>
+              <el-tag type="primary"><i class="el-icon-info" :style="{marginRight:'4px', color:'#409EFF'}" /></el-tag>
+            </div>
+            <div class="message-item">
+              <span><i class="el-icon-edit" />寤烘。鏃ユ湡锛�</span>
+            </div>
+            <div class="message-item">
+              <span><i class="el-icon-edit" />璁惧缂栧彿锛�</span>
+            </div>
+            <div class="message-item">
+              <span><i class="el-icon-edit" />鍨嬪彿瑙勬牸锛�</span>
+            </div>
+            <div class="message-item">
+              <span><i class="el-icon-edit" />娴嬮噺鑼冨洿锛�</span>
+            </div>
+            <div class="message-item">
+              <span><i class="el-icon-edit" />涓嶇‘瀹氬害/璇樊锛�</span>
+            </div>
+            <div class="message-item">
+              <span><i class="el-icon-edit" />鐢熶骇鍘傚锛�</span>
+            </div>
+            <div class="message-item">
+              <span><i class="el-icon-edit" />瀛樻斁鍦扮偣锛�</span>
+            </div>
+            <div class="message-item">
+              <span><i class="el-icon-edit" />鍒拌揣鏃ユ湡锛�</span>
+            </div>
+            <div class="message-item">
+              <span><i class="el-icon-edit" />楠屾敹鏃ユ湡锛�</span>
+            </div>
+            <div class="message-item">
+              <span><i class="el-icon-edit" />淇濈浜猴細</span>
+            </div>
+            <div class="message-item">
+              <span><i class="el-icon-edit" />鏄惁鏀寔鏁伴噰锛�</span>
+            </div>
+            <div class="message-item">
+              <span><i class="el-icon-edit" />浠櫒璁惧璁¢噺锛�</span>
+            </div>
+            <div class="message-item">
+              <span><i class="el-icon-edit" />璁¢噺鍛ㄦ湡锛�</span>
+            </div>
+            <div class="message-item">
+              <span><i class="el-icon-edit" />鎻忚堪锛�</span>
+            </div>
+          </div>
+        </div>
+        <el-tabs>
+          <el-tab-pane label="鐢ㄦ埛绠$悊" name="first">鐢ㄦ埛绠$悊</el-tab-pane>
+          <el-tab-pane label="閰嶇疆绠$悊" name="second">閰嶇疆绠$悊</el-tab-pane>
+          <el-tab-pane label="瑙掕壊绠$悊" name="third">瑙掕壊绠$悊</el-tab-pane>
+          <el-tab-pane label="瀹氭椂浠诲姟琛ュ伩" name="fourth">瀹氭椂浠诲姟琛ュ伩</el-tab-pane>
+        </el-tabs>
+        <el-drawer
+          title="缂栬緫"
+          :append-to-body="true"
+          :visible.sync="editDrawer"
+        >
+          <p>_(:蟹銈濃垹)_</p>
+        </el-drawer>
+      </div>
+    </el-drawer>
   </div>
 </template>
 
 <script>
+import { getClassifyList, getInstrumentList } from '@/api/laboratory/ledger'
 export default {
   data() {
     return {
       // 琛ㄦ牸鏁版嵁
-      data: [{
+      classTree: [{
         id: 1,
         label: '涓�绾� 1',
         children: [{
@@ -412,18 +499,64 @@
         whetherDataAcquisition: '' // 鏄惁鏀寔鏁伴噰
       },
       timer: null,
-      formLabelWidth: '80'
+      formLabelWidth: '80',
+      detailDrawer: false,
+      editDrawer: false,
+      equipmentTable: [],
+      currentPage: 1,
+      pageSize: 10,
+      total: 0
     }
   },
   watch: {
     filterText(val) {
-      this.$refs.tree.filter(val)
+      this.$refs.classTree.filter(val)
     }
   },
+  created() {
+    this.getThreeData()
+  },
   methods: {
+    openDetail(row) {
+      console.log(row)
+      this.detailDrawer = true
+    },
+    nodeClickHandler(data, node, element) {
+      console.log(data)
+      // 鍙湁鏁版嵁涓惡甯d鎵嶈兘鍙戦�佹煡璇㈣姹�
+      if (data.id) {
+        this.getEquipmentTable({ classifyId: data.id, pageSize: this.pageSize, pageNo: this.currentPage })
+      }
+    },
+    async getEquipmentTable(ages) {
+      console.log('鏉′欢瀵硅薄', ages)
+      const { data } = await getInstrumentList(ages)
+      console.log(data)
+      this.equipmentTable = data.row
+      this.total = data.total
+    },
     filterNode(value, data) {
       if (!value) return true
       return data.label.indexOf(value) !== -1
+    },
+    async getThreeData() {
+      const { data } = await getClassifyList()
+      console.log(data)
+      this.classTree = data.map(item => {
+        if (item.children) {
+          item.children = item.children.map(childrenItem => {
+            return { ...childrenItem, label: childrenItem.son_name }
+          })
+        }
+        return { ...item, label: item.father_name }
+      })
+      console.log(this.classTree)
+    },
+    handleSizeChange() {
+      // 褰撳墠椤靛ぇ灏�
+    },
+    handleCurrentChange() {
+      // 褰撳墠椤垫洿鏀�
     }
   },
   handleClose(done) {
@@ -599,5 +732,102 @@
       }
     }
   }
+
+  .detailDrawer{
+    ::v-deep .el-drawer__body{
+      padding: 24px !important;
+    }
+    .detail-info{
+    background: #fff;
+      box-shadow: rgba(100, 100, 111, 0.2) 0px 5px 15px;
+
+    // padding: 10px 20px 10px 20px;
+    margin: 0;
+    margin-bottom: 12px;
+    border-radius: 6px;
+    overflow: hidden;
+    .tips-main{
+      // margin: ;
+      padding: 10px 20px 0 20px;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      height: 50px;
+      // height: ;
+      &:hover{
+        background: #85bff810;
+        .tips-btn{
+          display: block;
+          left: 0;
+          opacity:1;
+        }
+      }
+      .tips-btn{
+        height: 100%;
+        // display: none;
+        position: relative;
+        opacity:0;
+        left: 100px;
+        transition: all 0.3s ease-in-out;
+      }
+      .tips{
+      height: 100%;
+      display: flex;
+      height: 24px;
+      align-items: center;
+      font-size: 16px;
+      // margin-bottom: 12px;
+      >span{
+        display: inline-block;
+        margin-right: 10px;
+        width: 4px;
+        height: 16px;
+        background: #0077DB;
+      }
+      >div{
+        height: 100%;
+        line-height: 26px;
+      }
+      .el-button{
+        padding: 0;
+      }
+      }
+    }
+
+    // 鍩烘湰淇℃伅鍜屼紒涓氫俊鎭殑姣忎竴涓俊鎭」鏍峰紡
+    .message{
+      padding: 0px 20px 8px 20px;
+
+      display: flex;
+      flex-wrap: wrap;
+      border-top: 1px solid #F2F6FC;
+      // border-top: 1px solid #F2F6FC;
+      >div{
+        flex: 30%;
+        max-width: 30%;
+        padding: 8px;
+        color: #606266;
+        align-items: center;
+        // height: 65px;
+        font-size: 12px;
+        height: 40px;
+        display: flex;
+        align-items: center;
+        >span{
+          color: #303133;
+          font-size: 14px;
+          //
+          >i{
+            margin-right: 8px;
+          }
+        }
+      }
+      // >div:nth-child(5){
+      //   flex: 60%;
+      //   max-width: 60%;
+      // }
+    }
+  }
+  }
 }
 </style>

--
Gitblit v1.9.3