From e915c2f80f2beb7750cb254c887e97e3a35cca8b Mon Sep 17 00:00:00 2001
From: yesg <2277317060@qq.com>
Date: Wed, 22 Apr 2026 01:07:57 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/editEl/editEl17.vue |   1 +
 src/layout/index.vue               |   4 +-
 src/router/index.js                |   8 +-
 src/views/industrySolutions.vue    | 584 +++++++++++++++++++++++++++++
 4 files changed, 593 insertions(+), 4 deletions(-)
 create mode 100644 src/views/industrySolutions.vue

diff --git a/src/components/editEl/editEl17.vue b/src/components/editEl/editEl17.vue
index 07d14eb..61d1993 100644
--- a/src/components/editEl/editEl17.vue
+++ b/src/components/editEl/editEl17.vue
@@ -12,6 +12,7 @@
     </div>
     <div class="list">
       <div class="item" v-for=" (i,k) in data.productList">
+        <i class="del el-icon-circle-close" @click="data.productList.splice(k, 1);"></i>
         <div class="img1">
           <div class="img">
             <UploadEl :data="i" field="img"/>
diff --git a/src/layout/index.vue b/src/layout/index.vue
index 8724f7c..73fa35b 100644
--- a/src/layout/index.vue
+++ b/src/layout/index.vue
@@ -3,10 +3,10 @@
     <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect"
              style="position: sticky;top: 0;z-index: 9;">
       <el-menu-item index="1">首页</el-menu-item>
-      <el-menu-item index="2">关于海威</el-menu-item>
+<!--      <el-menu-item index="2">关于海威</el-menu-item>-->
       <el-menu-item index="3">行业方案</el-menu-item>
       <el-menu-item index="4">产品中心</el-menu-item>
-      <el-menu-item index="5">联系我们</el-menu-item>
+<!--      <el-menu-item index="5">联系我们</el-menu-item>-->
     </el-menu>
     <router-view></router-view>
   </div>
diff --git a/src/router/index.js b/src/router/index.js
index 54b23d6..bef5962 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -6,7 +6,7 @@ Vue.use(Router)
 
 export default new Router({
   routes: [
-	
+
 	{
 	  path: '',
 	  component: Layout,
@@ -22,7 +22,7 @@ export default new Router({
 		},
 		{
 		  path: '/industrySolutionsEdit',
-		  component: () => import('@/views/editPage/index.vue'),
+		  component: () => import('@/views/industrySolutions.vue'),
 		},
 		{
 		  path: '/productCenterEdit',
@@ -38,5 +38,9 @@ export default new Router({
 	  path: '/newsEdit',
 	  component: () => import('@/views/otherEdit/newsEdit.vue'),
 	},
+    {
+      path: '/editor',
+      component: () => import('@/views/editPage/index.vue'),
+    },
   ]
 })
diff --git a/src/views/industrySolutions.vue b/src/views/industrySolutions.vue
new file mode 100644
index 0000000..50e39d5
--- /dev/null
+++ b/src/views/industrySolutions.vue
@@ -0,0 +1,584 @@
+<template>
+  <div>
+    <div class="top">
+      <div class="title">
+        页面编辑器
+      </div>
+      <el-select
+        v-model="value"
+        @change="pageChange"
+        size="small">
+        <el-option
+          v-for="i in options"
+          :key="i.webMenuId"
+          :label="i.webMenuName"
+          :value="i.webMenuId">
+        </el-option>
+      </el-select>
+<!--      <el-cascader-->
+<!--        @change="pageChange"-->
+<!--        size="small"-->
+<!--        v-model="value"-->
+<!--        :props="props"-->
+<!--        :options="options"></el-cascader>-->
+      <el-button type="primary" size="small" style="margin-left: 12px;" @click="save">上传网页<i
+        class="el-icon-upload"></i>
+      </el-button>
+    </div>
+    <div class="container">
+      <div class="component" v-for="(i,k) in components">
+        <i class="del el-icon-circle-close" @click="components.splice(k, 1);"></i>
+        <i class="up el-icon-top" @click="moveUp(k);"></i>
+        <i class="down el-icon-bottom" @click="moveDown(k);"></i>
+        <Carousel v-if="i.type === 'carousel'" :data="i.value"/>
+        <Carousel1 v-if="i.type === 'carousel1'" :data="i.value"/>
+        <EditEl1 v-if="i.type === 1" :data="i.value"/>
+        <EditEl2 v-if="i.type === 2" :data="i.value"/>
+        <EditEl3 v-if="i.type === 3" :data="i.value"/>
+        <EditEl4 v-if="i.type === 4" :data="i.value"/>
+        <EditEl5 v-if="i.type === 5" :data="i.value"/>
+        <EditEl6 v-if="i.type === 6" :data="i.value"/>
+        <EditEl7 v-if="i.type === 7" :data="i.value"/>
+        <EditEl8 v-if="i.type === 8" :data="i.value"/>
+        <EditEl9 v-if="i.type === 9" :data="i.value"/>
+        <EditEl10 v-if="i.type ===10" :data="i.value"/>
+        <EditEl11 v-if="i.type === 11" :data="i.value"/>
+        <EditEl12 v-if="i.type === 12" :data="i.value"/>
+        <EditEl13 v-if="i.type === 13" :data="i.value"/>
+        <EditEl14 v-if="i.type === 14" :data="i.value"/>
+        <EditEl15 v-if="i.type === 15" :data="i.value"/>
+        <EditEl16 v-if="i.type === 16" :data="i.value"/>
+        <EditEl17 v-if="i.type === 17" :data="i.value"/>
+      </div>
+      <div class="addItem">
+        <div style="width:100%;height:100%;" @click="add">
+          <i class="el-icon-circle-plus" style="font-size: 3vw; line-height: 16.7vw"></i>
+        </div>
+      </div>
+    </div>
+    <el-dialog
+      title="添加组件"
+      :visible.sync="addEl"
+      width="80%">
+      <el-card shadow="hover" style="width: 200px;display: inline-block;height:70px">
+        <div style="width: 100%;height: 100%" @click="addItem('carousel')">
+          大图轮播图
+        </div>
+      </el-card>
+      <el-card shadow="hover" style="width: 200px;display: inline-block;height:70px">
+        <div style="width: 100%;height: 100%" @click="addItem('carousel1')">
+          小图轮播图
+        </div>
+      </el-card>
+
+      <el-card shadow="hover" style="width: 200px;display: inline-block;height:70px">
+        <div style="width: 100%;height: 100%" @click="addItem(1)">
+          图标 +文字+内容横铺4个
+        </div>
+      </el-card>
+      <el-card shadow="hover" style="width: 200px;display: inline-block;height:70px">
+        <div style="width: 100%;height: 100%" @click="addItem(2)">
+          左标题+内容，右图片
+        </div>
+      </el-card>
+      <el-card shadow="hover" style="width: 200px;display: inline-block;height:70px">
+        <div style="width: 100%;height: 100%" @click="addItem(3)">
+          左图标，右标题+内容，一行2个
+        </div>
+      </el-card>
+      <el-card shadow="hover" style="width: 200px;display: inline-block;height:70px">
+        <div style="width: 100%;height: 100%" @click="addItem(4)">
+          左大图右标题+内容，一行2个
+        </div>
+      </el-card>
+      <el-card shadow="hover" style="width: 200px;display: inline-block;height:70px">
+        <div style="width: 100%;height: 100%" @click="addItem(5)">
+          上标题+下图片
+        </div>
+      </el-card>
+      <el-card shadow="hover" style="width: 200px;display: inline-block;height:70px">
+        <div style="width: 100%;height: 100%" @click="addItem(6)">
+          上标题+内容，下图片
+        </div>
+      </el-card>
+      <el-card shadow="hover" style="width: 200px;display: inline-block;height:70px">
+        <div style="width: 100%;height: 100%" @click="addItem(7)">
+          图标标题内容，一行3个
+        </div>
+      </el-card>
+      <el-card shadow="hover" style="width: 200px;display: inline-block;height:70px">
+        <div style="width: 100%;height: 100%" @click="addItem(8)">
+          左图右列表
+        </div>
+      </el-card>
+      <el-card shadow="hover" style="width: 200px;display: inline-block;height:70px">
+        <div style="width: 100%;height: 100%" @click="addItem(9)">
+          上图下内容，一行4个
+        </div>
+      </el-card>
+      <el-card shadow="hover" style="width: 200px;display: inline-block;height:70px">
+        <div style="width: 100%;height: 100%" @click="addItem(10)">
+          一行3张图
+        </div>
+      </el-card>
+      <el-card shadow="hover" style="width: 200px;display: inline-block;height:70px">
+        <div style="width: 100%;height: 100%" @click="addItem(11)">
+          图标标题内容，一行3个(大图)
+        </div>
+      </el-card>
+      <el-card shadow="hover" style="width: 200px;display: inline-block;height:70px">
+        <div style="width: 100%;height: 100%" @click="addItem(12)">
+          产品特点+图片
+        </div>
+      </el-card>
+      <el-card shadow="hover" style="width: 200px;display: inline-block;height:70px">
+        <div style="width: 100%;height: 100%" @click="addItem(13)">
+          产品参数
+        </div>
+      </el-card>
+      <el-card shadow="hover" style="width: 200px;display: inline-block;height:70px">
+        <div style="width: 100%;height: 100%" @click="addItem(14)">
+          资料下载
+        </div>
+      </el-card>
+      <el-card shadow="hover" style="width: 200px;display: inline-block;height:70px">
+        <div style="width: 100%;height: 100%" @click="addItem(15)">
+          产品banner
+        </div>
+      </el-card>
+      <el-card shadow="hover" style="width: 200px;display: inline-block;height:70px">
+        <div style="width: 100%;height: 100%" @click="addItem(16)">
+          产品参数(多设备对比)
+        </div>
+      </el-card>
+      <el-card shadow="hover" style="width: 200px;display: inline-block;height:70px">
+        <div style="width: 100%;height: 100%" @click="addItem(17)">
+          配套产品
+        </div>
+      </el-card>
+      <span slot="footer" class="dialog-footer">
+    <el-button @click="addEl = false">关 闭</el-button>
+  </span>
+    </el-dialog>
+
+  </div>
+</template>
+<script>
+import Carousel from "@/components/editEl/carousel.vue";
+import Carousel1 from "@/components/editEl/carousel1.vue";
+import EditEl1 from "@/components/editEl/editEl1.vue";
+import EditEl2 from "@/components/editEl/editEl2.vue";
+import EditEl3 from "@/components/editEl/editEl3.vue";
+import EditEl4 from "@/components/editEl/editEl4.vue";
+import EditEl5 from "@/components/editEl/editEl5.vue";
+import EditEl6 from "@/components/editEl/editEl6.vue";
+import EditEl7 from "@/components/editEl/editEl7.vue";
+import EditEl8 from "@/components/editEl/editEl8.vue";
+import EditEl9 from "@/components/editEl/editEl9.vue";
+import EditEl10 from "@/components/editEl/editEl10.vue";
+import {selectMenuTree} from "@/api/hwWebMenu";
+import {getHwWeb, listHwWeb1, updateHwWeb, updateHwWeb1} from "@/api/hwWeb";
+import EditEl11 from "@/components/editEl/editEl11.vue";
+import EditEl12 from "@/components/editEl/editEl12.vue";
+import EditEl13 from "@/components/editEl/editEl13.vue";
+import EditEl14 from "@/components/editEl/editEl14.vue";
+import EditEl15 from "@/components/editEl/editEl15.vue";
+import EditEl16 from "@/components/editEl/editEl16.vue";
+import EditEl17 from "@/components/editEl/editEl17.vue";
+
+export default {
+  components: {
+    Carousel,
+    Carousel1,
+    EditEl1,
+    EditEl2,
+    EditEl3,
+    EditEl4,
+    EditEl5,
+    EditEl6,
+    EditEl7,
+    EditEl8,
+    EditEl9,
+    EditEl10,
+    EditEl11,
+    EditEl12,
+    EditEl13,
+    EditEl14,
+    EditEl15,
+    EditEl16,
+    EditEl17
+  },
+  data() {
+    return {
+      a: '1',
+      addEl: false,
+      props: {},
+      type: '',
+      value: '',
+      options: [],
+      componentsM: [
+        {
+          type: 'carousel',
+          value: {
+            list: [
+              {
+                icon: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
+                title: '111',
+                value: '222'
+              }
+            ],
+          },
+        },
+        {
+          type: 'carousel1',
+          value: {
+            list: [
+              {
+                img: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
+                title: '111',
+                value: '222'
+              }
+            ],
+          },
+        },
+        {
+          type: 1,
+          value: {
+            title: '123',
+            subTitle: '456',
+            list: [
+              {
+                icon: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
+                title: '111',
+                value: '222'
+              },
+            ],
+          },
+        },
+        {
+          type: 2,
+          value: {
+            title: '123',
+            subTitle: '456',
+            contentTitle: 'contentTitle',
+            contentSubTitle: 'DEVELOPMENT PLATFORM',
+            contentInfo: 'contentInfo',
+            icon: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
+          },
+        },
+        {
+          type: 3,
+          value: {
+            title: '123',
+            subTitle: '456',
+            list: [
+              {
+                icon: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
+                itemTitle: '111',
+                itemInfo: '222'
+              },
+            ],
+          },
+        },
+        {
+          type: 4,
+          value: {
+            icon: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
+            title: '123',
+            subTitle: '456',
+            list: [
+              {
+                title: '111',
+                value: '222'
+              }
+            ],
+          },
+        },
+        {
+          type: 5,
+          value: {
+            icon: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
+            title: '123',
+            subTitle: '456',
+          },
+        },
+        {
+          type: 6,
+          value: {
+            icon: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
+            title: '123',
+            subTitle: '456',
+            info: '789',
+          },
+        },
+        {
+          type: 7,
+          value: {
+            title: '123',
+            subTitle: '456',
+            list: [
+              {
+                icon: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
+                title: '111',
+                value: '222'
+              },
+            ],
+          },
+        },
+        {
+          type: 8,
+          value: {
+            title: '123',
+            subTitle: '456',
+            list: [
+              {
+                icon: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
+                title: '111',
+                leftTitle: '222',
+                leftInfo: '333',
+                infos: [
+                  {title: '111', info: '222'},
+                  {title: '111', info: '222'},
+                  {title: '111', info: '222'},
+                ]
+              },
+            ],
+          },
+        },
+        {
+          type: 9,
+          value: {
+            title: '123',
+            subTitle: '456',
+            list: [
+              {
+                icon: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
+                value: '222'
+              },
+            ],
+          },
+        },
+        {
+          type: 10,
+          value: {
+            title: '123',
+            subTitle: '456',
+            list: [
+              {
+                icon: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
+                title: '111',
+                value: '222'
+              }
+            ],
+          },
+        },
+        {
+          type: 11,
+          value: {
+            title: '123',
+            subTitle: '456',
+            list: [
+              {
+                icon: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
+                title: '111',
+                value: '222'
+              },
+            ],
+          },
+        },
+        {
+          type: 12,
+          value: {
+            imgList: [],
+            features: [],
+          },
+        },
+        {
+          type: 13,
+          value: {
+            params: [],
+          },
+        },
+        {
+          type: 14,
+          value: {
+            fileList: [],
+          },
+        },
+        {
+          type: 15,
+          value: {
+            banner: '',
+            banner1: '',
+            bannerTitle: '设备名称',
+            bannerValue: '设备介绍',
+          },
+        },
+        {
+          type: 16,
+          value: {
+            params: [
+              {
+                "title": "表名",
+                "columns": [],
+                "rows": []
+              }
+            ]
+          },
+        },
+        {
+          type: 17,
+          value: {
+            title: '配套产品',
+            subTitle: 'SUPPORTING PRODUCT',
+            productList: [
+              {
+                "title": "设备名",
+                "img": '',
+                "toLink": []
+              }
+            ]
+          },
+        },
+      ],
+      components: [],
+    }
+  },
+  mounted() {
+    this.initByRoute();
+  },
+  watch: {
+    $route() {
+      this.initByRoute();
+    }
+  },
+  methods: {
+    initByRoute() {
+      selectMenuTree().then(v => {
+        this.options = v.data.find(vv => vv.webMenuId === 4).children
+      })
+      this.props = {checkStrictly: true, value: 'webMenuId', label: 'webMenuName'}
+    },
+    edit(key, e) {
+      this[key] = e.target.innerText
+    },
+    add() {
+      this.addEl = true
+    },
+    save() {
+      updateHwWeb({
+        webCode: this.value,
+        // webJson: JSON.stringify(this.components),
+        webJsonString: JSON.stringify(this.components),
+      }).then(res => {
+        if (res.code == 200) {
+          this.$message({
+            message: '保存成功',
+            type: 'success'
+          });
+        } else {
+          this.$message({
+            message: '保存失败',
+            type: 'error'
+          });
+        }
+      })
+
+    },
+    pageChange(e) {
+      getHwWeb(e).then(res => {
+        this.components = JSON.parse(res?.data?.webJsonString || '[]')
+      })
+    },
+    addItem(e) {
+      this.components.push(JSON.parse(JSON.stringify({
+        type: e,
+        value: this.componentsM.find(v => v.type === e)?.value,
+      })))
+      this.addEl = false
+    },
+    moveUp(k) {
+      if (k > 0) {
+        const item = this.components[k]
+        this.components.splice(k, 1)       // 删除当前位置
+        this.components.splice(k - 1, 0, item) // 插入到上一个位置
+      }
+    },
+    moveDown(k) {
+      if (k < this.components.length - 1) {
+        const item = this.components[k]
+        this.components.splice(k, 1)       // 删除当前位置
+        this.components.splice(k + 1, 0, item) // 插入到下一个位置
+      }
+    },
+  }
+}
+</script>
+<style scoped lang="less">
+.swiper {
+  width: 100%;
+  height: 650px;
+}
+
+.top {
+  position: sticky;
+  top: 0;
+  z-index: 999;
+  width: 100%;
+  height: 50px;
+  background: #fff;
+  box-shadow: 0 6px 4px -4px rgba(0, 0, 0, 0.2);
+  text-align: left;
+
+  .title {
+    line-height: 50px;
+    margin-left: 12px;
+    display: inline-block;
+    margin-right: 12px;
+  }
+}
+
+.container {
+  width: 90%;
+  text-align: left;
+  margin: 0 auto;
+}
+
+.component {
+  text-align: center;
+  position: relative;
+
+
+  .up {
+    position: absolute;
+    right: 50px;
+    top: 10px;
+    cursor: pointer;
+    z-index: 99999;
+  }
+
+
+  .down {
+    position: absolute;
+    right: 30px;
+    top: 10px;
+    cursor: pointer;
+    z-index: 99999;
+  }
+
+
+  .del {
+    position: absolute;
+    right: 10px;
+    top: 10px;
+    cursor: pointer;
+    z-index: 99999;
+  }
+}
+
+.addItem {
+  width: 100%;
+  text-align: center;
+}
+
+</style>