1、疑点筛查生态资源页面以及数据对接

2、镇域专题资源问题数据
3、进入综合分析后默认展示我的标记所有图形
4、优化折叠面板箭头 - 居中显示
5、标记疑点保存删除按钮换icon

src/assets/global.css

@@ -72,6 +72,9 @@
   color: #ffffff;
   border: none;
 }
+.el-collapse-item__header i{
+  text-indent: 0px;
+}
 
 .el-collapse-item__wrap {
   background-color: rgba(255, 255, 255, 0);

src/components/common/TagCard.vue

@@ -5,22 +5,22 @@
       <!-- 上下布局 -->
       <div v-if="data.type !== 'lr'" class="tbFlx">
         <div class="tagValue">
-          <span>{{ data.valueData ? data.valueData[data.valueData.length - 1] : "--" }}</span
+          <span>{{ data.value  ? data.value : (data.valueData ? data.valueData[data.valueData.length - 1] : "--") }}</span
           ><span>{{ data.unit ? data.unit : "--" }}</span>
         </div>
         <div class="tagImg">
-          <div v-if="index === chartCardDataIndex" class="tagActive"></div>
+          <div v-if="index === chartCardDataIndex && data.valueData" class="tagActive"></div>
         </div>
         <div class="tagTitle">{{ data.title ? data.title : "--" }}</div>
       </div>
       <!-- 左右布局 -->
       <div v-if="data.type === 'lr'" class="lrFlx">
         <div class="tagImg">
-          <div v-if="index === chartCardDataIndex" class="tagActive"></div>
+          <div v-if="index === chartCardDataIndex && data.valueData" class="tagActive"></div>
         </div>
         <div>
           <div class="tagValue">
-            <span>{{ data.valueData ? data.valueData[data.valueData.length - 1] : "--" }}</span
+            <span>{{ data.value ? data.value : (data.valueData ? data.valueData[data.valueData.length - 1] : "--" )}}</span
             ><span>{{ data.unit ? data.unit : "--" }}</span>
           </div>
           <div class="tagTitle">{{ data.title ? data.title : "--" }}</div>

src/components/layout/MenuCard.vue

@@ -32,7 +32,9 @@
           ></div>
         </div>
         <!-- 标题 -->
-        <div class="menuMainBox_top_left_title">{{ menuData.title }}</div>
+        <div class="menuMainBox_top_left_title">
+          {{ (menuData.beforeTitle ? $store.state[menuData.beforeTitle] : "") + menuData.title }}
+        </div>
         <!-- 右侧倾斜图标1 -->
         <div class="menuMainBox_top_left_iconE menuMainBox_top_left_iconE1"></div>
         <!-- 右侧倾斜图标2 -->
@@ -90,7 +92,7 @@
         />
         <div
           class="menuCardFlex"
-          v-if="menuData.topSolt.commonName == 'TagCard'"
+          v-if="menuData.topSolt.commonName == 'TagCard' || menuData.topSolt.commonName == 'ALLLIST'"
           :style="{
             justifyContent: menuData.topSolt.commonData.length > 1 ? 'space-between' : 'center'
           }"
@@ -234,7 +236,12 @@ export default {
             this.dataInitLoading = false;
           }
         );
-      } else if (this.menuData && this.menuData.columnId && this.menuData.commonName !== "SUM") {
+      } else if (
+        this.menuData &&
+        this.menuData.columnId &&
+        this.menuData.commonName !== "SUM" &&
+        this.menuData.commonName !== "ALLLIST"
+      ) {
         this.dataInitLoading = true;
         let params = new FormData();
         params.append("columnId", this.menuData.columnId);
@@ -260,7 +267,7 @@ export default {
           res => {
             if (this.menuData.commonName && this.menuData.commonName === "TOP" && res.code === 200 && res.content.length > 0) {
               res.content.forEach((item, index) => {
-                if (this.menuData.dataSize > index) {
+                if (this.menuData.pageSize > index) {
                   this.resData[index] = item;
                 }
               });
@@ -322,6 +329,8 @@ export default {
         );
       } else if (this.menuData.commonName && this.menuData.commonName === "TOP") {
         this.topData(this.$store.state.homeSpecialTown);
+      } else if (this.menuData.commonName && this.menuData.commonName === "ALLLIST") {
+        this.allListData(this.$store.state.homeSpecialTown);
       } else if (this.menuData.commonName && this.menuData.commonName === "SUM") {
         this.sumData(this.$store.state.homeSpecialTown);
       }
@@ -489,7 +498,7 @@ export default {
           this.resData = [];
           if (res.code === 200 && res.content.length > 0) {
             res.content.forEach((item, index) => {
-              if (this.menuData.dataSize > index) {
+              if (this.menuData.pageSize > index) {
                 this.resData.push(item);
               }
             });
@@ -508,6 +517,61 @@ export default {
         }
       );
     },
+    allListData(homeSpecialTown) {
+      this.dataInitLoading = true;
+      if (this.menuData.paramJson) {
+        this.menuData.paramJson.sj_select.forEach((paramSjItem, paramSjIndex) => {
+          let params = new FormData();
+          params.append("columnId", this.menuData.columnId);
+          if (this.menuData.field) {
+            params.append("field", this.menuData.field);
+          }
+          params.append("states", "2,3");
+          params.append("pageSize", this.menuData.pageSize ? this.menuData.pageSize : 999);
+          params.append("page", 0);
+          let pramJson = {};
+          pramJson.sj_select = paramSjItem;
+          if (homeSpecialTown !== "全部") {
+            let associatedItems = this.$store.state.selectSelectDataMap.associatedItems;
+            if (associatedItems.length > 0) {
+              associatedItems.forEach(item => {
+                if (item.name === homeSpecialTown) {
+                  pramJson.bsjz = item.index + "";
+                }
+              });
+            }
+          }
+          params.append("paramJson", JSON.stringify(pramJson));
+          if (this.menuData.sortField) {
+            let sortparam = [
+              {
+                field: this.menuData.sortField.field,
+                orderByType: this.menuData.sortField.orderByType
+              }
+            ];
+            params.append("orderBy", JSON.stringify(sortparam));
+          }
+          this.$Post(this.menuData.getUrl ? this.menuData.getUrl : this.urlsCollection.selectContentList, params).then(
+            res => {
+              this.resData = [];
+              let allSum = 0;
+              if (res.code === 200 && res.content.length > 0) {
+                res.content.forEach(item => {
+                  allSum += item.number;
+                });
+              }
+              this.menuData.topSolt.commonData[paramSjIndex].value = allSum;
+              this.dataInitLoading = false;
+            },
+            error => {
+              this.menuData.topSolt.commonData[paramSjIndex].value = "--";
+              console.log("error:", error, this.menuData);
+              this.dataInitLoading = false;
+            }
+          );
+        });
+      }
+    },
     // 切换街镇时
     changeHomeSpecialTown() {
       if (this.resData[this.$store.state.homeSpecialTown] && this.menuData.topSolt.commonData) {
@@ -538,6 +602,8 @@ export default {
         this.topData(this.$store.state.homeSpecialTown);
       } else if (this.menuData && this.menuData.commonName && this.menuData.commonName === "SUM") {
         this.sumData(this.$store.state.homeSpecialTown);
+      } else if (this.menuData && this.menuData.commonName && this.menuData.commonName === "ALLLIST") {
+        this.allListData(this.$store.state.homeSpecialTown);
       } else if (this.menuData && this.menuData.topSolt && this.menuData.topSolt.commonData) {
         this.menuData.topSolt.commonData.forEach((item, index) => {
           this.menuData.topSolt.commonData[index].categoryData = [];
@@ -571,24 +637,6 @@ export default {
       }
       if (this.menuData != undefined && this.menuData.gotoPageInfo != undefined) {
         this.$store.commit("changeNavSelect", this.menuData.gotoPageInfo);
-        // // 暂未开发页面集合
-        // let notFound = [
-        //   { index: "2", subIndex: "2" },
-        //   { index: "2", subIndex: "3" }
-        // ];
-        // // 是否跳转暂存变量
-        // let notFoundState = true;
-        // // 遍历未开发页面index信息
-        // notFound.forEach(item => {
-        //   // 如果要跳转的页面存在未开发页面集合中
-        //   if (item.index == this.menuData.gotoPageInfo.index && item.subIndex == this.menuData.gotoPageInfo.subIndex) {
-        //     this.$message.info("页面开发中，敬请期待！");
-        //     notFoundState = false;
-        //   }
-        // });
-        // if (notFoundState) {
-        //   this.$store.commit("changeNavSelect", this.menuData.gotoPageInfo);
-        // }
       }
     },
     // 根据菜单imageURL和boxHeight对象自动生成元素的样式（背景以及高度）

src/config/common.js

@@ -850,6 +850,23 @@ export const menuOnLine = {
           name: "综合分析",
         },
       },
+      {
+        type: "imageMenu",
+        index: 1,
+        title: "垃圾堆放",
+        titleWidth: 81,
+        boxHeight: 236,
+        imageUrl: "/static/images/4.png",
+        menuIndex: "2",
+        subMenuIndex: "4",
+        menuName: "生态资源",
+        position: "left",
+        gotoPageInfo: {
+          index: "3",
+          subIndex: "",
+          name: "综合分析",
+        },
+      }
     ],
   ],
   main: [
@@ -942,9 +959,7 @@ export const menuOnLine = {
         columnId: 24,
         pageSize: 5,
         field: "c_wtfl",
-        dataType: "all",
         paramJson: {},
-        dataSize: 5,
         topData: [
           {
             number: 0,
@@ -1022,11 +1037,9 @@ export const menuOnLine = {
         columnId: 24,
         pageSize: 5,
         field: "c_zdsjsx",
-        dataType: "all",
         paramJson: {
           sj_select: "1",
         },
-        dataSize: 5,
         topData: [],
       },
     ],
@@ -1077,15 +1090,12 @@ export const menuOnLine = {
         columnId: 24,
         pageSize: 5,
         field: "c_zdsjsx",
-        dataType: "all",
         paramJson: {
           sj_select: "2",
         },
-        dataSize: 5,
         topData: [],
       },
-    ],
-    [
+    ], [
       {
         type: "card",
         title: "林地类问题",
@@ -1132,13 +1142,145 @@ export const menuOnLine = {
         columnId: 24,
         pageSize: 5,
         field: "c_zdsjsx",
-        dataType: "all",
         paramJson: {
           sj_select: "3",
         },
-        dataSize: 5,
         topData: [],
       },
-    ],
+    ], [
+      {
+        type: "card",
+        title: "生态类问题",
+        titleWidth: 60,
+        menuIndex: "2",
+        subMenuIndex: "4",
+        position: "right",
+        minDomWidth: 1200,
+        getUrl: "/dms/content/selectGroupByCountOrderBy",
+        columnId: 24,
+        pageSize: 5,
+        field: "c_zdsjsx",
+        commonName: "SUM",
+        categoryData: ["2019", "2020", "2021"],
+        paramJson: {
+          sj_select: "4",
+        },
+        topSolt: {
+          commonName: "TagCard",
+          commonData: [
+            {
+              type: "lr",
+              title: "生态类疑点",
+              unit: "个",
+              categoryData: [],
+              valueData: [],
+            },
+          ],
+        },
+        bottomSolt: {
+          commonName: "ChartCard",
+        },
+      },
+      {
+        type: "card",
+        title: "生态问题TOP5",
+        titleWidth: 81,
+        menuIndex: "2",
+        subMenuIndex: "4",
+        position: "right",
+        minDomWidth: 1200,
+        commonName: "TOP",
+        getUrl: "/dms/content/selectGroupByCountOrderBy",
+        columnId: 24,
+        pageSize: 5,
+        field: "c_zdsjsx",
+        paramJson: {
+          sj_select: "4",
+        },
+        topData: [],
+      },
+    ]
   ],
+  rightW: [
+    [
+      {
+        type: "card",
+        title: "资源问题",
+        beforeTitle: "homeSpecialTown",
+        titleWidth: 40,
+        boxWidth: "800",
+        menuIndex: "2",
+        subMenuIndex: "5",
+        position: "right",
+        minDomWidth: 1200,
+        getUrl: "/dms/content/selectGroupByCountOrderBy",
+        columnId: 24,
+        pageSize: 5,
+        field: "c_zdsjsx",
+        commonName: "ALLLIST",
+        paramJson: {
+          sj_select: ["1", "2", "3", "4"]
+        },
+        topSolt: {
+          commonName: "TagCard",
+          commonData: [
+            {
+              type: "lr",
+              title: "土地资源问题",
+              value: 0,
+              unit: "个"
+            }, {
+              type: "lr",
+              title: "水资源问题",
+              value: 0,
+              unit: "个"
+            }, {
+              type: "lr",
+              title: "林地资源问题",
+              value: 0,
+              unit: "个"
+            }, {
+              type: "lr",
+              title: "生态资源问题",
+              value: 0,
+              unit: "个"
+            },
+          ]
+        },
+      },
+      {
+        type: "card",
+        title: "资金投入TOP10",
+        titleWidth: 81,
+        boxWidth: "395",
+        menuIndex: "2",
+        subMenuIndex: "5",
+        position: "right",
+        minDomWidth: 1200,
+        commonName: "TOP",
+        getUrl: "/dms/content/selectGroupByCountOrderBy",
+        columnId: 24,
+        pageSize: 10,
+        field: "c_zdsjsx",
+        paramJson: {},
+        topData: [],
+      }, {
+        type: "card",
+        title: "历年频发问题TOP10",
+        titleWidth: 85,
+        boxWidth: "395",
+        menuIndex: "2",
+        subMenuIndex: "5",
+        position: "right",
+        minDomWidth: 1200,
+        commonName: "TOP",
+        getUrl: "/dms/content/selectGroupByCountOrderBy",
+        columnId: 24,
+        pageSize: 10,
+        field: "c_zdsjsx",
+        paramJson: {},
+        topData: [],
+      }
+    ]
+  ]
 };

src/views/HomeView.vue

@@ -23,7 +23,7 @@
           menuIndex: '2',
           subMenuIndex: '5',
           legendIcon: legendIcon,
-          legendTitle: legendTitle,
+          legendTitle: legendTitle
         }"
       />
       <div class="select-title">所属街道</div>
@@ -34,70 +34,10 @@
         :options="streetOptions"
         :value="streetSelectVal"
       />
-      <div class="town-problems">
-        <div class="town-problems-top">
-          <MenuCard
-            :menuData="{
-              type: 'card',
-              title: streetSelectVal + '资源问题',
-              titleWidth: 40,
-              boxWidth: '780',
-            }"
-          >
-            <template slot="top">
-              <div class="town-problems-top-inner">
-                <TagProblemCard
-                  class="problem-item"
-                  v-for="n in townCollection"
-                  :key="n.name"
-                  :data="n"
-                />
-              </div>
-            </template>
-          </MenuCard>
-        </div>
-        <div class="town-problems-bottom">
-          <MenuCard
-            :menuData="{
-              type: 'card',
-              title: '资金投入TOP10',
-              titleWidth: 85,
-              boxWidth: '400',
-              commonName: 'TOP',
-              getUrl: '/dms/content/selectGroupByCountOrderBy',
-              columnId: 24,
-              pageSize: 5,
-              field: 'c_wtfl',
-              dataType: 'all',
-              dataSize: 10,
-              topData: [],
-            }"
-          ></MenuCard>
-          <MenuCard
-            :menuData="{
-              type: 'card',
-              title: '历年频发问题TOP10',
-              titleWidth: 85,
-              boxWidth: '400',
-              commonName: 'TOP',
-              getUrl: '/dms/content/selectGroupByCountOrderBy',
-              columnId: 24,
-              pageSize: 5,
-              field: 'c_wtfl',
-              dataType: 'all',
-              dataSize: 10,
-              topData: [],
-            }"
-          ></MenuCard>
-        </div>
-      </div>
     </div>
 
     <!-- 综合分析 -->
-    <ComprehensiveAnalysis
-      id="ComprehensiveContainer"
-      v-if="$ifMenu('3', '')"
-    />
+    <ComprehensiveAnalysis id="ComprehensiveContainer" v-if="$ifMenu('3', '')" />
 
     <!-- 法律法规 -->
     <LawView id="LawContainer" v-if="$ifMenu('5', '1')" />
@@ -112,8 +52,7 @@
     </div>
     <!-- 左侧菜单列(较宽，两列) -- 疑点筛查 -->
     <div id="leftMenusW" v-for="(item, index) in menus.leftW" :key="index">
-      <MenuCard :menuData="item2" v-for="item2 in item" :key="item2.title">
-      </MenuCard>
+      <MenuCard :menuData="item2" v-for="item2 in item" :key="item2.title"> </MenuCard>
     </div>
     <!-- 中部菜单列 -->
     <div id="mainMenus">
@@ -159,22 +98,17 @@
           boxHeight: '180',
           menuIndex: '1',
           legendIcon: legendIcon,
-          legendTitle: legendTitle,
+          legendTitle: legendTitle
         }"
       />
     </div>
     <!-- 首页右侧菜单列 -->
-    <div
-      class="rightMenus"
-      v-for="(item, index) in menus.right"
-      :key="'rightBox' + index"
-    >
-      <MenuCard
-        :menuData="item2"
-        v-for="(item2, index2) in item"
-        :key="'right' + index2"
-      >
-      </MenuCard>
+    <div class="rightMenus" v-for="(item, index) in menus.right" :key="'rightBox' + index">
+      <MenuCard :menuData="item2" v-for="(item2, index2) in item" :key="'right' + index2"> </MenuCard>
+    </div>
+    <!-- 首页右侧菜单列 -->
+    <div class="rightMenusW" v-for="(item, index) in menus.rightW" :key="'rightBoxW' + index">
+      <MenuCard :menuData="item2" v-for="(item2, index2) in item" :key="'rightW' + index2"> </MenuCard>
     </div>
   </div>
 </template>
@@ -219,7 +153,7 @@ export default {
     Legend,
     WholeProcessManagement,
     FrequencyView,
-    LawView,
+    LawView
   },
   data() {
     return {
@@ -228,7 +162,7 @@ export default {
         type: "lr",
         title: "林地面积",
         value: 654,
-        unit: "公顷",
+        unit: "公顷"
       },
       testTitle: "土地资源",
       activeIndex: 1,
@@ -237,38 +171,38 @@ export default {
         left: [],
         leftW: [],
         main: [],
-        right: [],
+        right: []
       },
       // 首页饼图相关
       buttonData: ["A", "B", "C"],
       legendTitle: [
         {
           name: "A类",
-          info: "耕地林地总和占镇域面积约 45%以上,或超过3000公顷",
+          info: "耕地林地总和占镇域面积约 45%以上,或超过3000公顷"
         },
         {
           name: "B类",
-          info: "有一定的自然资源资产(耕地林地总和 900-3000公项)",
+          info: "有一定的自然资源资产(耕地林地总和 900-3000公项)"
         },
         {
           name: "C类",
-          info: "自然资源资产较少(耕地林地总和低于 900公项)",
-        },
+          info: "自然资源资产较少(耕地林地总和低于 900公项)"
+        }
       ],
       // legendData: ["#E565FF", "#0055FF", "#00FFD5"],
       legendIcon: [
         {
           background: "#E565FF",
-          border: "none",
+          border: "none"
         },
         {
           background: "#0055FF",
-          border: "none",
+          border: "none"
         },
         {
           background: "#00FFD5",
-          border: "none",
-        },
+          border: "none"
+        }
       ],
       btnChecked: "A",
       soil: [],
@@ -279,19 +213,19 @@ export default {
         soil: [],
         other: [],
         forestry: [],
-        categoryData: [],
+        categoryData: []
       },
       BData: {
         soil: [],
         other: [],
         forestry: [],
-        categoryData: [],
+        categoryData: []
       },
       CData: {
         soil: [],
         other: [],
         forestry: [],
-        categoryData: [],
+        categoryData: []
       },
       streetSelectVal: "全部",
       streetOptions: [],
@@ -300,12 +234,12 @@ export default {
         { name: "土地资源问题", num: 67 },
         { name: "水资源问题", num: 37 },
         { name: "林地资源问题", num: 60 },
-        { name: "生态资源问题", num: 55 },
+        { name: "生态资源问题", num: 55 }
       ],
       // 综合分析
       analysis: {
-        searchInput: "",
-      },
+        searchInput: ""
+      }
     };
   },
   mounted() {
@@ -317,12 +251,12 @@ export default {
       let params = new FormData();
       params = {
         type: type,
-        cName: cName,
+        cName: cName
       };
-      this.$Post(this.urlsCollection.selectByCNameAType, params).then((res) => {
+      this.$Post(this.urlsCollection.selectByCNameAType, params).then(res => {
         if (res.code === 200 && res.content.length > 0) {
           this.classTextToIndex[keyName] = new Map();
-          res.content.forEach((v) => {
+          res.content.forEach(v => {
             this.classTextToIndex[keyName].set(v.index + "", v.name);
           });
         }
@@ -372,12 +306,12 @@ export default {
       params.append("type", type);
       params.append("cName", cName);
       this.$Post(this.urlsCollection.selectByCNameAType, params).then(
-        (res) => {
+        res => {
           if (res.code === 200 && res.content.length > 0) {
             this.$store.state.selectSelectDataMap[keyName] = res.content;
           }
         },
-        (error) => {
+        error => {
           this.$message.error(error);
           console.log(error);
         }
@@ -411,10 +345,10 @@ export default {
         columnId: 30,
         states: "0,1,2,3",
         pageSize: 30,
-        page: 0,
+        page: 0
       };
       this.$Post(this.urlsCollection.selectContentList, params)
-        .then((res) => {
+        .then(res => {
           if (res.code === 200 && res.content.data.length > 0) {
             // console.log(res.content.data, "getSourcesData接口获取成功");
             this.soil = [];
@@ -424,38 +358,32 @@ export default {
             let ADataArr = [];
             let BDataArr = [];
             let CDataArr = [];
-            data.map((v) => {
+            data.map(v => {
               if (v.zy_type === "0") {
                 ADataArr.push({
-                  name: this.classTextToIndex["浦东新区行政区划"].get(
-                    v.zy_town
-                  ),
+                  name: this.classTextToIndex["浦东新区行政区划"].get(v.zy_town),
                   soil: v.c_land_area,
                   other: v.other_area,
                   forest: v.c_forest_area,
-                  sum: v.c_land_area + v.other_area + v.c_forest_area,
+                  sum: v.c_land_area + v.other_area + v.c_forest_area
                 });
               }
               if (v.zy_type === "1") {
                 BDataArr.push({
-                  name: this.classTextToIndex["浦东新区行政区划"].get(
-                    v.zy_town
-                  ),
+                  name: this.classTextToIndex["浦东新区行政区划"].get(v.zy_town),
                   soil: v.c_land_area,
                   other: v.other_area,
                   forest: v.c_forest_area,
-                  sum: v.c_land_area + v.other_area + v.c_forest_area,
+                  sum: v.c_land_area + v.other_area + v.c_forest_area
                 });
               }
               if (v.zy_type === "2") {
                 CDataArr.push({
-                  name: this.classTextToIndex["浦东新区行政区划"].get(
-                    v.zy_town
-                  ),
+                  name: this.classTextToIndex["浦东新区行政区划"].get(v.zy_town),
                   soil: v.c_land_area,
                   other: v.other_area,
                   forest: v.c_forest_area,
-                  sum: v.c_land_area + v.other_area + v.c_forest_area,
+                  sum: v.c_land_area + v.other_area + v.c_forest_area
                 });
               }
             });
@@ -465,20 +393,20 @@ export default {
             CDataArr.sort(publicFun.compare("sum"));
 
             // 按A,B,C分出各自资源的排序数组
-            ADataArr.forEach((item) => {
+            ADataArr.forEach(item => {
               this.AData.soil.push(item.soil);
               this.AData.other.push(item.other);
               this.AData.forestry.push(item.forest);
               this.AData.categoryData.push(item.name);
             });
-            BDataArr.forEach((item) => {
+            BDataArr.forEach(item => {
               this.BData.soil.push(item.soil);
               this.BData.other.push(item.other);
               this.BData.forestry.push(item.forest);
               this.BData.categoryData.push(item.name);
             });
 
-            CDataArr.forEach((item) => {
+            CDataArr.forEach(item => {
               this.CData.soil.push(item.soil);
               this.CData.other.push(item.other);
               this.CData.forestry.push(item.forest);
@@ -497,10 +425,10 @@ export default {
             });
           }
         })
-        .catch((error) => {
+        .catch(error => {
           console.log(error, "getSourcesData");
         });
-    },
+    }
   },
   created() {
     this.classDictQuery("0", "浦东新区行政区划", "浦东新区行政区划");
@@ -509,10 +437,10 @@ export default {
     for (let key in street) {
       this.streetOptions.push({
         value: street[key],
-        label: street[key],
+        label: street[key]
       });
     }
-  },
+  }
 };
 </script>
 <style lang="less" scoped>
@@ -776,6 +704,30 @@ export default {
     display: none; /* Chrome Safari */
   }
 }
+// 右侧菜单列
+.rightMenusW {
+  position: absolute;
+  right: 0;
+  top: 60px;
+  width: 820px;
+  float: left;
+  height: calc(100% - 60px);
+  box-sizing: border-box;
+  overflow-x: hidden;
+  overflow-y: auto;
+  display: flex;
+  overflow-y: auto;
+  scrollbar-width: none;
+  -ms-overflow-style: none;
+  flex-wrap: wrap;
+  align-items: flex-start;
+  align-content: flex-start;
+  scrollbar-width: none; /* Firefox */
+  -ms-overflow-style: none; /* IE 10+ */
+  &::-webkit-scrollbar {
+    display: none; /* Chrome Safari */
+  }
+}
 .menuCardFlex {
   display: flex;
   align-content: center;
@@ -790,22 +742,14 @@ export default {
     transform: translate(-50%, -50%) rotate(45deg);
     width: 110px;
     height: 100px;
-    background: linear-gradient(to left, @commonBorderColor, @commonBorderColor)
-        left top no-repeat,
-      linear-gradient(to bottom, @commonBorderColor, @commonBorderColor) left
-        top no-repeat,
-      linear-gradient(to left, @commonBorderColor, @commonBorderColor) right top
-        no-repeat,
-      linear-gradient(to bottom, @commonBorderColor, @commonBorderColor) right
-        top no-repeat,
-      linear-gradient(to left, @commonBorderColor, @commonBorderColor) left
-        bottom no-repeat,
-      linear-gradient(to bottom, @commonBorderColor, @commonBorderColor) left
-        bottom no-repeat,
-      linear-gradient(to left, @commonBorderColor, @commonBorderColor) right
-        bottom no-repeat,
-      linear-gradient(to left, @commonBorderColor, @commonBorderColor) right
-        bottom no-repeat;
+    background: linear-gradient(to left, @commonBorderColor, @commonBorderColor) left top no-repeat,
+      linear-gradient(to bottom, @commonBorderColor, @commonBorderColor) left top no-repeat,
+      linear-gradient(to left, @commonBorderColor, @commonBorderColor) right top no-repeat,
+      linear-gradient(to bottom, @commonBorderColor, @commonBorderColor) right top no-repeat,
+      linear-gradient(to left, @commonBorderColor, @commonBorderColor) left bottom no-repeat,
+      linear-gradient(to bottom, @commonBorderColor, @commonBorderColor) left bottom no-repeat,
+      linear-gradient(to left, @commonBorderColor, @commonBorderColor) right bottom no-repeat,
+      linear-gradient(to left, @commonBorderColor, @commonBorderColor) right bottom no-repeat;
     background-size: 6px 6px, 6px 6px, 6px 6px, 6px 6px;
   }
 }