From 1cde61422ed0e1eaefceb6521ccfc57e1583deb3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=AE=B8=E5=AE=8F=E6=9D=B0?= <1943105267@qq.com>
Date: Sat, 25 Nov 2023 14:09:32 +0800
Subject: [PATCH] =?UTF-8?q?=E6=88=91=E7=9A=84=E7=BD=91=E7=BB=9C=E3=80=81?=
 =?UTF-8?q?=E6=88=91=E7=9A=84=E4=BF=A1=E6=81=AF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.vue                                   |  20 +--
 src/assets/icons/svg/myData.svg               |   1 +
 src/assets/styles/general.scss                |  14 +-
 src/layout/components/AppMain.vue             |  14 +-
 src/views/index.vue                           |  11 +-
 src/views/netEwm/MyShanghu/index.vue          | 114 ++++++++++++
 src/views/netEwm/net/index.vue                |   8 +-
 .../netEwm/poster/components/MyTable.vue      | 167 ++++++++++++++++++
 src/views/netEwm/poster/index.vue             |  18 +-
 src/views/netEwm/shanghu/index.vue            |  13 +-
 10 files changed, 338 insertions(+), 42 deletions(-)
 create mode 100644 src/assets/icons/svg/myData.svg
 create mode 100644 src/views/netEwm/MyShanghu/index.vue
 create mode 100644 src/views/netEwm/poster/components/MyTable.vue

diff --git a/src/App.vue b/src/App.vue
index cc7d72a..90d4059 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -7,7 +7,7 @@
 
 <script>
 import ThemePicker from "@/components/ThemePicker";
-import autofit from "autofit.js";
+// import autofit from "autofit.js";
 export default {
   name: "App",
   mounted() {
@@ -16,15 +16,15 @@ export default {
     // var screenHeight = window.innerHeight;
     // console.log(screenHeight);
     // 初始化(适配)
-    autofit.init(
-      {
-        dh: 931,
-        dw: 1920,
-        el: "#app",
-        resize: true,
-      },
-      false
-    );
+    // autofit.init(
+    //   {
+    //     dh: 931,
+    //     dw: 1920,
+    //     el: "#app",
+    //     resize: true,
+    //   },
+    //   false
+    // );
   },
   components: { ThemePicker },
   metaInfo() {
diff --git a/src/assets/icons/svg/myData.svg b/src/assets/icons/svg/myData.svg
new file mode 100644
index 0000000..edc0344
--- /dev/null
+++ b/src/assets/icons/svg/myData.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1700889299657" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2737" xmlns:xlink="http://www.w3.org/1999/xlink" width="128" height="128"><path d="M930.133333 1024H93.866667c-25.6 0-42.666667-17.066667-42.666667-42.666667v-102.4c0-136.533333 110.933333-251.733333 251.733333-251.733333h418.133334c136.533333 0 251.733333 110.933333 251.733333 251.733333V981.333333c0 25.6-21.333333 42.666667-42.666667 42.666667zM136.533333 938.666667h750.933334v-59.733334c0-89.6-72.533333-166.4-166.4-166.4H302.933333c-89.6 0-166.4 72.533333-166.4 166.4V938.666667zM512 503.466667c-136.533333 0-251.733333-110.933333-251.733333-251.733334S375.466667 0 512 0s251.733333 110.933333 251.733333 251.733333-115.2 251.733333-251.733333 251.733334zM512 85.333333C422.4 85.333333 345.6 157.866667 345.6 251.733333 345.6 341.333333 422.4 418.133333 512 418.133333s166.4-72.533333 166.4-166.4S601.6 85.333333 512 85.333333z"  p-id="2738"></path></svg>
\ No newline at end of file
diff --git a/src/assets/styles/general.scss b/src/assets/styles/general.scss
index 8fb7428..3f97905 100644
--- a/src/assets/styles/general.scss
+++ b/src/assets/styles/general.scss
@@ -1,7 +1,7 @@
 @import "./element-variables.scss";
-.fixed-header {
-  padding-right: 0 !important;
-}
+// .fixed-header {
+//   padding-right: 0 !important;
+// }
 .el-button,
 .el-input__inner,
 .el-textarea__inner,
@@ -31,9 +31,9 @@
     font-weight: bold;
   }
   .info-container {
-    .avatar {
-      height: 200px;
-      width: 400px;
-    }
   }
 }
+.avatar {
+  height: 200px;
+  width: 400px;
+}
diff --git a/src/layout/components/AppMain.vue b/src/layout/components/AppMain.vue
index a25c562..6f32c79 100644
--- a/src/layout/components/AppMain.vue
+++ b/src/layout/components/AppMain.vue
@@ -10,20 +10,20 @@
 </template>
 
 <script>
-import iframeToggle from "./IframeToggle/index"
+import iframeToggle from "./IframeToggle/index";
 
 export default {
-  name: 'AppMain',
+  name: "AppMain",
   components: { iframeToggle },
   computed: {
     cachedViews() {
-      return this.$store.state.tagsView.cachedViews
+      return this.$store.state.tagsView.cachedViews;
     },
     key() {
-      return this.$route.path
-    }
-  }
-}
+      return this.$route.path;
+    },
+  },
+};
 </script>
 
 <style lang="scss" scoped>
diff --git a/src/views/index.vue b/src/views/index.vue
index eaf971c..3ec6f3b 100644
--- a/src/views/index.vue
+++ b/src/views/index.vue
@@ -3,13 +3,22 @@
 </template>
 
 <script>
+import { mapGetters } from "vuex";
 export default {
   name: "Index",
   data() {
     return {};
   },
+  computed: {
+    ...mapGetters(["roles"]),
+  },
   created() {
-    this.$router.push({ path: "/shanghu" });
+    let index = this.roles.findIndex((item) => item == "common");
+    if (index > -1) {
+      this.$router.push({ path: "/net" });
+    } else {
+      this.$router.push({ path: "/shanghu" });
+    }
   },
 };
 </script>
diff --git a/src/views/netEwm/MyShanghu/index.vue b/src/views/netEwm/MyShanghu/index.vue
new file mode 100644
index 0000000..259d330
--- /dev/null
+++ b/src/views/netEwm/MyShanghu/index.vue
@@ -0,0 +1,114 @@
+<template>
+  <div class="app-container">
+    <el-form
+      ref="form"
+      :model="form"
+      :rules="rules"
+      label-width="80px"
+      class="my-form"
+    >
+      <el-form-item label="商户名称" prop="posName">
+        <el-input v-model="form.posName" placeholder="请输入商户名称" />
+      </el-form-item>
+      <el-form-item label="联系人" prop="linkMan">
+        <el-input v-model="form.linkMan" placeholder="请输入联系人" />
+      </el-form-item>
+      <el-form-item label="手机号" prop="phoneNumber">
+        <el-input v-model="form.phoneNumber" placeholder="请输入手机号" />
+      </el-form-item>
+      <el-form-item label="城市" prop="city">
+        <el-input v-model="form.city" placeholder="请输入城市" />
+      </el-form-item>
+      <el-form-item label="地址信息" prop="address">
+        <el-input
+          type="textarea"
+          v-model="form.address"
+          placeholder="请输入地址信息"
+          :rows="4"
+        />
+      </el-form-item>
+      <el-form-item label="视频广告">
+        <div class="info-container">
+          <video
+            :src="form.videoPath"
+            class="avatar"
+            controls="controls"
+          ></video>
+        </div>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" size="small" @click="submitForm"
+          >提交</el-button
+        >
+      </el-form-item>
+    </el-form>
+  </div>
+</template>
+
+<script>
+import { getShanghu, updateShanghu, addShanghu } from "@/api/netEwm/shanghu";
+import { getPoster } from "@/api/netEwm/poster";
+export default {
+  data() {
+    return {
+      baseUrl: process.env.VUE_APP_BASE_API,
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+        posName: [
+          { required: true, message: "商户名称不能为空", trigger: "blur" },
+        ],
+        phoneNumber: [
+          { required: true, message: "手机号不能为空", trigger: "blur" },
+        ],
+        linkMan: [
+          { required: true, message: "联系人不能为空", trigger: "blur" },
+        ],
+        city: [{ required: true, message: "城市不能为空", trigger: "blur" }],
+        address: [
+          { required: true, message: "地址信息不能为空", trigger: "blur" },
+        ],
+      },
+    };
+  },
+  created() {
+    this.getInfo();
+  },
+  methods: {
+    getInfo() {
+      getShanghu(2).then((response) => {
+        if (response.data.posterId) {
+          getPoster(response.data.posterId).then((info) => {
+            let url = {
+              videoPath: this.baseUrl + info.data.videoPath,
+            };
+            this.form = { ...response.data, ...url };
+          });
+        }
+      });
+    },
+    /** 提交按钮 */
+    submitForm() {
+      this.$refs["form"].validate((valid) => {
+        if (valid) {
+          if (this.form.id != null) {
+            updateShanghu(this.form).then((response) => {
+              this.$modal.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+            });
+          }
+        }
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.my-form {
+  margin: auto;
+  width: 1000px;
+}
+</style>
diff --git a/src/views/netEwm/net/index.vue b/src/views/netEwm/net/index.vue
index 0c4167d..5059b39 100644
--- a/src/views/netEwm/net/index.vue
+++ b/src/views/netEwm/net/index.vue
@@ -90,7 +90,7 @@
     >
       <el-table-column type="selection" width="55" align="center" />
 
-      <el-table-column label="网络名称" align="center" prop="netName" />
+      <!-- <el-table-column label="网络名称" align="center" prop="netName" /> -->
       <el-table-column label="wifi名称" align="center" prop="wifiName" />
       <el-table-column label="wifi密码" align="center" prop="wifiPass" />
       <el-table-column
@@ -130,8 +130,11 @@
     <!-- 添加或修改网络对话框 -->
     <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
       <el-form ref="form" :model="form" :rules="rules" label-width="80px">
-        <el-form-item label="网络名称" prop="netName">
+        <!-- <el-form-item label="网络名称" prop="netName">
           <el-input v-model="form.netName" placeholder="请输入网络名称" />
+        </el-form-item> -->
+        <el-form-item label="商户id" prop="shanghuId">
+          <el-input v-model="form.shanghuId" placeholder="请输入商户id" />
         </el-form-item>
         <el-form-item label="wifi名称" prop="wifiName">
           <el-input v-model="form.wifiName" placeholder="请输入wifi名称" />
@@ -207,6 +210,7 @@ export default {
     reset() {
       this.form = {
         id: null,
+        shanghuId: null,
         netName: null,
         wifiName: null,
         wifiPass: null,
diff --git a/src/views/netEwm/poster/components/MyTable.vue b/src/views/netEwm/poster/components/MyTable.vue
new file mode 100644
index 0000000..e2350b7
--- /dev/null
+++ b/src/views/netEwm/poster/components/MyTable.vue
@@ -0,0 +1,167 @@
+<template>
+  <!-- 广告分配 -->
+  <el-dialog
+    title="批量分配广告"
+    :visible.sync="fpShow"
+    width="1200px"
+    append-to-body
+  >
+    <div class="fp-table app-container" ref="appMain">
+      <div ref="search">
+        <el-form
+          :model="queryParams"
+          ref="queryForm"
+          size="small"
+          :inline="true"
+          label-width="68px"
+        >
+          <el-form-item label="商户名称" prop="posName">
+            <el-input
+              v-model="queryParams.posName"
+              placeholder="请输入商户名称"
+              clearable
+              @keyup.enter.native="handleQuery"
+            />
+          </el-form-item>
+          <el-form-item label="联系人" prop="linkMan">
+            <el-input
+              v-model="queryParams.linkMan"
+              placeholder="请输入联系人"
+              clearable
+              @keyup.enter.native="handleQuery"
+            />
+          </el-form-item>
+          <el-form-item>
+            <el-button
+              type="primary"
+              icon="el-icon-search"
+              size="mini"
+              @click="handleQuery"
+              >搜索</el-button
+            >
+            <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
+              >重置</el-button
+            >
+            <el-button
+              type="warning"
+              icon="el-icon-document-copy"
+              size="mini"
+              @click="handleMultiplefp"
+              :disabled="multiple"
+              >批量分配</el-button
+            >
+          </el-form-item>
+        </el-form>
+      </div>
+      <el-table
+        v-loading="loading"
+        :data="shanghuList"
+        @selection-change="handleSelectionChange"
+        :height="tableHeigth"
+      >
+        <el-table-column type="selection" width="55" align="center" />
+        <el-table-column label="商户名称" align="center" prop="posName" />
+        <el-table-column label="联系人" align="center" prop="linkMan" />
+        <el-table-column label="手机号" align="center" prop="phoneNumber" />
+        <el-table-column label="城市" align="center" prop="city" />
+      </el-table>
+      <div ref="pagination">
+        <pagination
+          v-show="total > 0"
+          :total="total"
+          :page.sync="queryParams.pageNum"
+          :limit.sync="queryParams.pageSize"
+          @pagination="getList"
+        />
+      </div>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { listShanghu } from "@/api/netEwm/shanghu";
+import { batchAllocation } from "@/api/netEwm/poster";
+export default {
+  data() {
+    return {
+      //分配弹出层
+      fpShow: false,
+      loading: false,
+      shanghuList: [],
+      total: 0,
+      tableHeigth: 0,
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        posName: null,
+        linkMan: null,
+        city: null,
+      },
+      // 非多个禁用
+      multiple: true,
+      ids: [],
+      posterId: null,
+    };
+  },
+  methods: {
+    openDialog(id) {
+      this.posterId = id;
+      this.getHeigth();
+      this.getList();
+    },
+    /**适配高度 */
+    getHeigth() {
+      this.fpShow = true;
+      let _this = this;
+      this.$nextTick(() => {
+        let total = this.$refs.appMain.clientHeight;
+        let search = this.$refs.search.clientHeight;
+        _this.tableHeigth = total - search - 40;
+      });
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map((item) => item.id);
+      this.multiple = !selection.length;
+    },
+    //批量分配广告
+    handleMultiplefp() {
+      let data = {
+        posterId: this.posterId,
+        shanghuIds: this.ids,
+      };
+      batchAllocation(data).then((res) => {
+        this.$modal.msgSuccess("分配成功");
+      });
+    },
+    /** 查询商户列表 */
+    getList() {
+      this.loading = true;
+      listShanghu(this.queryParams).then((response) => {
+        this.shanghuList = response.rows;
+        this.total = response.total;
+        this.loading = false;
+      });
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.app-container {
+  padding: 0 !important;
+}
+.fp-table {
+  height: 550px;
+}
+</style>
diff --git a/src/views/netEwm/poster/index.vue b/src/views/netEwm/poster/index.vue
index 0108457..0a5dc78 100644
--- a/src/views/netEwm/poster/index.vue
+++ b/src/views/netEwm/poster/index.vue
@@ -197,9 +197,7 @@
         <el-button @click="cancel">取 消</el-button>
       </div>
     </el-dialog>
-    <!-- 广告分配 -->
-    <el-dialog :title="fpTitle" :visible.sync="fpShow" width="1200px">
-    </el-dialog>
+    <my-table ref="MyTable"></my-table>
   </div>
 </template>
 
@@ -211,15 +209,14 @@ import {
   addPoster,
   updatePoster,
 } from "@/api/netEwm/poster";
-
+import MyTable from "./components/MyTable.vue";
 export default {
+  components: {
+    MyTable,
+  },
   name: "Poster",
   data() {
     return {
-      //分配弹出层
-      fpShow: false,
-      //分配标题
-      fpTitle: "",
       // 遮罩层
       loading: true,
       // 选中数组
@@ -270,9 +267,8 @@ export default {
   },
   methods: {
     /**批量分配广告给商户 */
-    handleFp() {
-      this.fpTitle = "批量分配广告";
-      this.fpShow = true;
+    handleFp(row) {
+      this.$refs.MyTable.openDialog(row.id);
     },
     /** 查询广告列表 */
     getList() {
diff --git a/src/views/netEwm/shanghu/index.vue b/src/views/netEwm/shanghu/index.vue
index 87c27c0..3794192 100644
--- a/src/views/netEwm/shanghu/index.vue
+++ b/src/views/netEwm/shanghu/index.vue
@@ -212,7 +212,7 @@
           form.address
         }}</el-descriptions-item>
       </el-descriptions>
-      <div class="my-info">
+      <div class="my-info" v-if="form.posterId">
         <div class="cell-info">商户广告</div>
         <div class="info-container">
           <video
@@ -374,11 +374,16 @@ export default {
       getShanghu(id).then((response) => {
         this.form = response.data;
         if (type == "info") {
-          getPoster(this.form.posterId).then((info) => {
-            this.form.videoPath = this.baseUrl + info.data.videoPath;
+          if (this.form.posterId) {
+            getPoster(this.form.posterId).then((info) => {
+              this.form.videoPath = this.baseUrl + info.data.videoPath;
+              this.openInfo = true;
+              this.titleInfo = "查看商户详细信息";
+            });
+          } else {
             this.openInfo = true;
             this.titleInfo = "查看商户详细信息";
-          });
+          }
         } else {
           this.open = true;
           this.title = "修改商户";