From 0d86c19b122011dc528c624597b0952660d69aba Mon Sep 17 00:00:00 2001
From: loulijun2021 <1694218219@qq.com>
Date: 星期日, 26 六月 2022 09:32:53 +0800
Subject: [PATCH] 1.优化动态路由

---
 src/views/jcsz/wldw.vue |   80 +++++++++++++++++++++++++++++++--------
 1 files changed, 63 insertions(+), 17 deletions(-)

diff --git a/src/views/jcsz/wldw.vue b/src/views/jcsz/wldw.vue
index 54529c5..269afb5 100644
--- a/src/views/jcsz/wldw.vue
+++ b/src/views/jcsz/wldw.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
-    <div class="body" style="background-color: #ffffff;  padding: 20px 10px 0 20px;" :style="{height:mainHeight+'px'}">
-      <div style="height: 50px;">
+    <div class="body" :style="{height:mainHeight+'px'}">
+      <div style="padding: 10px 5px 0 0">
         <el-form
           ref="form"
           :model="form"
@@ -9,15 +9,15 @@
           inline
           style="display: flex;justify-content: space-between"
         >
-          <div style="display: flex;justify-content: space-around;width: 85%">
+          <div class="elForm">
             <el-form-item label="鍗曚綅缂栫爜" style=" display: flex;">
-              <el-input v-model="form.CuntUnitCode" placeholder="璇疯緭鍏�" style="width: calc(100%-30px)" />
+              <el-input v-model="form.CuntUnitCode" placeholder="璇疯緭鍏�" style="width: 200px" />
             </el-form-item>
             <el-form-item label="鍗曚綅鍚嶇О" style=" display: flex;">
-              <el-input v-model="form.CuntUnitName" placeholder="璇疯緭鍏�" style="width: calc(100%-30px)" />
+              <el-input v-model="form.CuntUnitName" placeholder="璇疯緭鍏�" style="width: 200px" />
             </el-form-item>
             <el-form-item label="鍗曚綅灞炴��" style=" display: flex;">
-              <el-select v-model="form.UnitAttr" filterable style="width: calc(100%-30px)" placeholder="璇烽�夋嫨">
+              <el-select v-model="form.UnitAttr":popper-append-to-body="false" filterable style="width: 200px" placeholder="璇烽�夋嫨">
                 <el-option
                   v-for="item in UnitAttrArr"
                   :key="item.value"
@@ -27,7 +27,7 @@
               </el-select>
             </el-form-item>
             <el-form-item label="鍒涘缓浜哄憳" style=" display: flex;">
-              <el-input v-model="form.CreateUser" style="width: calc(100%-30px)" placeholder="璇疯緭鍏�" />
+              <el-input v-model="form.CreateUser" style="width: 200px" placeholder="璇疯緭鍏�" />
             </el-form-item>
           </div>
           <div style="display: flex;align-items: start;margin-top: 5px;z-index: 2">
@@ -36,15 +36,18 @@
           </div>
         </el-form>
       </div>
-      <div style="margin-bottom: 20px;display: flex">
+      <el-divider />
+      <div style="margin-left: 10px;display: flex">
         <el-button type="primary" icon="el-icon-circle-plus-outline" @click="add('add')">鏂板</el-button>
         <el-button type="primary" icon="el-icon-upload2">瀵煎叆</el-button>
       </div>
-      <!--      :style="{width: 100+'%',height:isCompatible?(tableHeight+'px'):'800px'}"-->
-      <div style="display: flex;border: 1px solid #eee">
+      <el-divider />
+      <div class="elTableDiv">
         <el-table
           :data="tableData"
           border
+          :height="tableHeight"
+          stripe
           highlight-current-row
           :header-cell-style="this.$headerCellStyle"
           :cell-style="this.$cellStyle"
@@ -139,7 +142,7 @@
             <template slot-scope="{row}">
               <div class="operationClass">
                 <el-button type="text" @click="edit('edit',row)">淇敼</el-button>
-                <el-button type="text" @click="del(row.id)">鍒犻櫎</el-button>
+                <el-button type="text" @click="del(row)">鍒犻櫎</el-button>
               </div>
             </template>
           </el-table-column>
@@ -159,7 +162,7 @@
     </div>
 
     <el-dialog
-      :title="operation==='add'?'娣诲姞':'淇敼'"
+      :title="operation==='add'?'鏂板':'淇敼'"
       :visible.sync="dialogVisible"
       width="50%"
       top="15vh"
@@ -225,7 +228,6 @@
       }
     }
     return {
-      isCompatible: false, // 鏄惁鍏煎
       mainHeight: 0,
       tableHeight: 0,
       form: {
@@ -368,13 +370,13 @@
       })
     },
     // 鍒犻櫎鎸夐挳
-    async del(id) {
+    async del(row) {
       this.$confirm('鏄惁纭鍒犻櫎?', '鎻愮ず', {
         confirmButtonText: '纭畾',
         cancelButtonText: '鍙栨秷',
         type: 'warning'
       }).then(() => {
-        DeleteCurrentUnit({ unitid: id }).then(res => {
+        DeleteCurrentUnit({ unitcode: row.code }).then(res => {
           if (res.code === '200') {
             this.$message.success('鍒犻櫎鎴愬姛!')
             this.getCurrentUnitSearch()
@@ -443,7 +445,7 @@
     // 鑾峰彇椤甸潰楂樺害
     getHeight() {
       this.$nextTick(() => {
-        this.mainHeight = window.innerHeight - 200
+        this.mainHeight = window.innerHeight - 250
         this.tableHeight = this.mainHeight - 100
       })
     }
@@ -458,17 +460,31 @@
   height: 30px;
   display: flex;
   align-items: center;
+  //border: 1px solid $main_color;
+  border: none;
+  padding: 0 20px;
 }
-
+::v-deep .el-button--primary:hover {
+  border: none;
+}
 ::v-deep .el-button--info {
   //background-color: $main_color !important;
   height: 30px;
   display: flex;
   align-items: center;
+  padding: 0 20px;
+}
+::v-deep .el-input__inner:focus {
+  border-color: $main_color;
 }
 
 ::v-deep .el-pagination.is-background .el-pager li:not(.disabled).active {
   background-color: $main_color !important;
+}
+
+::v-deep .el-dialog__footer {
+  display: flex;
+  justify-content: flex-end;
 }
 
 .footerButton {
@@ -481,6 +497,7 @@
   height: 30px;
   display: flex;
   align-items: center;
+  padding: 0 20px;
 }
 
 ::v-deep .el-button--default:hover {
@@ -569,4 +586,33 @@
 ::v-deep .el-radio.is-bordered + .el-radio.is-bordered {
   margin: 10px 30px 0px 0;
 }
+
+.body ::v-deep .el-divider {
+  border: 1px solid #eee;
+  width: 99%;
+  margin: 10px auto;
+}
+
+.body ::v-deep .el-form-item{
+  margin-bottom: 0;
+}
+
+::v-deep .el-input__inner:focus {
+  border-color: $main_color;
+}
+
+::v-deep .el-select .el-input__inner:focus{
+  border-color: $main_color;
+}
+
+::v-deep .el-select-dropdown__item.selected{
+  color: $main_color;
+}
+::v-deep .el-checkbox__inner:hover{
+  border-color: $main_color;
+}
+::v-deep .el-textarea__inner:focus{
+  border-color: $main_color;
+}
+
 </style>

--
Gitblit v1.9.3