2023-11-9

src/views/assets/house.vue

@@ -261,7 +261,7 @@
     </div>
 
     <xy-table
-      :btn-width="300"
+      :btn-width="360"
       :auths="auths_auth_mixin"
       :delay-req="true"
       :destroy-action="destroy"

src/views/dashboard/components/drawer.vue

@@ -0,0 +1,101 @@
+<template>
+  <div>
+    <el-drawer
+      size="44%"
+      title="详情"
+      :visible.sync="visible"
+      direction="rtl">
+      <el-descriptions :column="2" border direction="vertical" style="margin: 20px;">
+        <el-descriptions-item v-for="(value,key) in showRow" :label="value">
+          <template v-if="descriptionItem(key)">
+            <template v-if="isHTML(descriptionItem(key))">
+              <div v-html="descriptionItem(key)"></div>
+            </template>
+            <template v-else>
+              <div>{{ descriptionItem(key) }}</div>
+            </template>
+          </template>
+         <template v-else>
+           <div v-for="(i) in row[key]">
+             <a :download="i.url" :href="i.url" target="_blank">{{ i.original_name }}</a>
+           </div>
+         </template>
+        </el-descriptions-item>
+      </el-descriptions>
+    </el-drawer>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      type: 1,//1通知2制度文档
+      visible: false,
+      row: {},
+
+      t1: {
+        name: '名称',
+        shijian: '时间',
+        neirong: '内容',
+      },
+      t2: {
+        name: '名称',
+        created_at: '发布时间',
+        'system_catalogue_id_system_catalogues_id_relation.name': '目录',
+        'id_system_file_files_system_id_relation': '附件'
+      }
+    }
+  },
+  methods: {
+    show () {
+      this.visible = true;
+    },
+    hide () {
+      this.visible = false;
+    },
+    setRow (row) {
+      this.row = row;
+    },
+    setType (type) {
+      this.type = type
+    },
+
+    isHTML (str) {
+      const htmlRegex = /<([A-Za-z][A-Za-z0-9]*)\b[^>]*>(.*?)<\/\1>/;
+      return htmlRegex.test(str);
+    }
+  },
+  computed: {
+    showRow () {
+      return this.type === 1 ? this.t1 : this.t2;
+    },
+    descriptionItem () {
+      return function (key) {
+        if (key.includes('files')) return false;
+
+        let splits = key.split('.');
+        let value = this.row;
+        for (let i = 0;i < splits.length;i++) {
+          value = value[splits[i]]
+        }
+
+        return value;
+      }
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+a {
+  color: red;
+  text-decoration: none;
+  transition: all 0.2s;
+}
+
+a:hover {
+  color: red;
+  text-decoration: underline;
+}
+</style>

src/views/dashboard/index.vue

@@ -6,10 +6,15 @@
           <el-col :span="12">
             <div class="contract__title">
               <h3>通知</h3>
+
+              <div class="more" @click="$router.push('/notice')">
+                更多
+                <i class="el-icon-d-arrow-right"></i>
+              </div>
             </div>
 
             <div class="list">
-              <div class="list-item" v-for="item in notices">
+              <div class="list-item" v-for="item in notices" @click="$refs['drawer'].setType(1),$refs['drawer'].setRow(item),$refs['drawer'].show()">
                 <span>{{ item.name }}</span>
                 <span>{{ item.shijian }}</span>
               </div>
@@ -22,10 +27,15 @@
           <el-col :span="12">
             <div class="contract__title">
               <h3>制度文档</h3>
+
+              <div class="more" @click="$router.push('/system/documents')">
+                更多
+                <i class="el-icon-d-arrow-right"></i>
+              </div>
             </div>
 
             <div class="list">
-              <div class="list-item" v-for="item in systems">
+              <div class="list-item" v-for="item in systems" @click="$refs['drawer'].setType(2),$refs['drawer'].setRow(item),$refs['drawer'].show()">
                 <span>{{ item.name }}</span>
                 <span>{{ $moment(new Date(item.created_at)).format('YYYY-MM-DD') }}</span>
               </div>
@@ -43,6 +53,11 @@
         <div class="contract__title">
           <h3>租赁台账</h3>
 
+
+          <div class="more" @click="$router.push('/lease')">
+            更多
+            <i class="el-icon-d-arrow-right"></i>
+          </div>
         </div>
         <div class="type-bar">
           <div class="type-bar__item" :class="{ 'type-bar__item--active': radio === 0  }" @click="radioPick(0)">合约中</div>
@@ -64,12 +79,16 @@
 <!--        <xy-table :border="false" :is-page="false" :height="400" :table-item="table1" style="margin-top: 20px" size="mini" stripe ref="table1" :auths="[]" :action="index" :req-opt="select"></xy-table>-->
       </div>
     </Card>
+
+      <drawer ref="drawer"></drawer>
   </div>
 </template>
 
 <script>
   import echarts from "echarts";
-  import PanelGroup from './components/PanelGroup';
+  import PanelGroup from './components/PanelGroup'
+  import drawer from "./components/drawer.vue"
+
   import {
     getChartsHome
   } from '@/api/dashboard';
@@ -77,7 +96,8 @@
 
   export default {
     components: {
-      PanelGroup
+      PanelGroup,
+      drawer,
     },
     data() {
       return {
@@ -569,7 +589,7 @@
     &__title {
       display: flex;
       justify-content: space-between;
-      align-items: center;
+      align-items: flex-end;
 
       & > h3 {
         position: relative;
@@ -586,6 +606,20 @@
           left: -6px;
         }
       }
+
+      .more {
+        transition: all .2s;
+        cursor: pointer;
+        zoom: .9;
+
+        i {
+          zoom: .9;
+        }
+
+        &:hover {
+          color: $primaryColor;
+        }
+      }
     }
   }
 
@@ -637,6 +671,7 @@
      margin-top: 30px;
    }
    &-item {
+     cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: space-between;