From d33eacc1f85ac3a736b33ba4713a19aae466d711 Mon Sep 17 00:00:00 2001
From: loulijun2021 <1694218219@qq.com>
Date: 星期五, 05 八月 2022 16:42:53 +0800
Subject: [PATCH] 1.做适应平板显示的内容大小

---
 src/views/jcsz/zzjg.vue |  135 ++++++++++++++++++++++++++++++--------------
 1 files changed, 91 insertions(+), 44 deletions(-)

diff --git a/src/views/jcsz/zzjg.vue b/src/views/jcsz/zzjg.vue
index 235f4ac..9bca1ca 100644
--- a/src/views/jcsz/zzjg.vue
+++ b/src/views/jcsz/zzjg.vue
@@ -48,7 +48,7 @@
           stripe
           :style="{width: 100+'%',height:tableHeight+'px'}"
           highlight-current-row
-          :height="tableHeight"
+          :height="tableHeight+'px'"
           :header-cell-style="this.$headerCellStyle"
           :cell-style="this.$cellStyle"
           @sort-change="sortChange"
@@ -62,52 +62,65 @@
             prop="RowNum"
             width="50"
             label="搴忓彿"
+            fixed
           />
           <el-table-column
             prop="org_code"
             label="缁勭粐缂栫爜"
             sortable="custom"
+            min-width="110"
           />
           <el-table-column
             prop="org_name"
             label="缁勭粐鍚嶇О"
             sortable="custom"
+            min-width="110"
           />
           <el-table-column
             prop="description"
             label="缁勭粐绫诲瀷"
+            width="110"
             sortable="custom"
           >
             <template slot-scope="{row}">
-              <div v-if="row.description==='F'">宸ュ巶</div>
+              <!--              <div v-if="row.description==='F'">宸ュ巶</div>-->
               <div v-if="row.description==='D'">閮ㄩ棬</div>
               <div v-if="row.description==='W'">杞﹂棿</div>
-              <div v-if="row.description==='K'">绉戝</div>
-              <div v-if="row.description==='L'">鐢熶骇绾�</div>
+              <!--              <div v-if="row.description==='K'">绉戝</div>-->
+              <!--              <div v-if="row.description==='L'">鐢熶骇绾�</div>-->
             </template>
           </el-table-column>
           <el-table-column
             prop="parentorg_name"
             label="涓婄骇鍗曚綅"
             sortable="custom"
-          />
+            min-widt="110"
+          >
+            <template slot-scope="{row}">
+              <div v-if="row.parentorg_name===null">/</div>
+              <div v-else>{{ row.parentorg_name }}</div>
+            </template>
+          </el-table-column>
           <el-table-column
             prop="lm_user"
             label="鍒涘缓浜哄憳"
+            width="110"
             sortable="custom"
           />
           <el-table-column
             prop="lm_date"
             label="鍒涘缓鏃堕棿"
-            show-overflow-tooltip
+            width="160"
             sortable="custom"
           />
           <el-table-column
+            fixed="right"
             label="鎿嶄綔"
+            width="120"
           >
             <template slot-scope="{row}">
               <div class="operationClass">
-                <el-button type="text" @click="edit('edit',row)">淇敼</el-button>
+                <el-button type="text" @click="edit('edit',row)">缂栬緫</el-button>
                 <el-button type="text" @click="del(row.id)">鍒犻櫎</el-button>
               </div>
             </template>
@@ -128,10 +141,11 @@
     </div>
 
     <el-dialog
-      :title="operation==='add'?'鏂板':'淇敼'"
+      :title="operation==='add'?'鏂板':'缂栬緫'"
       :visible.sync="dialogVisible"
-      width="50%"
+      width="800px"
       top="15vh"
+      :close-on-click-modal="false"
       @closed="handleClose"
       @close="handleClose"
     >
@@ -139,6 +153,7 @@
         <el-form-item label="缁勭粐绫诲瀷" prop="OrgType">
           <el-radio-group
             v-model="dialogForm.OrgType"
+            :disabled="operation==='edit'"
             @change="changeRadio"
           >
             <el-radio
@@ -150,15 +165,15 @@
           </el-radio-group>
         </el-form-item>
         <el-form-item label="缁勭粐缂栫爜" prop="OrgCode">
-          <el-input v-model="dialogForm.OrgCode" :disabled="operation!=='add'" style="width: 220px" />
+          <el-input v-model="dialogForm.OrgCode" :disabled="operation!=='add'" style="width: 200px" />
         </el-form-item>
         <el-form-item label="缁勭粐鍚嶇О" prop="OrgName">
-          <el-input v-model="dialogForm.OrgName" style="width: 220px" />
+          <el-input v-model="dialogForm.OrgName" style="width: 200px" />
         </el-form-item>
-        <el-form-item v-if="dialogFormOrgTypeSelected!=='F'" prop="SupUnit" label="涓婄骇鍗曚綅">
+        <el-form-item v-if="dialogForm.OrgType!=='閮ㄩ棬'" prop="SupUnit" label="涓婄骇鍗曚綅">
           <el-select
             v-model="dialogForm.SupUnit"
-            style="width: 220px"
+            style="width: 200px"
             filterable
             :popper-append-to-body="false"
             placeholder="璇烽�夋嫨"
@@ -189,7 +204,7 @@
 
 const SER_HZ = /^[\u4e00-\u9fa5]+$/
 export default {
-  name: 'Zzjg',
+  name: 'ZZJG',
   components: {
     Pagination
   },
@@ -213,8 +228,11 @@
       }
     }
     return {
+      windowHeight: 0,
+      windowWidth: 0,
       mainHeight: 0,
       tableHeight: 0,
+      numvalue: 0,
       form: {
         OrgCode: '', // 缁勭粐鏋舵瀯浠g爜
         OrgName: '', // 缁勭粐鏋舵瀯鍚嶇О
@@ -226,24 +244,23 @@
         rows: 20 // 姣忛〉澶氬皯鏉�
       },
       OrgTypeArr: [
-        { label: '宸ュ巶', value: 'F' },
+        // { label: '宸ュ巶', value: 'F' },
         { label: '閮ㄩ棬', value: 'D' },
-        { label: '杞﹂棿', value: 'W' },
-        { label: '绉戝', value: 'K' },
-        { label: '鐢熶骇绾�', value: 'L' }
+        { label: '杞﹂棿', value: 'W' }
+        // { label: '绉戝', value: 'K' },
+        // { label: '鐢熶骇绾�', value: 'L' }
       ],
 
       total: 10,
       tableData: [],
       dialogVisible: false,
       dialogForm: {
-        OrgType: '',
+        OrgType: '閮ㄩ棬',
         OrgCode: '',
         OrgName: '',
         SupUnit: ''// 涓婄骇鍗曚綅
       },
       SupUnitArr: [],
-      dialogFormOrgTypeSelected: '',
       operation: '',
       dialogFormRules: {
         OrgType: [
@@ -262,12 +279,38 @@
 
     }
   },
+  // watch: {
+  //   windowHeight(val) {
+  //     console.log('瀹炴椂灞忓箷楂樺害锛�', val, this.windowHeight)
+  //   },
+  //   windowWidth(val) {
+  //     if (val < 768) {
+  //       this.dialogWidth = '100%'
+  //     } else {
+  //       this.dialogWidth = '75%'
+  //     }
+  //     console.log('瀹炴椂灞忓箷瀹藉害锛�', val, this.windowHeight)
+  //   }
+  // },
   created() {
     this.getOrganizationSearch()
   },
   mounted() {
     window.addEventListener('resize', this.getHeight)
     this.getHeight()
+
+    // console.log('椤甸潰杩涘叆鏃剁殑瀹藉害锛�', document.body.clientWidth)
+    // if (document.body.clientWidth < 768) {
+    //   this.dialogWidth = '100%'
+    // }
+    //
+    // // <!--鎶妛indow.onresize浜嬩欢鎸傚湪鍒癿ounted鍑芥暟涓�-->
+    // window.onresize = () => {
+    //   return (() => {
+    //     this.windowHeight = document.documentElement.clientHeight// 楂�
+    //     this.windowWidth = document.documentElement.clientWidth // 瀹�
+    //   })()
+    // }
   },
   methods: {
     async getOrganizationSearch() {
@@ -302,42 +345,38 @@
     },
     // 鍗曢�夋鏀瑰彉鏃�
     async changeRadio(val) {
-      if (val.length > 1) {
-        this.OrgTypeArr.forEach(item => {
-          if (item.label === val) {
-            this.dialogFormOrgTypeSelected = item.value
-          }
-        })
-        this.dialogForm.SupUnit = ''
-      } else {
-        this.dialogFormOrgTypeSelected = val
-      }
-      if (this.dialogFormOrgTypeSelected !== 'F') {
-        const { data: res } = await PrentOrganization({ orgcode: this.dialogFormOrgTypeSelected })
+      if (this.dialogForm.OrgType !== '閮ㄩ棬') {
+        const { data: res } = await PrentOrganization({ orgcode: this.OrgTypeArr.find(item => item.label === this.dialogForm.OrgType).value })
         this.SupUnitArr = res
       }
     },
 
     // 鏂板鎸夐挳
-    add(operation) {
+    async add(operation) {
       this.operation = operation
       this.dialogVisible = true
+
+      // const res = await getNewEncodingRules(getCookie('ruleCode'))
+      // this.dialogForm.OrgCode = res.RightCode
+      // this.numvalue = res.numvalue
     },
     // 淇敼鎸夐挳
     edit(operation, row) {
       this.operation = operation
       this.dialogVisible = true
-      if (row.description === 'F') {
-        this.dialogForm.OrgType = '宸ュ巶'
-      } else if (row.description === 'D') {
+      // if (row.description === 'F') {
+      //   this.dialogForm.OrgType = '宸ュ巶'
+      // } else
+      if (row.description === 'D') {
         this.dialogForm.OrgType = '閮ㄩ棬'
       } else if (row.description === 'W') {
         this.dialogForm.OrgType = '杞﹂棿'
-      } else if (row.description === 'K') {
-        this.dialogForm.OrgType = '绉戝'
-      } else if (row.description === 'L') {
-        this.dialogForm.OrgType = '鐢熶骇绾�'
       }
+      // else if (row.description === 'K') {
+      //   this.dialogForm.OrgType = '绉戝'
+      // } else if (row.description === 'L') {
+      //   this.dialogForm.OrgType = '鐢熶骇绾�'
+      // }
       this.$nextTick(() => {
         this.changeRadio(this.dialogForm.OrgType)
         this.dialogForm.OrgCode = row.org_code
@@ -364,7 +403,7 @@
     },
     // 瀵硅瘽妗嗗叧闂簨浠�
     handleClose() {
-      this.dialogForm.OrgType = ''
+      this.dialogForm.OrgType = '閮ㄩ棬'
       this.dialogForm.OrgCode = ''
       this.dialogForm.OrgName = ''
       this.dialogForm.SupUnit = ''
@@ -379,13 +418,18 @@
       this.$refs.dialogForm.validate(valid => {
         if (valid) {
           const data = {
-            OrganType: this.dialogFormOrgTypeSelected,
+            OrganType: this.dialogForm.OrgType === '閮ㄩ棬' ? 'D' : 'W',
             OrganCode: this.dialogForm.OrgCode,
             OrganName: this.dialogForm.OrgName,
-            SupUnit: this.dialogFormOrgTypeSelected === 'F' ? '0' : this.dialogForm.SupUnit,
+            RightCode: '',
+            numvalue: '',
+            // RightCode: this.operation === 'add' ? getCookie('ruleCode') : '',
+            // numvalue: this.operation === 'add' ? this.numvalue : '',
+            SupUnit: this.dialogForm.OrgType === '閮ㄩ棬' ? '0' : this.dialogForm.SupUnit,
             OperType: this.operation === 'add' ? 'Add' : 'Update',
             Operator: getCookie('admin')
           }
+
           AddUpdateOrganization(data).then(res => {
             if (res.code === '200') {
               this.$message.success(this.operation === 'add' ? '娣诲姞鎴愬姛锛�' : '淇敼鎴愬姛锛�')
@@ -402,7 +446,10 @@
     getHeight() {
       this.$nextTick(() => {
         this.mainHeight = window.innerHeight - 250
-        this.tableHeight = this.mainHeight - 100
+        this.tableHeight = this.mainHeight - 50
+        if (window.innerHeight < 769) {
+          this.tableHeight = this.tableHeight - 50
+        }
       })
     }
   }

--
Gitblit v1.9.3