From 0e6e977471922c1abc7a898c07dd04befc4c5d00 Mon Sep 17 00:00:00 2001
From: xy <271556543@qq.com>
Date: Thu, 7 Nov 2024 17:43:28 +0800
Subject: [PATCH] 1

---
 .env.production                               |   4 +-
 .env.staging                                  |   4 +-
 src/App.vue                                   |   5 +
 src/components/OnlineFile/index.vue           |  54 +++++
 src/layout/components/Navbar/index.vue        |   4 +-
 src/main.js                                   |   3 +
 src/permission.js                             |   4 +-
 src/store/modules/permission.js               |   2 +-
 src/styles/navbar.css                         | 187 ++++++++++++++++++
 src/styles/navbar.css.map                     |   1 +
 src/views/dashboard/index.vue                 |   3 +
 .../DashboardComponents/AddressBook.vue       |  61 +++---
 .../system/DashboardComponents/articles.vue   |  90 ++++++---
 src/views/wujie/index.vue                     |  16 +-
 14 files changed, 373 insertions(+), 65 deletions(-)
 create mode 100644 src/components/OnlineFile/index.vue
 create mode 100644 src/styles/navbar.css
 create mode 100644 src/styles/navbar.css.map

diff --git a/.env.production b/.env.production
index 5add05e..537ed91 100644
--- a/.env.production
+++ b/.env.production
@@ -2,7 +2,7 @@
 ENV = 'production'
 
 # base api
-VUE_APP_BASE_API='https://cz-hjjc.115.langye.net'
-VUE_APP_UPLOAD_API='https://cz-hjjc.115.langye.net/api/upload-file'
+VUE_APP_BASE_API='http://192.168.16.110:8080'
+VUE_APP_UPLOAD_API='http://192.168.16.110:8080/api/upload-file'
 VUE_APP_PREVIEW=//view.langye.net/preview/onlinePreview
 
diff --git a/.env.staging b/.env.staging
index 4ef2cb7..e2b8f38 100644
--- a/.env.staging
+++ b/.env.staging
@@ -4,6 +4,6 @@ NODE_ENV = production
 ENV = 'staging'
 
 # base api
-VUE_APP_BASE_API='http://cz-hjjc.115.langye.net'
-VUE_APP_UPLOAD_API='http://cz-hjjc.115.langye.net/api/admin/upload-file'
+VUE_APP_BASE_API='https://cz-hjjc.115.langye.net'
+VUE_APP_UPLOAD_API='https://cz-hjjc.115.langye.net/api/upload-file'
 VUE_APP_PREVIEW=//view.langye.net/preview/onlinePreview
diff --git a/src/App.vue b/src/App.vue
index ec9032c..1dc8e21 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,11 +1,16 @@
 <template>
   <div id="app">
     <router-view />
+    <OnlineFile></OnlineFile>
   </div>
 </template>
 
 <script>
+import OnlineFile from '@/components/OnlineFile'
 export default {
+  components: {
+    OnlineFile
+  },
   name: 'App'
 }
 </script>
diff --git a/src/components/OnlineFile/index.vue b/src/components/OnlineFile/index.vue
new file mode 100644
index 0000000..6044c74
--- /dev/null
+++ b/src/components/OnlineFile/index.vue
@@ -0,0 +1,54 @@
+<template>
+  <div>
+    <vxe-modal
+      v-model="showModal"
+      :width="840"
+      :height="600"
+      show-zoom
+      :fullscreen="$store.getters.device === 'mobile'"
+      :z-index="zIndex"
+      :footer-hide="true"
+      title="预览"
+    >
+      <template>
+        <iframe
+          style="width: 100%; height: 100%;"
+          :src="codeUri"
+          frameborder="0"
+        />
+      </template>
+    </vxe-modal>
+  </div>
+</template>
+
+<script>
+import { PopupManager } from 'element-ui/lib/utils/popup'
+
+export default {
+  data() {
+    return {
+      zIndex: PopupManager.nextZIndex(),
+      showModal: false,
+      codeUri: ''
+    }
+  },
+  computed: {},
+  created() {
+    this.$bus.$on('online-file', (url) => this.open(url))
+  },
+  beforeDestroy() {
+    this.$bus.$off('online-file')
+  },
+  methods: {
+    open(url) {
+      this.codeUri = `${process.env.VUE_APP_PREVIEW}?url=${encodeURIComponent(
+        new Buffer(url).toString('base64')
+      )}`
+      this.showModal = true
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+</style>
diff --git a/src/layout/components/Navbar/index.vue b/src/layout/components/Navbar/index.vue
index fb9a428..6c8a471 100644
--- a/src/layout/components/Navbar/index.vue
+++ b/src/layout/components/Navbar/index.vue
@@ -179,7 +179,7 @@ export default {
   methods: {
     toggleIframeSidebarOpened() {
       const iframe = document.querySelector('#iframe-cpn')
-      if (iframe && document.querySelector('.sidebar-container')) {
+      if (iframe && !document.querySelector('.sidebar-container')) {
         iframe.contentWindow.toggleSideBar()
         this.isIframeSidebarOpened = Cookies.get('sidebarStatus') ? !!+Cookies.get('sidebarStatus') : true
       } else {
@@ -217,6 +217,6 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-@import url('~@/styles/navbar.scss');
+@import url('~@/styles/navbar.css');
 
 </style>
diff --git a/src/main.js b/src/main.js
index 4995a42..2a8db32 100644
--- a/src/main.js
+++ b/src/main.js
@@ -76,5 +76,8 @@ new Vue({
   el: '#app',
   router,
   store,
+  beforeCreate() {
+    Vue.prototype.$bus = this
+  },
   render: (h) => h(App)
 })
diff --git a/src/permission.js b/src/permission.js
index dd8d4e8..9c7e13d 100644
--- a/src/permission.js
+++ b/src/permission.js
@@ -28,8 +28,8 @@ router.beforeEach(async(to, from, next) => {
       NProgress.done()
     } else {
       if (to.meta.isModule) {
-        store.commit('modules/SET_MODULE_NAME',to.meta.moduleName)
-        store.commit('modules/SET_MODULE_URI',to.meta.moduleUri)
+        store.commit('modules/SET_MODULE_NAME', to.meta.moduleName)
+        store.commit('modules/SET_MODULE_URI', to.meta.moduleUri)
       }
 
       if (store.state.permission.addRoutes && store.state.permission.addRoutes instanceof Array && store.state.permission.addRoutes.length > 0) {
diff --git a/src/store/modules/permission.js b/src/store/modules/permission.js
index bc848e1..23a76cd 100644
--- a/src/store/modules/permission.js
+++ b/src/store/modules/permission.js
@@ -43,7 +43,7 @@ export function filterAsyncRoutes(routes) {
         // TODO:修改地址
         // moduleUri: /^\/./.test(route.path) ? '' : `https://cz-hjjc.115.langye.net/${route.path}`,
         moduleUri: /^\/./.test(route.path) ? '' : `/${route.path}`,
-        moduleName: /^\/./.test(route.path) ? '' : route.path,
+        moduleName: /^\/./.test(route.path) ? '' : route.path
       }
     }
 
diff --git a/src/styles/navbar.css b/src/styles/navbar.css
new file mode 100644
index 0000000..f2b34e3
--- /dev/null
+++ b/src/styles/navbar.css
@@ -0,0 +1,187 @@
+.d-flex {
+  display: flex;
+}
+
+.navbar {
+  background: var(--theme-color);
+}
+.navbar .cursor-pointer {
+  cursor: pointer;
+}
+.navbar .container {
+  height: 54px;
+  display: flex;
+  align-items: center;
+  padding: 0 40px;
+}
+.navbar .container .modules__toggler {
+  display: none;
+}
+.navbar .container .navbar-brand {
+  display: flex;
+  align-items: center;
+  margin-right: 20px;
+}
+.navbar .container .navbar-brand .navbar-brand__img {
+  height: 20px;
+  margin-left: 10px;
+}
+.navbar .container .navbar-brand .navbar-brand__logo {
+  height: 20px;
+}
+.navbar .container .toggle-sidebar {
+  font-size: 18px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  color: #fff;
+  margin-right: 10px;
+}
+.navbar .container .navbar-module {
+  flex: 1;
+  overflow-y: hidden;
+}
+.navbar .container .navbar-module .modules__toggler {
+  color: #fff;
+}
+.navbar .container .navbar-module #navbar-menu {
+  overflow-x: scroll;
+}
+.navbar .container .navbar-module #navbar-menu::-webkit-scrollbar {
+  background-color: transparent;
+  height: 0;
+  width: 0;
+}
+.navbar .container .navbar-nav {
+  display: flex;
+  margin-right: auto;
+}
+.navbar .container .navbar-nav .tool {
+  display: flex;
+  align-items: center;
+}
+.navbar .container .navbar-nav .tool .el-color-picker {
+  height: auto;
+}
+.navbar .container .navbar-nav .tool .tool-item {
+  color: #fff;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  -webkit-box-pack: center;
+}
+.navbar .container .navbar-nav .tool .tool-item .el-badge__content:not(.is-dot) {
+  line-height: 14px;
+  height: 14px;
+  padding: 0 5px;
+  border-radius: 8px;
+  box-sizing: content-box;
+}
+.navbar .container .navbar-nav .tool .tool-item + .tool-item {
+  margin-left: 10px;
+}
+.navbar .container .navbar-nav .nav-info {
+  display: flex;
+  color: #fff;
+  margin-left: 30px;
+}
+.navbar .container .navbar-nav .nav-info > div {
+  padding-left: 8px;
+}
+.navbar .container .navbar-nav .nav-info .avatar {
+  height: 32px;
+  width: 32px;
+  border-radius: 4px;
+}
+.navbar .container .navbar-nav .nav-info .department {
+  color: #eeeeee;
+  font-size: 85%;
+  margin-top: 4px;
+}
+
+@media (max-width: 1200px) {
+  .navbar .container {
+    padding: 0 20px;
+  }
+
+  #navbar-menu .sidebar-item .sub-el-icon {
+    display: none;
+  }
+}
+@media (max-width: 992px) {
+  .navbar .container {
+    padding: 0 10px;
+  }
+
+  #navbar-menu .sidebar-item .el-menu-item span, #navbar-menu .sidebar-item .el-submenu__title span {
+    display: none;
+  }
+  #navbar-menu .sidebar-item .sub-el-icon {
+    display: initial;
+    margin-right: 0;
+  }
+}
+@media (max-width: 768px) {
+  .navbar .modules__toggler {
+    display: initial !important;
+  }
+  .navbar .navbar-brand .navbar-brand__img {
+    display: none;
+  }
+  .navbar .navbar-module #navbar-menu {
+    display: none;
+  }
+  .navbar .nav-info > div {
+    display: none;
+  }
+}
+#navbar-menu .sidebar-item {
+  display: inline-block;
+}
+#navbar-menu .sidebar-item .el-menu-item:hover, #navbar-menu .sidebar-item .el-submenu__title:hover {
+  color: #fff !important;
+  background-color: transparent !important;
+}
+#navbar-menu .el-menu-item, #navbar-menu .el-submenu__title {
+  height: 54px;
+  line-height: 54px;
+}
+#navbar-menu .el-submenu__icon-arrow {
+  display: none;
+}
+
+.navbar .el-menu--horizontal {
+  border-bottom: none !important;
+  overflow: hidden;
+  white-space: nowrap;
+}
+
+#navbar-menu-mobile {
+  position: absolute;
+  left: 0;
+  right: 0;
+  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.2);
+}
+#navbar-menu-mobile .el-menu {
+  border-right: none;
+}
+#navbar-menu-mobile .el-menu .el-menu-item, #navbar-menu-mobile .el-menu .el-submenu__title {
+  height: auto;
+  line-height: inherit;
+  min-height: 2rem;
+  display: flex;
+  align-items: center;
+}
+#navbar-menu-mobile .el-menu .el-submenu.is-active .el-submenu__title {
+  border-bottom: 0;
+  color: var(--theme-color);
+}
+#navbar-menu-mobile .el-menu {
+  background-color: #fff !important;
+}
+#navbar-menu-mobile .sidebar-item .el-menu-item, #navbar-menu-mobile .sidebar-item .el-submenu__title {
+  color: #333 !important;
+  background-color: #fff !important;
+}
+
+/*# sourceMappingURL=navbar.css.map */
diff --git a/src/styles/navbar.css.map b/src/styles/navbar.css.map
new file mode 100644
index 0000000..6e7c8b7
--- /dev/null
+++ b/src/styles/navbar.css.map
@@ -0,0 +1 @@
+{"version":3,"sourceRoot":"","sources":["navbar.scss"],"names":[],"mappings":"AAAA;EACE;;;AAEF;EACE;;AACA;EACE;;AAEF;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAEF;EACE;EACA;EACA;;AAEA;EACE;EACA;;AAEF;EACE;;AAGJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;;AAEA;EACE;;AAEF;EACE;;AAEA;EACE;EACA;EACA;;AAIN;EACE;EACA;;AAEA;EACE;EACA;;AAEA;EACE;;AAEF;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGJ;EACE;;AAGJ;EACE;EACA;EACA;;AAEA;EACE;;AAEF;EACE;EACA;EACA;;AAEF;EACE;EACA;EACA;;;AAMV;EAEI;IACE;;;EAKA;IACE;;;AAKR;EAEI;IACE;;;EAKA;IACE;;EAEF;IACE;IACA;;;AAKR;EAEI;IACE;;EAGA;IACE;;EAIF;IACE;;EAIF;IACE;;;AAON;EACE;;AAEA;EACE;EACA;;AAGJ;EACE;EACA;;AAEF;EACE;;;AAIF;EACE;EACA;EACA;;;AAGJ;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;;AAGJ;EACE;;AAIA;EACE;EACA","file":"navbar.css"}
\ No newline at end of file
diff --git a/src/views/dashboard/index.vue b/src/views/dashboard/index.vue
index f09e249..d10c013 100644
--- a/src/views/dashboard/index.vue
+++ b/src/views/dashboard/index.vue
@@ -90,5 +90,8 @@ export default {
     transform: none !important;
     margin-bottom: 10px;
   }
+  #grid-card {
+    overflow-y: scroll;
+  }
 }
 </style>
diff --git a/src/views/system/DashboardComponents/AddressBook.vue b/src/views/system/DashboardComponents/AddressBook.vue
index 1913d99..59f6e85 100644
--- a/src/views/system/DashboardComponents/AddressBook.vue
+++ b/src/views/system/DashboardComponents/AddressBook.vue
@@ -20,24 +20,40 @@
     </div>
 
     <div class="body" :style="{ 'height': tableHeight + 'px' }">
-      <ul>
-        <li v-for="item in lists" :key="item.id">
-          <div class="top">
-            <span>{{ item.name }}</span>
-            <el-tag v-if="item.department" style="margin-left: 6px;" effect="dark" size="small" type="primary">{{ item.department.name }}</el-tag>
-          </div>
-          <div v-if="item.mobile" class="bottom" @click="copy2(item.mobile)">
-            <i class="el-icon-phone" />
-            <span style="color: var(--theme-color)">{{ item.mobile }}</span>
-          </div>
-        </li>
-      </ul>
+      <el-table
+        v-loading="loading"
+        style="width: 100%;"
+        size="mini"
+        :header-cell-style="{
+          'font-weight': '600',
+          'background': '#f8f8f9',
+          'color': '#515a6e'
+        }"
+        element-loading-text="拼命加载中"
+        element-loading-spinner="el-icon-loading"
+        element-loading-background="rgba(255, 255, 255, 0.8)"
+        :height="tableHeight"
+        :loading="loading"
+        :data="lists"
+      >
+        <el-table-column type="index" width="46" align="center" />
+        <el-table-column label="姓名" width="80" prop="name" align="center" />
+        <el-table-column label="部门" min-width="140" prop="department.name" align="center" />
+        <el-table-column width="140" prop="mobile" label="手机号" align="center">
+          <template #default="{ row }">
+            <div v-if="row.mobile" style="cursor: pointer;" @click="copy2(row.mobile)">
+              <i class="el-icon-phone" />
+              <span style="color: var(--theme-color)">{{ row.mobile }}</span>
+            </div>
+          </template>
+        </el-table-column>
+      </el-table>
     </div>
   </el-card>
 </template>
 
 <script>
-import { copy2, debounce } from '@/utils'
+import { copy2 } from '@/utils'
 import { index } from '@/api/user'
 import SvgIcon from '@/components/SvgIcon/index.vue'
 import ElementResize from 'element-resize-detector'
@@ -56,6 +72,7 @@ export default {
   },
   data() {
     return {
+      loading: false,
       keyword: '',
       users: [],
       lists: [],
@@ -72,13 +89,16 @@ export default {
   methods: {
     async getUsers() {
       try {
+        this.loading = true
         const res = await index({
           page: 1,
           rows: 999
         })
         this.users = res.data
         this.lists = res.data
+        this.loading = false
       } catch (err) {
+        this.loading = false
         console.error(err)
       }
     },
@@ -104,7 +124,7 @@ export default {
     },
     init() {
       const cardDom = document.getElementById('address-book')
-      const cardTitleH = 60
+      const cardTitleH = 61
       const elementResize = ElementResize({
         strategy: 'scroll'
       })
@@ -123,19 +143,6 @@ export default {
 .body {
   overflow: scroll;
 
-  &::-webkit-scrollbar-track-piece {
-    background: #d3dce6;
-  }
-
-  &::-webkit-scrollbar {
-    width: 4px;
-  }
-
-  &::-webkit-scrollbar-thumb {
-    background: #99a9bf;
-    border-radius: 20px;
-  }
-
   ul {
     list-style: none;
     padding-left: 0;
diff --git a/src/views/system/DashboardComponents/articles.vue b/src/views/system/DashboardComponents/articles.vue
index 2e6f8b8..484a5c3 100644
--- a/src/views/system/DashboardComponents/articles.vue
+++ b/src/views/system/DashboardComponents/articles.vue
@@ -8,14 +8,56 @@
     </div>
 
     <div class="body" :style="{ 'height': tableHeight + 'px' }">
-      <ul>
-        <li v-for="item in article" :key="item.id">
-          <div class="top">
-            <div>{{ item.title }}</div>
-            <p style="color: #666;font-size: 13px;">{{ item.sub_title }}</p>
-          </div>
-        </li>
-      </ul>
+      <el-table
+        v-loading="loading"
+        style="width: 100%;"
+        size="mini"
+        :header-cell-style="{
+          'font-weight': '600',
+          'background': '#f8f8f9',
+          'color': '#515a6e'
+        }"
+        element-loading-text="拼命加载中"
+        element-loading-spinner="el-icon-loading"
+        element-loading-background="rgba(255, 255, 255, 0.8)"
+        :height="tableHeight"
+        :loading="loading"
+        :data="article"
+      >
+        <el-table-column type="index" width="46" align="center" />
+        <el-table-column prop="title" width="160" align="left" header-align="center" label="标题" />
+        <el-table-column prop="article_type.name" width="140" align="center" label="类别" />
+        <el-table-column prop="sub_title" min-width="160" show-overflow-tooltip header-align="center" align="left" label="简介" />
+        <el-table-column prop="content" min-width="160" show-overflow-tooltip header-align="center" align="left" label="内容" />
+        <el-table-column min-width="140" label="附件" header-align="center">
+          <template #default="{ row }">
+            <div v-for="file in row.files" :key="file.id">
+              <el-link type="primary" @click="$bus.$emit('online-file', file.url)">{{ file.original_name	}}</el-link>
+            </div>
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <div style="display: flex;justify-content: center;">
+        <el-pagination
+          style="margin-top: 10px;"
+          :current-page="select.page"
+          :page-sizes="[20, 30, 40, 50]"
+          :page-size="select.page_size"
+          hide-on-single-page
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="total"
+          @size-change="e => {
+            select.page_size = e;
+            select.page = 1;
+            getArticles();
+          }"
+          @current-change="e => {
+            select.page = e;
+            getArticles();
+          }"
+        />
+      </div>
     </div>
   </el-card>
 </template>
@@ -39,8 +81,16 @@ export default {
   },
   data() {
     return {
+      loading: false,
       article: [],
-      tableHeight: 200
+      tableHeight: 200,
+      total: 0,
+
+      select: {
+        page: 1,
+        page_size: 20,
+        'show_relation[]': 'article_type'
+      }
     }
   },
   computed: {},
@@ -53,14 +103,15 @@ export default {
   methods: {
     async getArticles() {
       try {
-        const res = await index({
-          page: 1,
-          page_size: 999
-        })
+        this.loading = true
+        const res = await index(this.select)
         this.article = res.data
         this.lists = res.data
+        this.total = res.total
+        this.loading = false
       } catch (err) {
         console.error(err)
+        this.loading = false
       }
     },
     init() {
@@ -84,19 +135,6 @@ export default {
 .body {
   overflow: scroll;
 
-  &::-webkit-scrollbar-track-piece {
-    background: #d3dce6;
-  }
-
-  &::-webkit-scrollbar {
-    width: 4px;
-  }
-
-  &::-webkit-scrollbar-thumb {
-    background: #99a9bf;
-    border-radius: 20px;
-  }
-
   ul {
     list-style: none;
     padding-left: 0;
diff --git a/src/views/wujie/index.vue b/src/views/wujie/index.vue
index 437bacc..2e126f8 100644
--- a/src/views/wujie/index.vue
+++ b/src/views/wujie/index.vue
@@ -57,7 +57,13 @@ export default {
         // this.isLoading = true
         this.props.module_name = this.module_name
         this.props.auth_token = getToken()
-        this.auth_uri = `${newVal}/#/?auth_token=${window.encodeURIComponent(getToken())}&module_name=${this.module_name}&theme=${window.encodeURIComponent(Cookies.get('defaultTheme'))}`
+        const query = {
+          auth_token: window.encodeURIComponent(getToken()),
+          module_name: this.module_name,
+          theme: window.encodeURIComponent(Cookies.get('defaultTheme')),
+          ...this.$route.query
+        }
+        this.auth_uri = `${newVal}/#/?${this.obj2Query(query)}`
         // this.$nextTick(() => {
         //   this.$refs['program'].onload = this.postMessage
         //   console.log(loadedModels)
@@ -77,8 +83,7 @@ export default {
   created() {
 
   },
-  mounted() {
-  },
+  mounted() {},
   beforeDestroy() {
     this.$refs['program'].onload = null
   },
@@ -87,6 +92,11 @@ export default {
       if (this.props.auth_token && this.props.module_name) {
         this.$refs['program'].contentWindow.postMessage(this.props)
       }
+    },
+    obj2Query(obj) {
+      return Object.keys(obj)
+        .map(key => encodeURIComponent(key) + '=' + encodeURIComponent(obj[key]))
+        .join('&')
     }
   }
 }