feat:大厅管理接口调试

base-manager-ui/admin/src/pages/basicset/hall/hallmanage/HallManage.vue

 <template>
   <div class="hall-manage">
     <div class="control flex aic jcb mb20">
-      <a-button type="primary" style="margin-right: 10px" @click="handleAdd"
-        >新增大厅</a-button
-      >
+      <a-space size="middle">
+        <a-button type="primary" @click="handleAdd">新增大厅</a-button>
+        <a-button type="danger" @click="handleDelAll">批量删除</a-button>
+      </a-space>
       <div class="search-box">
         <a-input-search
           placeholder="请输入大厅名称名搜索"
@@ -44,37 +45,14 @@
         <span slot="num" slot-scope="text, record, index">{{
           (current - 1) * size + index + 1
         }}</span>
-        <!-- 模块地址 -->
-        <template slot="modelUrl" slot-scope="text">
-          {{ text.modelUrl ? text.modelUrl : "--" }}
-        </template>
-        <!-- 模块图标 -->
-        <template slot="modelIcon" slot-scope="text">
-          <div v-if="text.modelIcon">
-            <!-- <div class="svg-box" v-if="isSvg(text.modelIcon)">
-                <img width="30" height="30" :src="api2 + text.modelIcon" />
-              </div> -->
-            <div class="svg-box">
-              <img width="30" height="30" :src="api2 + text.modelIcon" />
-            </div>
-          </div>
-          <span v-else>--</span>
-        </template>
-        <!-- 排序 -->
-        <template slot="sort" slot-scope="text">
-          {{ text.sort ? text.sort : "--" }}
-        </template>
+
         <!-- 创建时间 -->
         <template slot="createTime" slot-scope="text">
           {{ text.createTime | dateFormat }}
         </template>
-        <!-- 备注 -->
-        <template slot="remark" slot-scope="text">
-          {{ text.remark ? text.remark : "--" }}
-        </template>
         <!-- 操作 -->
         <template slot="action" slot-scope="text">
-          <a-space>
+          <a-space size="middle">
             <a href="javascript:;" class="edit" @click="handleEdit(text)"
               >编辑</a
             >
@@ -85,93 +63,143 @@
         </template>
       </a-table>
     </div>
+    <!-- 新增、修改大厅 -->
+    <AddHall
+      ref="AddHall"
+      :addHallVisile.sync="visible"
+      :title="title"
+      @addSuccess="getHallList"
+    ></AddHall>
   </div>
 </template>
 
 <script>
-const columns = [
-  {
-    title: "序号",
-    dataIndex: "num",
-    width: "65px",
-    scopedSlots: {
-      customRender: "num",
-    },
-  },
-  {
-    title: "模块名称",
-    dataIndex: "modelName",
-    width: "12%",
-  },
-  {
-    title: "模块编码",
-    dataIndex: "modelCode",
-    width: "15%",
-  },
-  {
-    title: "模块地址",
-    width: "20%",
-    scopedSlots: { customRender: "modelUrl" },
-  },
-  {
-    title: "模块图标",
-    scopedSlots: { customRender: "modelIcon" },
-  },
-  {
-    title: "排序",
-    width: "5%",
-    scopedSlots: { customRender: "sort" },
-  },
-  {
-    title: "创建时间",
-    width: "12%",
-    scopedSlots: { customRender: "createTime" },
-  },
-  {
-    title: "备注",
-    scopedSlots: { customRender: "remark" },
-  },
-  {
-    title: "操作",
-    width: "180px",
-    scopedSlots: { customRender: "action" },
-  },
-];
+import { getHallList, delHall } from "@/services/hall";
+import loacl from "@/utils/local";
+import AddHall from "./modal/AddHall.vue";
 export default {
+  components: {
+    AddHall,
+  },
   data() {
+    const columns = [
+      {
+        title: "序号",
+        dataIndex: "num",
+        width: "65px",
+        scopedSlots: {
+          customRender: "num",
+        },
+      },
+      {
+        title: "大厅名称",
+        dataIndex: "hallName",
+      },
+      {
+        title: "地址",
+        dataIndex: "address",
+      },
+      {
+        title: "楼栋",
+        customRender: (text) => {
+          return text.build + "栋" || "--";
+        },
+      },
+      {
+        title: "楼层",
+        customRender: (text) => {
+          return text.floor + "层" || "--";
+        },
+      },
+      {
+        title: "备注",
+        ellipsis: true,
+        customRender: (text) => {
+          return text.remark || "--";
+        },
+      },
+      {
+        title: "创建时间",
+        width: "12%",
+        scopedSlots: { customRender: "createTime" },
+      },
+      {
+        title: "操作",
+        width: "120px",
+        scopedSlots: { customRender: "action" },
+      },
+    ];
     return {
       columns,
       loading: false,
-      title: "新增模块",
+      title: "新增大厅",
       visible: false,
       selectedRowKeys: [],
       current: 1,
       size: 10,
       total: 0,
+      siteId: loacl.getLocal("siteId"),
       pageSizeOptions: ["10", "30", "50", "100"],
       searchValue: "", // 搜索
       dataList: [],
     };
   },
-  created() {},
+  created() {
+    this.getHallList();
+  },
   methods: {
+    // 获取站点大厅列表
+    async getHallList() {
+      this.loading = true;
+      let res = await getHallList({
+        page: this.current,
+        size: this.size,
+        hallName: `%${this.searchValue}%`,
+        siteId: this.siteId,
+      });
+      if (res.data.code == 1) {
+        let { data, total } = res.data.data;
+        if (!data.length && this.current > 1) {
+          this.current -= 1;
+          this.getHallList();
+        }
+        this.total = total;
+        this.dataList = data;
+      }
+      this.loading = false;
+    },
     // 新增
     handleAdd() {
-      console.log(11);
+      this.title = "新增大厅";
+      this.$refs.AddHall.onAdd();
+      this.visible = true;
     },
     // 搜索
     onSearch() {
-      console.log(11);
+      this.current = 1;
+      this.selectedRowKeys = [];
+      this.getHallList();
     },
     // 勾选表格
     onSelectChange(keys) {
       this.selectedRowKeys = keys;
     },
+    // 批量删除
+    handleDelAll() {
+      if (!this.selectedRowKeys.length) {
+        this.$message.warning("请先勾选数据");
+        return;
+      }
+      let ids = this.selectedRowKeys.join(",");
+      this.handleDel(ids);
+    },
     // 编辑
-    handleEdit() {
-      console.log(22);
+    handleEdit(row) {
+      this.title = "编辑大厅";
+      this.$refs.AddHall.onEdit(row);
+      this.visible = true;
     },
-    handleDel() {
+    handleDel(id) {
       let _this = this;
       _this.$confirm({
         title: "系统提示",
@@ -183,13 +211,29 @@ export default {
         icon: "exclamation-circle",
         maskClosable: true,
         async onOk() {
-          console.log(22);
+          let res = await delHall({ id });
+          let { code, msg } = res.data;
+          if (code == 1) {
+            _this.$message.success(msg);
+            _this.getHallList();
+          }
         },
         onCancel() {
           console.log("Cancel");
         },
       });
     },
+    // 翻页
+    handleChange(cur) {
+      this.current = cur;
+      this.getHallList();
+    },
+    // 改变每页显示数量
+    showSizeChange(cur, size) {
+      this.current = cur;
+      this.size = size;
+      this.getHallList();
+    },
   },
 };
 </script>

base-manager-ui/admin/src/pages/basicset/hall/hallmanage/modal/AddHall.vue

+<template>
+  <div>
+    <a-modal
+      v-model="Visible"
+      :maskClosable="false"
+      :title="title"
+      @cancel="handleClose"
+      destroyOnClose
+    >
+      <template slot="footer">
+        <a-button @click="handleReset">重置</a-button>
+        <a-button type="primary" @click="handleOk">确定</a-button>
+      </template>
+      <a-form-model
+        ref="form"
+        :model="form"
+        :rules="rules"
+        :label-col="{ span: 4 }"
+        :wrapper-col="{ span: 20 }"
+      >
+        <a-form-model-item label="大厅名称" prop="hallName">
+          <a-input v-model="form.hallName" placeholder="请输入大厅名称" />
+        </a-form-model-item>
+        <a-form-model-item label="楼栋" prop="build">
+          <a-input-number v-model="form.build" :min="1" />
+        </a-form-model-item>
+        <a-form-model-item label="楼层" prop="floor">
+          <a-input-number v-model="form.floor" :min="1" />
+        </a-form-model-item>
+        <a-form-model-item label="地址" prop="address">
+          <a-textarea
+            :autoSize="{ minRows: 4, maxRows: 4 }"
+            placeholder="请输入地址"
+            allow-clear
+            v-model="form.address"
+          />
+        </a-form-model-item>
+        <a-form-model-item label="备注" prop="remark">
+          <a-textarea
+            :autoSize="{ minRows: 4, maxRows: 4 }"
+            placeholder="请输入备注"
+            allow-clear
+            v-model="form.remark"
+          />
+        </a-form-model-item>
+      </a-form-model>
+    </a-modal>
+  </div>
+</template>
+  
+  <script>
+import { saveHall } from "@/services/hall";
+import loacl from "@/utils/local";
+export default {
+  props: {
+    title: {
+      require: true,
+      type: String,
+      default: "",
+    },
+    addHallVisile: {
+      type: Boolean,
+      require: true,
+      default: false,
+    },
+  },
+  components: {},
+  data() {
+    return {
+      form: {
+        siteId: loacl.getLocal("siteId"), // 站点id
+        hallName: "", // 大厅名称
+        address: "", // 地址
+        floor: 1, // 楼层
+        build: 1, // 楼栋
+        remark: "", // 备注
+      },
+      rules: {
+        hallName: [
+          { required: true, message: "请输入大厅名称", trigger: "blur" },
+        ],
+      },
+    };
+  },
+  computed: {
+    Visible: {
+      get() {
+        return this.addHallVisile;
+      },
+      set(val) {
+        this.$emit("update:addHallVisile", val);
+      },
+    },
+  },
+  methods: {
+    // 新增
+    onAdd() {
+      Object.assign(this.form, this.$options.data().form);
+      this.form.id && this.$delete(this.form, "id");
+    },
+    // 编辑
+    onEdit(data) {
+      this.form = { ...data };
+    },
+    // 关闭弹窗
+    handleClose() {
+      this.$refs.form.resetFields();
+      console.log(this.form);
+      this.Visible = false;
+    },
+    // 保存
+    handleOk() {
+      this.$refs.form.validate(async (valid) => {
+        if (valid) {
+          let res = await saveHall(this.form);
+          let { code, msg } = res.data;
+          if (code == 1) {
+            this.$message.success(msg);
+            this.$emit("addSuccess");
+            this.handleClose();
+          }
+        }
+      });
+    },
+    // 重置
+    handleReset() {
+      this.$refs.form.resetFields();
+    },
+  },
+};
+</script>
+  
+  <style lang="less" scoped>
+.ant-input-number {
+  width: 100%;
+}
+</style>
\ No newline at end of file

base-manager-ui/admin/src/services/hall.js

@@ -3,27 +3,27 @@ import { hall, windowHall } from "@/services/basicsetApi";
 import { request, METHOD } from "@/utils/request";
 
 // 获取站点大厅信息
-export const getHallList = () => {
+export const getHallList = (data) => {
   return request(hall.list, METHOD.POST, data);
 };
 
 // 查看站点大厅信息
-export const getHallInfo = () => {
+export const getHallInfo = (data) => {
   return request(hall.info, METHOD.get, data);
 };
 
 // 保存更新站点大厅
-export const saveHall = () => {
+export const saveHall = (data) => {
   return request(hall.save, METHOD.POST, data);
 };
 
 // 删除站点大厅
-export const delHall = () => {
+export const delHall = (data) => {
   return request(hall.delete, METHOD.get, data);
 };
 
 //  根据大厅查询所属业务列表
-export const getHallWindow = () => {
+export const getHallWindow = (data) => {
   return request(hall.window, METHOD.POST, data);
 };
 
@@ -32,21 +32,21 @@ export const getHallWindow = () => {
  */
 
 // 获取大厅窗口列表
-export const getWindowHallList = () => {
+export const getWindowHallList = (data) => {
   return request(windowHall.list, METHOD.POST, data);
 };
 
 // 查看大厅窗口
-export const getWindowHallInfo = () => {
+export const getWindowHallInfo = (data) => {
   return request(windowHall.info, METHOD.get, data);
 };
 
 // 保存大厅窗口
-export const saveWindowHall = () => {
+export const saveWindowHall = (data) => {
   return request(windowHall.save, METHOD.POST, data);
 };
 
 // 删除大厅窗口
-export const delWindowHall = () => {
+export const delWindowHall = (data) => {
   return request(windowHall.delete, METHOD.get, data);
 };