perf:修改删除模块

portal-manager-ui/admin/src/views/dataActuary/demo2.vue → portal-manager-ui/admin/src/views/dataActuary/ParticleWavy.vue

@@ -194,6 +194,7 @@ export default {
 .demo {
   width: 100%;
   height: 100%;
+  opacity: 0.3;
   // background: url("@/assets/img/demo/bg.png") no-repeat center;
 }
 </style>
\ No newline at end of file

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

 <template>
   <div class="actuary w-full h-auto">
-    <Start class="start"/>
+    <Start class="start" />
     <div class="act_cont">
       <div class="act_tit">
         <h1>智慧政务数据精算</h1>
@@ -10,17 +10,24 @@
       </div>
       <div class="over_act_mod">
         <div class="act_mod" ref="mode">
-          <div class="act_mod_item"  v-for="(item,index) of menuPermission"
+          <div
+            class="act_mod_item"
+            v-for="(item, index) of menuPermission"
             :key="item.id"
             @click="handleJump(item.url)"
             @mouseover="hoverItem(index)"
             @mouseleave="hoverleave(index)"
-            :style="{background: `url(${require('@/assets/images/dataActuary/'+(index+1)+'.png')}) no-repeat`}">
+            :style="{
+              background: `url(${require('@/assets/images/dataActuary/' +
+                (index + 1) +
+                '.png')}) no-repeat`,
+            }"
+          >
             <div class="actitem_tit">
-              {{item.name}}
+              {{ item.name }}
             </div>
             <div class="actitem_p">
-              {{item.hover?item.remark:'Business data analysis'}}
+              {{ item.hover ? item.remark : "Business data analysis" }}
             </div>
           </div>
         </div>
@@ -31,8 +38,9 @@
 
 <script>
 import menu from "@/mixins/menu";
+import Start from "./ParticleWavy.vue";
+import { mapState } from "vuex";
 import Storage from "@/utils/js/Storage";
-import Start from "./demo2"
 export default {
   mixins: [menu],
   data() {
@@ -41,8 +49,12 @@ export default {
       menuPermission: [],
     };
   },
-  components:{
-    Start
+  components: {
+    Start,
+  },
+
+  computed: {
+    ...mapState("user", ["userData", "token"]),
   },
 
   created() {
@@ -52,30 +64,35 @@ export default {
   },
 
   methods: {
-    hoverItem(index){
-        this.menuPermission[index].hover = true
-        this.$refs.mode.style.transition="all 1s ease 0s";
+    hoverItem(index) {
+      this.menuPermission[index].hover = true;
+      this.$refs.mode.style.transition = "all 1s ease 0s";
       // 如果大于6就要往前移动
-      if(index>5){
-        let num = index-5
-        this.$refs.mode.style.transform="translateX(-"+num*190+"px)";
-        this.$forceUpdate()
+      if (index > 5) {
+        let num = index - 5;
+        this.$refs.mode.style.transform = "translateX(-" + num * 190 + "px)";
+        this.$forceUpdate();
       }
     },
-    hoverleave(index){
-        this.$refs.mode.style.transform="translate(0, 0)";
-        this.$refs.mode.style.transition="all .5s ease 0s";
-        this.menuPermission[index].hover = false
-        this.$forceUpdate()
+    hoverleave(index) {
+      this.$refs.mode.style.transform = "translate(0, 0)";
+      this.$refs.mode.style.transition = "all .5s ease 0s";
+      this.menuPermission[index].hover = false;
+      this.$forceUpdate();
     },
 
     // 跳转
     handleJump(url) {
-      this.$router.push(url);
+      if (url.includes("http") || url.includes("https")) {
+        let siteid = Storage.get(2, "siteId") || 0;
+        location.href = `${url}?token=${this.token}&siteid=${siteid}`;
+      } else {
+        this.$router.push(url);
+      }
     },
     // 获取子菜单权限
     getChildrenPermission() {
-      let { menuList } = Storage.get(2, "userInfo");
+      let { menuList } = this.userData;
       let actuary = menuList.filter((v) => v.name === "数据精算");
       if (actuary.length) {
         let arr = actuary
@@ -87,10 +104,10 @@ export default {
             }
           })
           .flat();
-          arr.forEach(item=>{
-            item.hover = false
-          })
-          this.menuPermission = arr
+        arr.forEach((item) => {
+          item.hover = false;
+        });
+        this.menuPermission = arr;
       }
     },
   },
@@ -98,8 +115,7 @@ export default {
 </script>
 
 <style lang="less" scoped>
-@headerH: 4.5rem;
-@keyframes startopen{
+@keyframes startopen {
   0% {
     width: 170px;
   }
@@ -107,7 +123,7 @@ export default {
     width: 551px;
   }
 }
-@keyframes leaveopen{
+@keyframes leaveopen {
   0% {
     width: 551px;
     background-size: 100% 100%;
@@ -117,7 +133,7 @@ export default {
     width: 170px;
   }
 }
-.start{
+.start {
   position: absolute;
   bottom: 0;
   z-index: 0;
@@ -126,7 +142,6 @@ export default {
 .actuary {
   background: url("~@/assets/images/dataActuary/bg.png") center no-repeat;
   background-size: cover;
-  padding-top: @headerH;
 
   .act_cont {
     margin: 120px auto;
@@ -143,11 +158,11 @@ export default {
         color: #ffffff;
         font-size: 53px;
         font-family: FZZhengHeiS-EB-GB;
-        color: #FFFFFF;
+        color: #ffffff;
         line-height: 64px;
         letter-spacing: 6px;
-        background: linear-gradient(0deg, #D2F8FF 0%, #FFFFFF 88.37890625%);
-        -webkit-background-clip: text;
+        background: linear-gradient(0deg, #d2f8ff 0%, #ffffff 88.37890625%);
+        background-clip: text;
         -webkit-text-fill-color: transparent;
       }
       p {
@@ -156,11 +171,11 @@ export default {
         font-size: 22px;
         font-family: Source Han Sans CN;
         font-weight: 500;
-        color: #FFFFFF;
+        color: #ffffff;
         line-height: 34px;
       }
     }
-    .over_act_mod{
+    .over_act_mod {
       width: 1520px;
       overflow: hidden;
       margin: 50px auto 0;
@@ -169,74 +184,75 @@ export default {
       display: flex;
       justify-content: space-between;
       transition: all 1s ease 0s;
-      
-      .act_mod_item:hover{
+
+      .act_mod_item:hover {
         // animation: startopen 1s normal 1 forwards;
         transition: all 1s ease 0s;
         overflow: hidden;
         flex-shrink: 0;
         width: 551px;
         height: 450px;
-        background: url('~@/assets/images/dataActuary/bg-open.png') center no-repeat !important;
+        background: url("~@/assets/images/dataActuary/bg-open.png") center
+          no-repeat !important;
         background-size: 100% 100%;
         border-radius: 12px;
         box-sizing: border-box;
         padding: 90px 50px;
-        .actitem_tit{
+        .actitem_tit {
           width: 350px;
           font-size: 31px;
           font-family: Source Han Sans CN;
           font-weight: bold;
-          color: #FFFFFF;
+          color: #ffffff;
           line-height: 59px;
           margin-bottom: 20px;
         }
-        .actitem_tit::before{
+        .actitem_tit::before {
           content: none;
         }
-        .actitem_p{
+        .actitem_p {
           width: 350px;
           font-size: 16px;
           font-family: Source Han Sans CN;
           font-weight: 400;
-          color: #FFFFFF;
+          color: #ffffff;
           line-height: 28px;
         }
       }
-      .act_mod_item{
+      .act_mod_item {
         // animation: leaveopen .5s normal 1 forwards;
-        transition: all .5s ease 0s;
+        transition: all 0.5s ease 0s;
         flex-shrink: 0;
         width: 170px;
         height: 450px;
         border-radius: 12px;
-        margin:0 10px;
-        .actitem_p{
+        margin: 0 10px;
+        .actitem_p {
           padding: 0 10px;
           font-size: 12px;
           font-family: Source Han Sans CN;
           font-weight: 400;
-          color: #0857E8;
+          color: #0857e8;
           line-height: 38px;
           opacity: 0.7;
         }
-        .actitem_tit{
+        .actitem_tit {
           font-size: 20px;
           font-family: Source Han Sans CN;
           font-weight: bold;
-          color: #0857E8;
+          color: #0857e8;
           line-height: 38px;
-          padding:40px 10px 8px;
+          padding: 40px 10px 8px;
           position: relative;
         }
-        .actitem_tit::before{
+        .actitem_tit::before {
           content: "";
           position: absolute;
           left: 10px;
           bottom: 0;
           width: 30px;
           height: 2px;
-          background: linear-gradient(to bottom right, #0857E8, #fff);
+          background: linear-gradient(to bottom right, #0857e8, #fff);
         }
       }
     }

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

@@ -196,6 +196,7 @@ export default {
   position: absolute;
   top: 0px;
   left: 0px;
+  z-index: 100;
   .logo {
     width: 40px;
   }

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

@@ -5,7 +5,7 @@
       <draggable
         v-model="delList"
         :options="{
-          group: { name: draName1, pull: false, put: joinDel },
+          group: { name: 'item', pull: false, put: joinDel },
         }"
         animation="400"
         delay="20"
@@ -33,7 +33,7 @@
         <draggable
           v-model="collectList"
           :options="{
-            group: { name: draName2, pull: true, put: handleJoin },
+            group: { name: 'item', pull: true, put: handleJoin },
           }"
           animation="400"
           delay="20"
@@ -41,8 +41,7 @@
           class="common-list"
           dragClass="dragClass"
           @add="addEnd"
-          @end="collectEnd"
-          @start="delStart"
+          @start="isDel = true"
         >
           <div
             class="common-item w-full flex flex-col items-center cursor-pointer"
@@ -80,7 +79,7 @@
           <draggable
             v-model="v.list"
             :options="{
-              group: { name: draName3, pull: 'clone', put: false },
+              group: { name: 'item', pull: 'clone', put: false },
               sort: false,
             }"
             animation="400"
@@ -128,9 +127,6 @@ export default {
       siteModelList: [], // 站点编排列表
       isAdd: false, // 是否在拖动站点到常用列表
       isCollapsed: true,
-      draName1: "item",
-      draName2: "item",
-      draName3: "item",
       placeholder: "将模块拖到此处删除",
       delList: [],
       isDel: false,
@@ -216,21 +212,12 @@ export default {
     // 删除开始时
     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";
     },
 
     // 判断是否有重复
@@ -260,7 +247,7 @@ export default {
     position: fixed;
     top: -100%;
     left: 0px;
-    transition: all 0.5s;
+    transition: all 0.2s;
     .del-text {
       position: absolute;
     }