From 190a64d69ad5d96781a61f70aaa9c7e1d42cf893 Mon Sep 17 00:00:00 2001
From: hailin <1356886193@qq.com>
Date: 星期五, 14 七月 2023 08:57:11 +0800
Subject: [PATCH] 提交logo同时提交标准库详情页

---
 src/views/standardLibrary/index.vue                |   76 +++++----
 src/views/standardLibrary/SpecificationDetails.vue |  351 +++++++++++++++++++++++++++++++++++++++++++
 src/router/index.js                                |    7 
 src/assets/404_images/logoHide.png                 |    0 
 4 files changed, 400 insertions(+), 34 deletions(-)

diff --git a/src/assets/404_images/logoHide.png b/src/assets/404_images/logoHide.png
new file mode 100644
index 0000000..db548cd
--- /dev/null
+++ b/src/assets/404_images/logoHide.png
Binary files differ
diff --git a/src/router/index.js b/src/router/index.js
index c6a2b93..2f584ea 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -55,12 +55,19 @@
   {
     path: '/standardLibrary',
     component: Layout,
+    meta: { title: '鏍囧噯搴�', icon: 'el-icon-s-help' },
     children: [
       {
         path: 'index',
         name: 'StandardLibrary',
         component: () => import('@/views/standardLibrary/index'),
         meta: { title: '鏍囧噯搴�', icon: 'form' }
+      },
+      {
+        path: 'specificationDetails',
+        name: 'SpecificationDetails',
+        component: () => import('@/views/standardLibrary/SpecificationDetails'),
+        meta: { title: '鏍囧噯搴撹鎯�', icon: 'form' }
       }
     ]
   },
diff --git a/src/views/standardLibrary/SpecificationDetails.vue b/src/views/standardLibrary/SpecificationDetails.vue
new file mode 100644
index 0000000..46310fc
--- /dev/null
+++ b/src/views/standardLibrary/SpecificationDetails.vue
@@ -0,0 +1,351 @@
+<template>
+  <div class="specificationDetail-main">
+    <div class="page-header-tips">
+      <div class="search-bar">
+        <span :style="{marginRight:'12px', color:'#409EFF'}"> 浜у搧鍚嶇О锛氶挗鍖呴挗蹇冮摑缁炵嚎</span>
+        <el-tag type="primary"><i class="el-icon-info" :style="{marginRight:'4px', color:'#409EFF'}" />V12</el-tag>
+      </div>
+      <div class="serve-btn">
+        <el-button type="primary" icon="el-icon-plus">缂栬緫</el-button>
+        <el-button type="primary" icon="el-icon-plus">鍒犻櫎</el-button>
+      </div>
+    </div>
+    <div class="content-main">
+      <div class="specificationDetail-bom">
+        <div class="bom-item">
+          <div class="bom-item-search">
+            <el-row>
+              <el-col :span="19">
+                <el-input
+                  v-model="filterText"
+                  placeholder="杈撳叆鍏抽敭瀛楄繘琛岃繃婊�"
+                />
+              </el-col>
+              <el-col :span="5">
+                <el-button type="primary" size="small"><i class="el-icon-plus" /></el-button>
+              </el-col>
+            </el-row>
+          </div>
+          <el-tree
+            ref="tree"
+            class="filter-tree"
+            :data="data"
+            :props="defaultProps"
+            default-expand-all
+            :filter-node-method="filterNode"
+          />
+        </div>
+        <div class="bom-item">
+          <div class="bom-item-search">
+            <el-row>
+              <el-col :span="19">
+                <div class="tips">
+                  <span />
+                  <div>椤圭洰/瀛愰」鐩�</div>
+                </div>
+              </el-col>
+              <el-col :span="5">
+                <el-button type="primary" size="small" plain><i class="el-icon-plus" /></el-button>
+              </el-col>
+            </el-row>
+          </div>
+          <el-tree
+            ref="tree"
+            class="filter-tree"
+            :data="item"
+            :props="defaultProps"
+            default-expand-all
+            :filter-node-method="filterNode"
+          />
+        </div>
+      </div>
+      <div class="specificationDetail-card">
+        <div class="card-main">
+          <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">缂栬緫</el-button>
+            </div>
+          </div>
+          <div class="message">
+            <div class="message-item"><span><i class="el-icon-edit" />鐢ㄦ埛鍚嶏細</span>121212121212</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'}"/>{{ 'jack' }}</el-tag>
+            </div>
+            <div class="message-item">
+              <span><i class="el-icon-edit" />鐢佃瘽鍙风爜锛�</span>
+              19825217196</div>
+            <div class="message-item">
+              <span><i class="el-icon-edit" />閭锛�</span>
+              1212112</div>
+          </div>
+        </div>
+        <div class="card-main">
+          <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">缂栬緫</el-button>
+            </div>
+          </div>
+          <div class="message">
+            <div class="message-item">
+              <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" />鎷涙爣浜哄憳瑕佹眰锛氾紲3444</span>
+            </div>
+            <div class="message-item">
+              <span><i class="el-icon-edit" />鍐呮帶鍊硷細锛�3444</span>
+              1212112</div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'SpecificationDetail',
+  data() {
+    return {
+    // 榛樿鍊�
+      defaultProps: {
+        children: 'children',
+        label: 'label'
+      },
+      // 鏍囧噯璇︽儏鍒嗙被
+      data: [
+        {
+          id: 1,
+          label: '涓�绾� 1'
+        },
+        {
+          id: 2,
+          label: '涓�绾� 1'
+        },
+        {
+          id: 3,
+          label: '涓�绾� 1'
+        },
+        {
+          id: 4,
+          label: '涓�绾� 1'
+        }
+      ],
+      item: [{
+        id: 1,
+        label: '涓�绾� 1',
+        children: [{
+          id: 4,
+          label: '浜岀骇 1-1',
+          children: [{
+            id: 9,
+            label: '涓夌骇 1-1-1'
+          }, {
+            id: 10,
+            label: '涓夌骇 1-1-2'
+          }]
+        }]
+      }],
+      searchData: {
+        keyword: ''
+      }
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+ .specificationDetail-main{
+      // 椤甸潰澶撮儴鏉′欢鎼滅储
+  .page-header-tips{
+    background: #fff;
+    display: flex;
+    justify-content: space-between;
+    padding: 0 24px 12px 24px;
+     .search-bar{
+      .el-radio-button.is-active{
+        color: #409EFF !important;
+        background: #ecf5ff !important;
+        border-color: #b3d8ff !important;
+      }
+      >span{
+        font-size: 20px;
+      }
+    }
+  }
+    // 椤甸潰涓績鍐呭鍖哄煙
+    .content-main{
+        display: flex;
+        height: 100%;
+        min-height: calc(100vh - 88px);
+        // .specificationDetail-bom,.specificationDetail-card{
+        //     padding: 20px;
+        //     background: #fff;
+        // }
+        .specificationDetail-bom{
+            flex: 50%;
+            margin-right: 12px;
+            display: flex;
+                >div:nth-child(1){
+                   flex: 43%;
+
+                    margin-right: 12px;
+                    padding: 20px;
+                    background: #fff;
+                }
+                >div:nth-child(2){
+                    flex: 57%;
+
+                    margin-left: 12px;
+                    background: #fff;
+                    padding: 20px;
+
+                }
+            .bom-item{
+                flex: 50%;
+                .bom-item-search{
+                    margin-bottom: 12px;
+                    ::v-deep .el-input{
+                        input{
+                            height: 33px;
+                            line-height: 33px;
+                        }
+                    }
+                    .tips{
+                        height: 33px !important;
+                        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: 36px;
+                        }
+                        .el-button{
+                            padding: 0;
+                        }
+                        }
+                }
+                .bom-item-search .el-row{
+                    // display: flex;
+                    .el-col{
+                        text-align: right;
+                    }
+                }
+            }
+        }
+        .specificationDetail-card{
+            flex: 50%;
+            margin-left: 12px;
+            .card-main{
+            background: #fff;
+            // 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 10px 20px;
+
+            display: flex;
+            flex-wrap: wrap;
+            border-top: 1px solid #F2F6FC;
+            // border-top: 1px solid #F2F6FC;
+            >div{
+                flex: 50%;
+                max-width: 50%;
+                padding: 8px;
+                color: #606266;
+                align-items: center;
+                // height: 65px;
+                font-size: 12px;
+                height: 52px;
+                display: flex;
+                align-items: center;
+                >span{
+                color: #303133;
+                font-size: 16px;
+                //
+                >i{
+                    margin-right: 8px;
+                }
+                }
+            }
+            // >div:nth-child(5){
+            //   flex: 60%;
+            //   max-width: 60%;
+            // }
+            }
+        }
+        }
+    }
+}
+</style>
diff --git a/src/views/standardLibrary/index.vue b/src/views/standardLibrary/index.vue
index 2811310..f589079 100644
--- a/src/views/standardLibrary/index.vue
+++ b/src/views/standardLibrary/index.vue
@@ -41,65 +41,60 @@
         </div>
         <div class="table-box">
           <el-table
-            ref="personnerlTable"
-
+            ref="standardLibraryTable"
             :cell-style="{textAlign: 'center'}"
             :header-cell-style="{border:'0px',background:'#f5f7fa',color:'#606266',boxShadow: 'inset 0 1px 0 #ebeef5',textAlign: 'center'}"
-            :data="personnerlTable"
+            :data="standardLibraryTable"
             style="width: 100%"
           >
             <el-table-column
-              prop="roleName"
-              label="瑙掕壊鍚嶇О"
-              min-width="120"
+              type="index"
+              label="搴忓彿"
+              min-width="50"
             />
             <el-table-column
-              prop="rolePermissions"
-              label="瑙掕壊鏉冮檺"
-              min-width="120"
-            />
-            <el-table-column
-              prop="age"
-              label="骞撮緞"
+              prop="name"
+              label="浜у搧鍚嶇О"
               min-width="150"
             />
             <el-table-column
-              prop="creatTime"
-              label="鍒涘缓鏃堕棿"
-              min-width="180"
+              prop="username"
+              label="鏇存柊浜�"
+              min-width="100"
             />
             <el-table-column
-              prop="phone"
-              label="鐢佃瘽"
-              min-width="200"
+              prop="updateTime"
+              label="鏇存柊鏃堕棿"
+              min-width="150"
             />
             <el-table-column
-              prop="mailbox"
-              label="閭"
-              min-width="200"
+              prop="vel"
+              label="鐗堟湰"
+              min-width="100"
             />
             <el-table-column
-              prop="incumbentStatus"
-              label="鍦ㄨ亴鐘舵��"
-              min-width="120"
-              :filters="[{ text: 0, value: 0 }, { text: 1, value: 1 }]"
-              :filter-method="filterTag"
-              filter-placement="bottom-end"
+              prop="spe_state"
+              label="鐘舵��"
+              min-width="150"
             >
               <template slot-scope="scope">
                 <el-tag
-                  :type="scope.row.businessStatus === 0 ? 'primary' : 'success'"
+                  :type="scope.row.spe_state === 0 ? 'primary' : 'success'"
                   disable-transitions
-                >{{ scope.row.businessStatus === 0 ? '鏈悓鎰�' : '宸插悓鎰�' }}</el-tag>
+                >{{ scope.row.spe_state === 0 ? '鏈悓鎰�' : '宸插悓鎰�' }}</el-tag>
               </template>
             </el-table-column>
             <el-table-column
               label="鎿嶄綔"
-              min-width="120"
+              min-width="150"
             >
               <template slot-scope="scope">
-                <el-button @click="handleClick(scope.row)" type="text" size="small">缂栬緫</el-button>
-                <!-- <el-button type="text" size="small">缂栬緫</el-button> -->
+                <el-button
+                  type="text"
+                  size="small"
+                  @click="handleClick(scope.row)"
+                >鏌ョ湅</el-button>
+                <el-button type="text" size="small"><i class="el-icon-more" /></el-button>
               </template>
             </el-table-column>
           </el-table>
@@ -124,6 +119,7 @@
 export default {
   data() {
     return {
+      // 鏍囧噯搴揵om鏍�
       data: [{
         id: 1,
         label: '涓�绾� 1',
@@ -139,13 +135,25 @@
           }]
         }]
       }],
+      // 榛樿鍊�
       defaultProps: {
         children: 'children',
         label: 'label'
       },
+      // 鏌ヨ鏉′欢
       searchData: {
         keyword: ''
-      }
+      },
+      standardLibraryTable: [
+        {
+          id: 2,
+          name: 'AB',
+          updateTime: '2023-07-12 00:00:12',
+          username: '灏忓皬',
+          vel: 'V1.0',
+          spe_state: 1
+        }
+      ]
     }
   },
   watch: {

--
Gitblit v1.9.3