Merge remote-tracking branch 'origin/master'

portal-manager-ui/admin/src/App.vue

@@ -58,6 +58,9 @@ export default {
 </script>
 
 <style lang="less" scoped>
+.app {
+  min-width: 1600px;
+}
 .export {
   background-color: rgba(0, 0, 0, 0.3);
 }

portal-manager-ui/admin/src/api/siteArrange.js

 import http from "../request/http";
-let baseURL = process.env.VUE_APP_API_BASE_URL
+let baseURL = process.env.VUE_APP_API_BASE_URL;
 // 1.16.1. 查询站点编排列表
 export function appsListInterface(params) {
-  return http.post(`${baseURL}/zwfw/site/model/list`, params);
+  return http.post(`${baseURL}/zwfw/site/model/list/group`, params);
+}
+// 获取收藏
+export function getCollect(params) {
+  return http.post(`${baseURL}/zwfw/user/model/collect/get`, params);
+}
+// 保存收藏
+export function saveCollect(params) {
+  return http.post(`${baseURL}/zwfw/user/model/collect/save`, params);
 }

portal-manager-ui/admin/src/main.js

@@ -6,6 +6,11 @@ import store from "./store";
 
 import Antd from "ant-design-vue";
 import "ant-design-vue/dist/antd.css";
+import { message } from "ant-design-vue";
+message.config({
+  duration: 2,
+  maxCount: 1,
+});
 Vue.use(Antd);
 
 import GlobalComponents from "./utils/js/globalComponents";

portal-manager-ui/admin/src/router/index.js

@@ -21,19 +21,19 @@ const router = new VueRouter({
   routes: routeConfig,
 });
 
-// router.beforeEach((to, from, next) => {
-//   let islogin = store.getters["user/token"];
-//   if (islogin) {
-//     next();
-//   } else {
-//     // 再次判断防止死循环
-//     if (to.path === "/") {
-//       next();
-//     } else {
-//       next({ path: "/" });
-//     }
-//   }
-// });
+router.beforeEach((to, from, next) => {
+  let islogin = store.getters["user/token"];
+  if (islogin) {
+    next();
+  } else {
+    // 再次判断防止死循环
+    if (to.path === "/") {
+      next();
+    } else {
+      next({ path: "/" });
+    }
+  }
+});
 
 router.afterEach((to, from, next) => {
   window.scrollTo(0, 0);

portal-manager-ui/admin/src/store/modules/menu.js

 export default {
-    namespaced: true,
-    state: {
-        menuList_X: [],   //简单结构
-        menuTree_X: [],  //树型结构
+  namespaced: true,
+  state: {
+    menuList_X: [], //简单结构
+    menuTree_X: [], //树型结构
+  },
+  getters: {
+    menuList_X: (state) => state.menuList_X,
+    menuTree_X: (state) => state.menuTree_X,
+  },
+  mutations: {
+    SET_menuList_X(state, data) {
+      state.menuList_X = data;
+      // console.log(state.menuList_X);
     },
-    getters: {
-        menuList_X: state => state.menuList_X,
-        menuTree_X: state => state.menuTree_X,
+    SET_menuTree_X(state, data) {
+      state.menuTree_X = data;
+      // console.log(state.menuTree_X);
     },
-    mutations: {
-        SET_menuList_X(state, data) {
-            state.menuList_X = data;
-            // console.log(state.menuList_X);
-        },
-        SET_menuTree_X(state, data) {
-            state.menuTree_X = data;
-            // console.log(state.menuTree_X);
-        }
-
-    },
-    actions: {
-
-    }
-}
+  },
+  actions: {},
+};

portal-manager-ui/admin/src/views/dataActuary/dataActuary.vue

@@ -15,7 +15,7 @@
             @click="handleJump(item.url)"
             @mouseover="hoverItem(index)"
             @mouseleave="hoverleave(index)"
-            :style="{background: `url(${require('@/assets/images/dataActuary/'+(index+1)+'.png')})`}">
+            :style="{background: `url(${require('@/assets/images/dataActuary/'+(index+1)+'.png')}) no-repeat`}">
             <div class="actitem_tit">
               {{item.name}}
             </div>
@@ -169,12 +169,10 @@ export default {
       display: flex;
       justify-content: space-between;
       transition: all 1s ease 0s;
-      .yw{
-         background: url('~@/assets/images/dataActuary/1.png');
-      }
       
       .act_mod_item:hover{
-        animation: startopen 1s normal 1 forwards;
+        // animation: startopen 1s normal 1 forwards;
+        transition: all 1s ease 0s;
         overflow: hidden;
         flex-shrink: 0;
         width: 551px;
@@ -206,7 +204,8 @@ export default {
         }
       }
       .act_mod_item{
-        animation: leaveopen .5s normal 1 forwards;
+        // animation: leaveopen .5s normal 1 forwards;
+        transition: all .5s ease 0s;
         flex-shrink: 0;
         width: 170px;
         height: 450px;

portal-manager-ui/admin/src/views/home/home.vue

 <template>
   <div class="route-view min-h-full w-full flex">
-    <div class="header w-full flex justify-between items-center text-white">
+    <div
+      class="header w-full flex justify-between items-center text-white"
+      :class="{ inside: !isHomePage }"
+    >
       <a-space>
         <img
           class="logo cursor-pointer"
@@ -20,14 +23,28 @@
         </div>
       </a-space>
       <!-- 菜单 -->
-      <a-menu :selectedKeys="current" @click="handelClick" mode="horizontal">
+      <a-menu
+        v-if="isHomePage"
+        :selectedKeys="current"
+        @click="handelClick"
+        mode="horizontal"
+      >
         <a-menu-item v-for="v in homeMenus" :key="v.url">
           {{ v.name }}
         </a-menu-item>
       </a-menu>
       <!-- 时间、用户信息展示 -->
       <div class="flex items-center">
-        <div class="show-time flex flex-col items-end">
+        <!-- 返回门户 -->
+        <div
+          v-if="!isHomePage"
+          class="flex flex-col items-center cursor-pointer"
+          @click="backHome"
+        >
+          <a-icon type="desktop" class="desktop mb-1" />
+          <p class="text-[14px]">返回门户</p>
+        </div>
+        <div v-if="isHomePage" class="show-time flex flex-col items-end">
           <div class="time mb-1">{{ nowTime }}</div>
           <div class="date">{{ nowDay }} {{ nowWeek }}</div>
         </div>
@@ -81,6 +98,12 @@ export default {
       nowDay: "",
       nowWeek: "",
       visibleEditPwd: false,
+      homePage: [
+        "/home/dataManagement",
+        "/home/siteArrange",
+        "/home/dataActuary",
+        "/home/thePlatformIsSet/setPlatformes",
+      ],
     };
   },
   computed: {
@@ -94,6 +117,11 @@ export default {
       }
       return [path];
     },
+    isHomePage() {
+      let cur = this.$route.path;
+      let curParent = this.$route.matched[1]?.path;
+      return this.homePage.includes(cur) || this.homePage.includes(curParent);
+    },
   },
   created() {
     this.setMoment();
@@ -107,7 +135,12 @@ export default {
       this.$router.go(0);
     },
     backHome() {
-      this.$router.push("/datamanage");
+      let path = storage.get(1, "routeInfo");
+      if (path) {
+        this.$router.push(path);
+      } else {
+        this.$router.push("/home");
+      }
     },
     setMoment() {
       this.timer = setInterval(() => {
@@ -144,6 +177,7 @@ export default {
       });
     },
     handelClick(route) {
+      storage.set(1, "routeInfo", route.key);
       this.$router.push(route.key);
     },
   },
@@ -245,4 +279,7 @@ export default {
     background: #ffffff;
   }
 }
+.inside {
+  background: linear-gradient(90deg, #1845c6 0%, #2999ff 100%) !important;
+}
 </style>
\ No newline at end of file

portal-manager-ui/admin/src/views/signIn/signIn.vue

@@ -67,7 +67,7 @@
 
 <script>
 import { LoginInterface } from "@/api/user.js";
-import { mapMutations } from "vuex";
+import { mapMutations, mapState } from "vuex";
 import { changeAccount } from "@/utils/js/validate";
 import { encrypt } from "@/utils";
 import storage from "@/utils/js/Storage";
@@ -97,7 +97,13 @@ export default {
       },
     };
   },
+  computed: {
+    ...mapState("user", ["token"]),
+  },
   created() {
+    if (this.token) {
+      this.$router.push("/home");
+    }
     this.createCode();
   },
   methods: {

portal-manager-ui/admin/src/views/siteArrange/siteArrange.vue

 <template>
   <div class="station w-full h-auto">
-    <div class="title flex flex-col items-center">
+    <!-- 删除常用 -->
+    <div class="del-box" :class="['del-box', { active: isDel }]">
+      <draggable
+        v-model="delList"
+        :options="{
+          group: { name: draName1, pull: false, put: joinDel },
+        }"
+        animation="400"
+        delay="20"
+        draggable=".common-item"
+        class="w-full h-full text-white text-xl flex items-center justify-center"
+        @add="handleDelete"
+      >
+        <span class="del-text">{{ placeholder }}</span>
+      </draggable>
+    </div>
+    <div class="title flex flex-col items-center mt-[150px] mb-[25px]">
       <img
-        class="img-title mb-[42px] mt-[230px]"
+        class="img-title mb-[42px]"
         src="@/assets/images/siteArrange/title.png"
       />
       <div class="slogan">建设高效便民、智慧泛在的智慧政务大厅</div>
     </div>
-    <!-- 站点列表 -->
-    <div class="">
+    <!-- 站点 -->
+    <div class="site-content w-full" :class="{ collapsed: isCollapsed }">
       <!-- 常用 -->
-      <div class="common flex items-center justify-between">
+      <div
+        class="common flex items-center justify-between mb-[15px] h-[130px]"
+        :class="{ 'common-add': isAdd }"
+      >
         <draggable
-          v-model="siteModelList"
-          :group="{
-            name: 'itxst',
-            pull: true,
-            put: changeCommon,
+          v-model="collectList"
+          :options="{
+            group: { name: draName2, pull: true, put: handleJoin },
           }"
-          animation="500"
-          delay="50"
+          animation="400"
+          delay="20"
           draggable=".common-item"
           class="common-list"
           dragClass="dragClass"
-          @remove="handleRemove"
+          @add="addEnd"
+          @end="collectEnd"
+          @start="delStart"
         >
           <div
-            class="common-item w-[160px] flex flex-col items-center cursor-pointer"
-            v-for="v in siteModelList"
-            :key="v.id"
+            class="common-item w-full flex flex-col items-center cursor-pointer"
+            v-for="(v, i) in collectList"
+            :key="'' + v.id + i"
+            @click="openWindow(v)"
           >
-            <div class="item-logo">
+            <div class="item-logo item-logo1">
               <img
                 class="w-full h-full object-cover"
                 :src="api + v.modelIcon"
@@ -47,66 +67,183 @@
         </draggable>
         <div class="w-[160px] flex justify-center items-center">
           <img
-            class="cursor-pointer"
+            class="cursor-pointer icon-img"
             src="@/assets/images/siteArrange/extension.png"
+            @click="isCollapsed = !isCollapsed"
           />
         </div>
       </div>
       <!-- 站点列表 -->
-      <div class="site-box"></div>
+      <div class="site-box">
+        <div class="site-type" v-for="(v, i) in siteModelList" :key="i">
+          <div class="type-title">{{ v.type }}</div>
+          <draggable
+            v-model="v.list"
+            :options="{
+              group: { name: draName3, pull: 'clone', put: false },
+              sort: false,
+            }"
+            animation="400"
+            delay="20"
+            draggable=".common-item"
+            class="type-list"
+            dragClass="dragClass"
+            @start="isAdd = true"
+            @end="isAdd = false"
+          >
+            <div
+              class="common-item w-[160px] flex flex-col items-center cursor-pointer"
+              v-for="item in v.list"
+              :key="item.id"
+              @click="openWindow(item)"
+            >
+              <div class="item-logo">
+                <img
+                  class="w-full h-full object-cover"
+                  :src="api + item.modelIcon"
+                />
+              </div>
+              <div class="text-white mt-[10px] leading-[20px]">
+                {{ item.modelName }}
+              </div>
+            </div>
+          </draggable>
+        </div>
+      </div>
     </div>
   </div>
 </template>
 
 <script>
-import { appsListInterface } from "@/api/siteArrange";
+import { appsListInterface, getCollect, saveCollect } from "@/api/siteArrange";
 import Storage from "@/utils/js/Storage";
+import { mapState } from "vuex";
 export default {
   data() {
     return {
       api: process.env.VUE_APP_API_IMG_URL,
       siteId: Storage.get(2, "siteId"),
-      commonList: [],
+      arr: [],
+      collectList: [], // 用户常用列表
       siteModelList: [], // 站点编排列表
+      isAdd: false, // 是否在拖动站点到常用列表
+      isCollapsed: true,
+      draName1: "item",
+      draName2: "item",
+      draName3: "item",
+      placeholder: "将模块拖到此处删除",
+      delList: [],
+      isDel: false,
     };
   },
 
+  computed: {
+    ...mapState("user", ["token", "userData"]),
+  },
+
   created() {
+    this.getCollect();
     this.appsListInterface();
   },
 
   methods: {
+    // 获取用户常用站点列表
+    async getCollect() {
+      let res = await getCollect();
+      if (res.data.code == 1) {
+        this.collectList = res.data.data;
+      }
+    },
+    // 获取站点分类列表
     async appsListInterface() {
       let res = await appsListInterface({ siteId: this.siteId });
       if (res.data.code == 1) {
         let { data } = res.data.data;
-        this.siteModelList = data.slice(0, 10);
-        console.log(this.siteModelList);
+        this.siteModelList = data;
       }
     },
     openWindow(row) {
-      let token = Storage.get(2, "Authorization");
-      let siteid = Storage.get(2, "siteId") ? Storage.get(2, "siteId") : 0;
-      let siteName = Storage.get(2, "siteName")
-        ? Storage.get(2, "siteName")
-        : "";
-      let info = Storage.get(2, "userInfo");
+      let siteid = Storage.get(2, "siteId") || 0;
+      let siteName = Storage.get(2, "siteName") || "";
       let userInfo = JSON.stringify({
-        id: info.id,
-        name: info.loginName,
+        id: this.userData.id,
+        name: this.userData.loginName,
       });
       let { modelUrl, modelName, modelIcon } = row;
       let path = this.$route.path;
       modelName = encodeURI(modelName);
       window.open(
-        `${modelUrl}?token=${token}&siteid=${siteid}&siteName=${siteName}&userInfo=${userInfo}&sysName=${modelName}&sysLogo=${modelIcon}&path=${path}`,
+        `${modelUrl}?token=${this.token}&siteid=${siteid}&siteName=${encodeURI(
+          siteName
+        )}&userInfo=${userInfo}&sysName=${modelName}&sysLogo=${modelIcon}&path=${path}`,
         "_blank"
       );
     },
-    handleRemove(e) {
-      console.log(e);
+
+    handleJoin() {
+      if (this.collectList.length >= 10) {
+        this.$message.warning("常用列表最多只能添加10个模块");
+        return false;
+      }
+    },
+    // 常用添加以后去重
+    addEnd() {
+      let bool = this.hasDuplicate(this.collectList);
+      if (bool) {
+        const res = new Map();
+        this.collectList = this.collectList.filter((v) => {
+          return !res.has(v.id) && res.set(v.id, 1);
+        });
+        this.$message.warning("该模块已存在");
+      } else {
+        this.saveCollect();
+      }
+    },
+    // 保存收藏
+    async saveCollect() {
+      let modelIds = this.collectList.map((v) => v.id).join(",");
+      let res = await saveCollect({
+        modelIds,
+      });
+      // if (res.data.code == 1) {
+      //   this.$message.success("设置成功");
+      //   this.getCollect();
+      // }
+      if (res.data.code != 1) {
+        this.getCollect();
+      }
+    },
+    // 删除开始时
+    delStart() {
+      this.isDel = true;
+      this.draName3 = "del";
+    },
+    // 进入删除范围
+    joinDel() {},
+    collectEnd() {
+      this.getCollect();
+      this.isDel = false;
+      this.draName3 = "item";
+    },
+    // 删除常用
+    handleDelete() {
+      this.saveCollect();
+      this.delList.pop();
+      this.isDel = false;
+      this.draName3 = "item";
+    },
+
+    // 判断是否有重复
+    hasDuplicate(arr) {
+      let idSet = new Set();
+      for (let i = 0; i < arr.length; i++) {
+        if (idSet.has(arr[i].id)) {
+          return true;
+        }
+        idSet.add(arr[i].id);
+      }
+      return false;
     },
-    changeCommon() {},
   },
 };
 </script>
@@ -115,6 +252,22 @@ export default {
 .station {
   background: url("@/assets/images/siteArrange/bg.png") no-repeat;
   background-size: 100% 100%;
+  overflow: hidden;
+  .del-box {
+    width: 100%;
+    height: 150px;
+    background: rgba(0, 0, 0, 0.5);
+    position: fixed;
+    top: -100%;
+    left: 0px;
+    transition: all 0.5s;
+    .del-text {
+      position: absolute;
+    }
+  }
+  .active {
+    top: 0px;
+  }
   .title {
     .slogan {
       font-size: 39px;
@@ -123,27 +276,98 @@ export default {
       color: #ffffff;
     }
   }
+  .site-content {
+    height: 600px;
+    transition: all 1s;
+  }
+
   .common {
     padding: 0px 40px;
     .common-list {
+      width: 100%;
       display: grid;
       grid-template-columns: repeat(10, 1fr);
-      align-items: center;
+      align-items: start;
       justify-items: center;
     }
-    .item-logo {
-      width: 80px;
-      height: 80px;
-      padding: 10px;
-      background: linear-gradient(180deg, #daefff 0%, #ffffff 100%);
-      box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.1);
-      border-radius: 20px;
-      position: relative;
-      .bottom-img {
-        position: absolute;
-        left: 0px;
-        bottom: -10px;
+  }
+  .icon-img {
+    transform: rotateZ(0deg);
+    transition: all 1s;
+  }
+  .common-add {
+    background: rgba(0, 0, 0, 0.5);
+  }
+  .item-logo {
+    width: 80px;
+    height: 80px;
+    padding: 10px;
+    box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.1);
+    border-radius: 20px;
+    position: relative;
+    .bottom-img {
+      position: absolute;
+      left: 0px;
+      bottom: -10px;
+    }
+  }
+  .item-logo1 {
+    background: linear-gradient(180deg, #daefff 0%, #ffffff 100%);
+  }
+  .site-box {
+    width: 100%;
+    height: 440px;
+    padding: 20px 10px 0px 10px;
+    background: rgba(3, 18, 51, 0.4);
+    display: grid;
+    grid-template-columns: repeat(3, 1fr);
+    opacity: 1;
+    transition: all 3s;
+    .site-type {
+      height: inherit;
+      display: flex;
+      flex-direction: column;
+      .type-title {
+        margin-bottom: 20px;
+        font-size: 22px;
+        font-family: Source Han Sans CN;
+        font-weight: bold;
+        color: #ffffff;
+        text-align: center;
+      }
+      .type-list {
+        flex: 1;
+        padding: 0px 6px;
+        height: 200px;
+        display: grid;
+        grid-template-columns: repeat(3, 1fr);
+        grid-row-gap: 10px;
+        overflow-y: auto;
+      }
+      &:nth-child(1) {
+        .item-logo {
+          background: linear-gradient(180deg, #c7e1f6 0%, #ffffff 85%);
+        }
       }
+      &:nth-child(2) {
+        .item-logo {
+          background: linear-gradient(180deg, #c7f6db 0%, #ffffff 85%);
+        }
+      }
+      &:nth-child(3) {
+        .item-logo {
+          background: linear-gradient(180deg, #f6e7c7 0%, #ffffff 85%);
+        }
+      }
+    }
+  }
+  .collapsed {
+    transform: translateY(450px);
+    .site-box {
+      opacity: 0;
+    }
+    .icon-img {
+      transform: rotateZ(180deg);
     }
   }
 }