区域管理和问题列表

web/src/App.vue

@@ -24,4 +24,19 @@ export default {
 .el-button{
   font-weight: 400 !important;
 }
+.ml10 {
+  margin-left: 10px;
+}
+.mr10 {
+  margin-right: 10px;
+}
+.mt10 {
+  margin-top: 10px;
+}
+.mb10 {
+  margin-bottom: 10px;
+}
+.ml0 {
+  margin-left: 0 !important;
+}
 </style>

web/src/api/organization.js

@@ -9,11 +9,11 @@ import service from '@/utils/request'
 // @Success 200 {string} string "{"success":true,"data":{},"msg":"获取成功"}"
 // @Router /organization/createOrganization [post]
 export const createOrganization = (data) => {
-  return service({
-    url: '/organization/createOrganization',
-    method: 'post',
-    data
-  })
+    return service({
+        url: '/organization/createOrganization',
+        method: 'post',
+        data
+    })
 }
 
 // @Tags Organization
@@ -25,11 +25,11 @@ export const createOrganization = (data) => {
 // @Success 200 {string} string "{"success":true,"data":{},"msg":"删除成功"}"
 // @Router /organization/deleteOrganization [delete]
 export const deleteOrganization = (data) => {
-  return service({
-    url: '/organization/deleteOrganization',
-    method: 'delete',
-    data
-  })
+    return service({
+        url: '/organization/deleteOrganization',
+        method: 'delete',
+        data
+    })
 }
 
 // @Tags Organization
@@ -41,11 +41,11 @@ export const deleteOrganization = (data) => {
 // @Success 200 {string} string "{"success":true,"data":{},"msg":"删除成功"}"
 // @Router /organization/deleteOrganization [delete]
 export const deleteOrganizationByIds = (data) => {
-  return service({
-    url: '/organization/deleteOrganizationByIds',
-    method: 'delete',
-    data
-  })
+    return service({
+        url: '/organization/deleteOrganizationByIds',
+        method: 'delete',
+        data
+    })
 }
 
 // @Tags Organization
@@ -57,11 +57,11 @@ export const deleteOrganizationByIds = (data) => {
 // @Success 200 {string} string "{"success":true,"data":{},"msg":"更新成功"}"
 // @Router /organization/updateOrganization [put]
 export const updateOrganization = (data) => {
-  return service({
-    url: '/organization/updateOrganization',
-    method: 'put',
-    data
-  })
+    return service({
+        url: '/organization/updateOrganization',
+        method: 'put',
+        data
+    })
 }
 
 // @Tags Organization
@@ -73,11 +73,11 @@ export const updateOrganization = (data) => {
 // @Success 200 {string} string "{"success":true,"data":{},"msg":"查询成功"}"
 // @Router /organization/findOrganization [get]
 export const findOrganization = (params) => {
-  return service({
-    url: '/organization/findOrganizationP',
-    method: 'get',
-    params
-  })
+    return service({
+        url: '/organization/findOrganizationP',
+        method: 'get',
+        params
+    })
 }
 
 // @Tags Organization
@@ -89,9 +89,19 @@ export const findOrganization = (params) => {
 // @Success 200 {string} string "{"success":true,"data":{},"msg":"获取成功"}"
 // @Router /organization/getOrganizationList [get]
 export const getOrganizationList = (params) => {
-  return service({
-    url: '/organization/getOrganizationList',
-    method: 'get',
-    params
-  })
+    return service({
+        url: '/organization/getOrganizationList',
+        method: 'get',
+        params
+    })
 }
+
+
+
+export const areaList = (params) => {
+    return service({
+        url: '/organization/findOrganizationTree',
+        method: 'get',
+        params
+    })
+}

web/src/view/login/index.vue

@@ -42,15 +42,16 @@
                 :src="picPath"
                 alt="请输入验证码"
                 @click="loginVerify()"
-              >
+              />
             </div>
           </el-form-item>
           <el-form-item>
             <el-button
               type="primary"
-              style="width: 46%;margin-left:8%"
+              style="width: 46%; margin-left: 8%"
               @click="submitForm"
-            >登 录</el-button>
+              >登 录</el-button
+            >
           </el-form-item>
         </el-form>
       </div>
@@ -60,95 +61,95 @@
 </template>
 
 <script>
-import { mapActions } from 'vuex'
-import { captcha } from '@/api/user'
-import { checkDB } from '@/api/initdb'
+import { mapActions } from "vuex";
+import { captcha } from "@/api/user";
+import { checkDB } from "@/api/initdb";
 export default {
-  name: 'Login',
+  name: "Login",
   data() {
     const checkUsername = (rule, value, callback) => {
       if (value.length < 5) {
-        return callback(new Error('请输入正确的用户名'))
+        return callback(new Error("请输入正确的用户名"));
       } else {
-        callback()
+        callback();
       }
-    }
+    };
     const checkPassword = (rule, value, callback) => {
       if (value.length < 6) {
-        return callback(new Error('请输入正确的密码'))
+        return callback(new Error("请输入正确的密码"));
       } else {
-        callback()
+        callback();
       }
-    }
+    };
     return {
       curYear: 0,
-      lock: 'lock',
+      lock: "lock",
       loginForm: {
-        username: '',
-        password: '',
-        captcha: '',
-        captchaId: ''
+        username: "",
+        password: "",
+        captcha: "",
+        captchaId: "",
       },
       rules: {
-        username: [{ validator: checkUsername, trigger: 'blur' }],
-        password: [{ validator: checkPassword, trigger: 'blur' }]
+        username: [{ validator: checkUsername, trigger: "blur" }],
+        password: [{ validator: checkPassword, trigger: "blur" }],
       },
-      logVerify: '',
-      picPath: ''
-    }
+      logVerify: "",
+      picPath: "",
+    };
   },
   created() {
-    this.loginVerify()
-    this.curYear = new Date().getFullYear()
+    this.loginVerify();
+    this.curYear = new Date().getFullYear();
   },
   methods: {
-    ...mapActions('user', ['LoginIn']),
+    ...mapActions("user", ["LoginIn"]),
     async checkInit() {
-      const res = await checkDB()
+      const res = await checkDB();
       if (res.code === 0) {
         if (res.data?.needInit) {
-          this.$store.commit('user/NeedInit')
-          this.$router.push({ name: 'Init' })
+          this.$store.commit("user/NeedInit");
+          this.$router.push({ name: "Init" });
         } else {
           this.$message({
-            type: 'info',
-            message: '已配置数据库信息，无法初始化'
-          })
+            type: "info",
+            message: "已配置数据库信息，无法初始化",
+          });
         }
       }
     },
     async login() {
-      return await this.LoginIn(this.loginForm)
+      return await this.LoginIn(this.loginForm);
     },
     async submitForm() {
-      this.$refs.loginForm.validate(async(v) => {
+      this.$refs.loginForm.validate(async (v) => {
         if (v) {
-          const flag = await this.login()
+          const flag = await this.login();
           if (!flag) {
-            this.loginVerify()
+            this.loginVerify();
           }
         } else {
           this.$message({
-            type: 'error',
-            message: '请正确填写登录信息',
-            showClose: true
-          })
-          this.loginVerify()
-          return false
+            type: "error",
+            message: "请正确填写登录信息",
+            showClose: true,
+          });
+          this.loginVerify();
+          return false;
         }
-      })
+      });
     },
     changeLock() {
-      this.lock = this.lock === 'lock' ? 'unlock' : 'lock'
+      this.lock = this.lock === "lock" ? "unlock" : "lock";
     },
     loginVerify() {
       captcha({}).then((ele) => {
-        this.picPath = ele.data.picPath
-        this.loginForm.captchaId = ele.data.captchaId
-      })
-    }
-  }
-}
+        this.picPath = ele.data.picPath;
+        this.loginForm.captchaId = ele.data.captchaId;
+      });
+    },
+  },
+};
 </script>
 
 <style lang="scss" scoped>

web/src/view/organization/organization.vue

@@ -2,17 +2,44 @@
   <div>
     <div class="search-term">
       <el-form :inline="true" :model="searchInfo" class="demo-form-inline">
-        <el-form-item>
-          <el-button size="mini" type="primary" icon="el-icon-search" @click="onSubmit">查询</el-button>
-          <el-button size="mini" type="primary" icon="el-icon-plus" @click="openDialog">新增</el-button>
-          <el-popover v-model:visible="deleteVisible" placement="top" width="160">
+        <el-form-item class="disFlex">
+          <el-input v-model="searchID" class="lh30 mr10"></el-input>
+          <el-button
+            size="mini"
+            type="primary"
+            icon="el-icon-search"
+            @click="onSubmit"
+            >查询</el-button
+          >
+          <el-button
+            size="mini"
+            type="primary"
+            icon="el-icon-plus"
+            @click="openDialog"
+            >新增</el-button
+          >
+          <el-popover
+            v-model:visible="deleteVisible"
+            placement="top"
+            width="160"
+          >
             <p>确定要删除吗？</p>
             <div style="text-align: right; margin: 0">
-              <el-button size="mini" type="text" @click="deleteVisible = false">取消</el-button>
-              <el-button size="mini" type="primary" @click="onDelete">确定</el-button>
+              <el-button size="mini" type="text" @click="deleteVisible = false"
+                >取消</el-button
+              >
+              <el-button size="mini" type="primary" @click="onDelete"
+                >确定</el-button
+              >
             </div>
             <template #reference>
-              <el-button icon="el-icon-delete" size="mini" type="danger" style="margin-left: 10px;">批量删除</el-button>
+              <el-button
+                icon="el-icon-delete"
+                size="mini"
+                type="danger"
+                style="margin-left: 10px"
+                >批量删除</el-button
+              >
             </template>
           </el-popover>
         </el-form-item>
@@ -31,12 +58,25 @@
       <el-table-column label="区域编码" prop="code" />
       <el-table-column label="区域名称" prop="name" />
       <el-table-column label="上级区域" prop="parentcode" />
-      <el-table-column label="optimistic字段" prop="optimistic" />
+      <!-- <el-table-column label="optimistic字段" prop="optimistic" /> -->
       <el-table-column label="中心点" prop="postition" />
       <el-table-column label="按钮组">
         <template #default="scope">
-          <el-button size="small" type="primary" icon="el-icon-edit" class="table-button" @click="updateOrganization(scope.row)">变更</el-button>
-          <el-button type="danger" icon="el-icon-delete" size="mini" @click="deleteRow(scope.row)">删除</el-button>
+          <el-button
+            size="small"
+            type="primary"
+            icon="el-icon-edit"
+            class="table-button"
+            @click="updateOrganization(scope.row)"
+            >变更</el-button
+          >
+          <el-button
+            type="danger"
+            icon="el-icon-delete"
+            size="mini"
+            @click="deleteRow(scope.row)"
+            >删除</el-button
+          >
         </template>
       </el-table-column>
     </el-table>
@@ -45,24 +85,45 @@
       :current-page="page"
       :page-size="pageSize"
       :page-sizes="[10, 30, 50, 100]"
-      :style="{float:'right',padding:'20px'}"
+      :style="{ float: 'right', padding: '20px' }"
       :total="total"
       @current-change="handleCurrentChange"
       @size-change="handleSizeChange"
     />
-    <el-dialog v-model="dialogFormVisible" :before-close="closeDialog" title="弹窗操作">
-      <el-form :model="formData" label-position="right" label-width="80px">
-        <el-form-item label="CODE字段:">
+    <el-dialog
+      v-model="dialogFormVisible"
+      :before-close="closeDialog"
+      title="弹窗操作"
+    >
+      <el-form
+        ref="ruleFormRef"
+        :model="formData"
+        label-postition="right"
+        label-width="100px"
+        :rules="rules"
+      >
+        <el-form-item label="区域编码:" prop="code">
           <el-input v-model="formData.code" clearable placeholder="请输入" />
         </el-form-item>
-        <el-form-item label="NAME字段:">
+        <el-form-item label="区域名称:" prop="name">
           <el-input v-model="formData.name" clearable placeholder="请输入" />
         </el-form-item>
-        <el-form-item label="PARENTCODE字段:">
-          <el-input v-model="formData.parentcode" clearable placeholder="请输入" />
+        <el-form-item label="上级编码:" prop="parentcode">
+          <el-input
+            v-model="formData.parentcode"
+            clearable
+            placeholder="请输入"
+          />
         </el-form-item>
-        <el-form-item label="optimistic字段:">
+        <!-- <el-form-item label="optimistic字段:">
           <el-input v-model.number="formData.optimistic" clearable placeholder="请输入" />
+        </el-form-item> -->
+        <el-form-item label="中心点:" prop="postition">
+          <!-- <el-input @click="choosePoint" v-model="formData.postition" disabled placeholder="选择中心点坐标"  /> -->
+          <el-button type="primary" size="mini" @click="choosePoint"
+            >去地图选择</el-button
+          >
+          <span class="ml10" prop="postition">{{ formData.postition }}</span>
         </el-form-item>
       </el-form>
       <template #footer>
@@ -72,6 +133,19 @@
         </div>
       </template>
     </el-dialog>
+
+    <!-- 地图弹框开始 -->
+    <el-dialog v-model="dialogMap" title="弹窗操作" width="70%" top="2vh">
+      <iframe
+        class="map"
+        id="mapPage"
+        frameborder="0"
+        src="https://apis.map.qq.com/tools/locpicker?search=1&type=1&key=DRGBZ-DMJE3-6SA3I-3ILVP-GMXPT-J3FLR&referer=文明城市创业管理系统"
+      >
+      </iframe>
+    </el-dialog>
+
+    <!-- 地图弹框结束 -->
   </div>
 </template>
 
@@ -82,134 +156,226 @@ import {
   deleteOrganizationByIds,
   updateOrganization,
   findOrganization,
-  getOrganizationList
-} from '@/api/organization' //  此处请自行替换地址
-import infoList from '@/mixins/infoList'
+  getOrganizationList,
+} from "@/api/organization"; //  此处请自行替换地址
+import infoList from "@/mixins/infoList";
+
 export default {
-  name: 'Organization',
+  name: "Organization",
   mixins: [infoList],
+
   data() {
     return {
+      // 地图弹框
+      dialogMap: false,
+      searchID: "",
+
       listApi: getOrganizationList,
       dialogFormVisible: false,
-      type: '',
+      type: "",
       deleteVisible: false,
       multipleSelection: [],
       formData: {
         code: '',
-        name: '',
-        parentcode: '',
+        name: "",
+        parentcode: "1307",
         optimistic: 0,
+
+        postition: "", //中心点
+      },
+
+      rules: {
+        code: [
+          {
+            required: true,
+            message: "区域编码不能为空",
+            trigger: "blur",
+          },
+        ],
+        name: [
+          {
+            required: true,
+            message: "区域名称不能为空",
+            trigger: "blur",
+          },
+        ],
+        parentcode: [
+          {
+            required: true,
+            message: "上级编码不能为空",
+            trigger: "blur",
+          },
+        ],
+        postition: [
+          {
+            required: true,
+            message: "中心点不能为空",
+            trigger: "change",
+          },
+        ],
+      },
+    };
+  },
+  computed: {
+    'formData.code': {
+      set: {
+        
       }
     }
-  },
+  },  
   async created() {
-    await this.getTableData()
+    await this.getTableData();
+    let that = this;
+    window.addEventListener(
+      "message",
+      function (event) {
+        // 接收位置信息，用户选择确认位置点后选点组件会触发该事件，回传用户的位置信息
+        var loc = event.data;
+        if (loc && loc.module == "locationPicker") {
+          //防止其他应用也会向该页面post信息，需判断module是否为'locationPicker'
+          // console.log('location', loc);
+          // console.log(loc.latlng.lat + ',' + loc.latlng.lng)
+          that.formData.postition = loc.latlng.lat + "," + loc.latlng.lng;
+        }
+      },
+      false
+    );
   },
+
   methods: {
-  // 条件搜索前端看此方法
+    // 地图选点
+    choosePoint() {
+      this.dialogMap = true;
+    },
+    // 条件搜索前端看此方法
     onSubmit() {
-      this.page = 1
-      this.pageSize = 10
-      this.getTableData()
+      this.page = 1;
+      this.pageSize = 10;
+      this.searchInfo = {
+        parentcode: this.searchID
+      }
+      this.getTableData();
     },
     handleSelectionChange(val) {
-      this.multipleSelection = val
+      this.multipleSelection = val;
     },
     deleteRow(row) {
-      this.$confirm('确定要删除吗?', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
+      this.$confirm("确定要删除吗?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
       }).then(() => {
-        this.deleteOrganization(row)
-      })
+        this.deleteOrganization(row);
+      });
     },
     async onDelete() {
-      const ids = []
+      const ids = [];
       if (this.multipleSelection.length === 0) {
         this.$message({
-          type: 'warning',
-          message: '请选择要删除的数据'
-        })
-        return
+          type: "warning",
+          message: "请选择要删除的数据",
+        });
+        return;
       }
       this.multipleSelection &&
-        this.multipleSelection.map(item => {
-          ids.push(item.ID)
-        })
-      const res = await deleteOrganizationByIds({ ids })
+        this.multipleSelection.map((item) => {
+          ids.push(item.ID);
+        });
+      const res = await deleteOrganizationByIds({ ids });
       if (res.code === 0) {
         this.$message({
-          type: 'success',
-          message: '删除成功'
-        })
+          type: "success",
+          message: "删除成功",
+        });
         if (this.tableData.length === ids.length && this.page > 1) {
-          this.page--
+          this.page--;
         }
-        this.deleteVisible = false
-        this.getTableData()
+        this.deleteVisible = false;
+        this.getTableData();
       }
     },
     async updateOrganization(row) {
-      const res = await findOrganization({ code: row.code })
-      this.type = 'update'
+      const res = await findOrganization({ code: row.code });
+      this.type = "update";
       if (res.code === 0) {
-        this.formData = res.data.reorganization
-        this.dialogFormVisible = true
+        this.formData = res.data.reorganization;
+        this.dialogFormVisible = true;
       }
     },
     closeDialog() {
-      this.dialogFormVisible = false
+      this.dialogFormVisible = false;
       this.formData = {
-        code: '',
-        name: '',
-        parentcode: '',
+        code: "",
+        name: "",
+        parentcode: "",
+        postition: "",
         optimistic: 0,
-      }
+      };
     },
     async deleteOrganization(row) {
-      const res = await deleteOrganization({ code: row.code })
+      const res = await deleteOrganization({ code: row.code });
       if (res.code === 0) {
         this.$message({
-          type: 'success',
-          message: '删除成功'
-        })
+          type: "success",
+          message: "删除成功",
+        });
         if (this.tableData.length === 1 && this.page > 1) {
-          this.page--
+          this.page--;
         }
-        this.getTableData()
+        this.getTableData();
       }
     },
     async enterDialog() {
-      let res
-      switch (this.type) {
-        case 'create':
-          res = await createOrganization(this.formData)
-          break
-        case 'update':
-          res = await updateOrganization(this.formData)
-          break
-        default:
-          res = await createOrganization(this.formData)
-          break
-      }
-      if (res.code === 0) {
-        this.$message({
-          type: 'success',
-          message: '创建/更改成功'
-        })
-        this.closeDialog()
-        this.getTableData()
-      }
+      this.$refs["ruleFormRef"].validate((valid) => {
+        if (valid) {
+          // console.log(this.formData)
+          
+          switch (this.type) {
+            case "create":
+
+              createOrganization(this.formData);
+              break;
+            case "update":
+     
+              updateOrganization(this.formData);
+              break;
+            default:
+   
+              createOrganization(this.formData);
+              break;
+          }
+         
+          this.$message({
+            type: "success",
+            message: this.type == "create" ? "创建成功" : "修改成功",
+          });
+          setTimeout( () => {
+            this.getTableData();
+            this.closeDialog();
+          },200)
+          
+           
+     
+        }
+      });
     },
     openDialog() {
-      this.type = 'create'
-      this.dialogFormVisible = true
-    }
+      this.type = "create";
+      this.dialogFormVisible = true;
+    },
   },
-}
+};
 </script>
 
 <style>
+.map {
+  width: 100%;
+  height: 80vh;
+}
+.disFlex .el-form-item__content{
+  display: flex;
+}
+.lh30 {
+  line-height: 30px;
+}
 </style>

web/src/view/place/place.vue

@@ -13,13 +13,27 @@
           </el-select>
         </el-form-item>
         <el-form-item>
-          <el-button size="mini" type="primary" icon="el-icon-search" @click="onSubmit">查询</el-button>
+          <el-button
+            size="mini"
+            type="primary"
+            icon="el-icon-search"
+            @click="onSubmit"
+            >查询</el-button
+          >
           <!--          <el-button size="mini" type="primary" icon="el-icon-plus" @click="openDialog">新增</el-button>-->
-          <el-popover v-model:visible="deleteVisible" placement="top" width="160">
+          <el-popover
+            v-model:visible="deleteVisible"
+            placement="top"
+            width="160"
+          >
             <p>确定要删除吗？</p>
             <div style="text-align: right; margin: 0">
-              <el-button size="mini" type="text" @click="deleteVisible = false">取消</el-button>
-              <el-button size="mini" type="primary" @click="onDelete">确定</el-button>
+              <el-button size="mini" type="text" @click="deleteVisible = false"
+                >取消</el-button
+              >
+              <el-button size="mini" type="primary" @click="onDelete"
+                >确定</el-button
+              >
             </div>
           </el-popover>
         </el-form-item>
@@ -36,7 +50,9 @@
     >
       <!--      <el-table-column type="selection" width="55"/>-->
       <el-table-column label="创建时间" width="180">
-        <template #default="scope">{{ formatDate(scope.row.CreatedAt) }}</template>
+        <template #default="scope">{{
+          formatDate(scope.row.CreatedAt)
+        }}</template>
       </el-table-column>
       <el-table-column label="站点名称" prop="name" />
       <el-table-column label="站点定位" prop="position">
@@ -44,7 +60,13 @@
           <el-link
             :underline="false"
             type="primary"
-            @click.native="openMapHandle(scope.row.position,scope.row.name,dict.label.site_type[scope.row.type])"
+            @click.native="
+              openMapHandle(
+                scope.row.position,
+                scope.row.name,
+                dict.label.site_type[scope.row.type]
+              )
+            "
           >
             点击查看地图
           </el-link>
@@ -64,9 +86,30 @@
             icon="el-icon-edit"
             class="table-button"
             @click="updatePlace(scope.row)"
-          >变更
+            >变更
           </el-button>
-          <el-button type="danger" icon="el-icon-delete" size="mini" @click="deleteRow(scope.row)">删除</el-button>
+          <el-button
+            type="danger"
+            icon="el-icon-delete"
+            size="mini"
+            @click="deleteRow(scope.row)"
+            >删除</el-button
+          >
+          <el-button
+            type="info"
+            class="mt10 ml0"
+            icon="el-icon-circle-plus-outline"
+            size="mini"
+            @click="addProblem(scope.row)"
+            >添加问题</el-button
+          >
+          <el-button
+            type="success"
+            icon="el-icon-tickets"
+            size="mini"
+            @click="ProblemList(scope.row)"
+            >问题管理</el-button
+          >
         </template>
       </el-table-column>
     </el-table>
@@ -75,18 +118,22 @@
       :current-page="page"
       :page-size="pageSize"
       :page-sizes="[10, 30, 50, 100]"
-      :style="{float:'right',padding:'20px'}"
+      :style="{ float: 'right', padding: '20px' }"
       :total="total"
       @current-change="handleCurrentChange"
       @size-change="handleSizeChange"
     />
-    <el-dialog v-model="dialogFormVisible" :before-close="closeDialog" title="弹窗操作">
+    <el-dialog
+      v-model="dialogFormVisible"
+      :before-close="closeDialog"
+      title="弹窗操作"
+    >
       <el-form :model="formData" label-position="right" label-width="80px">
         <el-form-item label="点位名称:">
           <el-input v-model="formData.name" clearable placeholder="请输入" />
         </el-form-item>
         <el-form-item label="点位定位:">
-          <el-input v-model="formData.position" :disabled="type!='create'" />
+          <el-input v-model="formData.position" :disabled="type != 'create'" />
         </el-form-item>
         <el-form-item label="点位类型:">
           <el-select v-model="formData.type">
@@ -98,9 +145,19 @@
             />
           </el-select>
         </el-form-item>
-        <el-form-item label="区域:">
+        <el-form-item label="地址:">
           <el-input v-model="formData.region" clearable placeholder="请输入" />
         </el-form-item>
+        <el-form-item label="区域:">
+          <el-cascader 
+            :options="optionsArea" 
+            v-model="formData.organCode" 
+            :show-all-levels="false"
+            :props="{ expandTrigger: 'hover', value: 'code', label: 'name'  }"
+
+            @change="changeArea"
+          ></el-cascader>
+        </el-form-item>
       </el-form>
       <template #footer>
         <div class="dialog-footer">
@@ -109,6 +166,35 @@
         </div>
       </template>
     </el-dialog>
+
+    <!-- 问题管理开始 -->
+    <el-dialog v-model="dialogProblemVisible" title="弹窗操作">
+      <el-table :data="problemData" border>
+        <el-table-column prop="placeProText" label="问题名称">
+        </el-table-column>
+        <el-table-column label="操作" width="160">
+          <template #default="scope">
+            <el-button
+              size="small"
+              type="primary"
+              icon="el-icon-edit"
+              class="table-button"
+              @click="updateProblem(scope.row)"
+              >变更
+            </el-button>
+            <el-button
+              type="danger"
+              icon="el-icon-delete"
+              size="mini"
+              @click="deleteProblem(scope.row)"
+              >删除</el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-dialog>
+
+    <!-- 问题管理结束 -->
   </div>
 </template>
 
@@ -119,141 +205,285 @@ import {
   deletePlaceByIds,
   updatePlace,
   findPlace,
-  getPlaceList
-} from '@/api/place' //  此处请自行替换地址
-import infoList from '@/mixins/infoList'
-import { getDict } from '@/utils/dictionary'
+  getPlaceList,
+} from "@/api/place"; //  此处请自行替换地址
+import {
+  createPlacePro,
+  deletePlacePro,
+  deletePlaceProByIds,
+  updatePlacePro,
+  findPlacePro,
+  getPlaceProList,
+} from "@/api/placePro"; //  此处请自行替换地址
+import { areaList } from "@/api/organization"
+import infoList from "@/mixins/infoList";
+import { getDict } from "@/utils/dictionary";
 
 export default {
-  name: 'Place',
-  dicts: ['site_type'],
+  name: "Place",
+  dicts: ["site_type"],
   mixins: [infoList],
   data() {
     return {
+      currentID: 0, //当前问题ID
+
       listApi: getPlaceList,
       dialogFormVisible: false,
-      type: '',
+      dialogProblemVisible: false,
+      problemData: [], //问题列表
+      type: "",
       siteType: [],
       deleteVisible: false,
       multipleSelection: [],
       formData: {
-        name: '',
-        position: '',
-        type: '',
-        region: '',
-      }
-    }
+        name: "",
+        position: "",
+        type: "",
+        region: "",
+        organCode: ""
+      },
+      formDataProblem: {
+        placeId: 0,
+        placeProText: "",
+      },
+      optionsArea: []
+    };
   },
   async created() {
-    this.siteType = await getDict('site_type')
-    await this.getTableData()
+    this.siteType = await getDict("site_type");
+    await this.getTableData();
   },
   methods: {
     openMapHandle(position, name, region) {
-      window.open('https://apis.map.qq.com/uri/v1/marker?marker=coord:' + position + ';title:' + name + ';addr:' + region)
+      window.open(
+        "https://apis.map.qq.com/uri/v1/marker?marker=coord:" +
+          position +
+          ";title:" +
+          name +
+          ";addr:" +
+          region
+      );
     },
     // 条件搜索前端看此方法
     onSubmit() {
-      this.page = 1
-      this.pageSize = 10
-      this.getTableData()
+      this.page = 1;
+      this.pageSize = 10;
+      this.getTableData();
     },
     handleSelectionChange(val) {
-      this.multipleSelection = val
+      this.multipleSelection = val;
     },
     deleteRow(row) {
-      this.$confirm('确定要删除吗?', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
+      this.$confirm("确定要删除吗?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
       }).then(() => {
-        this.deletePlace(row)
-      })
+        this.deletePlace(row);
+      });
     },
     async onDelete() {
-      const ids = []
+      const ids = [];
       if (this.multipleSelection.length === 0) {
         this.$message({
-          type: 'warning',
-          message: '请选择要删除的数据'
-        })
-        return
+          type: "warning",
+          message: "请选择要删除的数据",
+        });
+        return;
       }
       this.multipleSelection &&
-      this.multipleSelection.map(item => {
-        ids.push(item.ID)
-      })
-      const res = await deletePlaceByIds({ ids })
+        this.multipleSelection.map((item) => {
+          ids.push(item.ID);
+        });
+      const res = await deletePlaceByIds({ ids });
       if (res.code === 0) {
         this.$message({
-          type: 'success',
-          message: '删除成功'
-        })
+          type: "success",
+          message: "删除成功",
+        });
         if (this.tableData.length === ids.length && this.page > 1) {
-          this.page--
+          this.page--;
         }
-        this.deleteVisible = false
-        this.getTableData()
+        this.deleteVisible = false;
+        this.getTableData();
       }
     },
     async updatePlace(row) {
-      const res = await findPlace({ ID: row.ID })
-      this.type = 'update'
+      const res = await findPlace({ ID: row.ID });
+      this.type = "update";
       if (res.code === 0) {
-        this.formData = res.data.replace
-        this.dialogFormVisible = true
+        this.formData = res.data.replace;
+        this.dialogFormVisible = true;
       }
+      
+      let list = await areaList({code: '1307'})
+      console.log(list)
+      if(list.code == 0) {
+        this.optionsArea = list.data.treeMap     
+
+      }
+      // console.log(this.optionsArea)
     },
     closeDialog() {
-      this.dialogFormVisible = false
+      this.dialogFormVisible = false;
       this.formData = {
-        name: '',
-        position: '',
-        type: '',
-        region: '',
-      }
+        name: "",
+        position: "",
+        type: "",
+        region: "",
+      };
     },
     async deletePlace(row) {
-      const res = await deletePlace({ ID: row.ID })
+      const res = await deletePlace({ ID: row.ID });
       if (res.code === 0) {
         this.$message({
-          type: 'success',
-          message: '删除成功'
-        })
+          type: "success",
+          message: "删除成功",
+        });
         if (this.tableData.length === 1 && this.page > 1) {
-          this.page--
+          this.page--;
         }
-        this.getTableData()
+        this.getTableData();
       }
     },
     async enterDialog() {
-      let res
+      let res;
       switch (this.type) {
-        case 'create':
-          res = await createPlace(this.formData)
-          break
-        case 'update':
-          res = await updatePlace(this.formData)
-          break
+        case "create":
+          res = await createPlace(this.formData);
+          break;
+        case "update":
+          res = await updatePlace(this.formData);
+          break;
         default:
-          res = await createPlace(this.formData)
-          break
+          res = await createPlace(this.formData);
+          break;
       }
       if (res.code === 0) {
         this.$message({
-          type: 'success',
-          message: '创建/更改成功'
-        })
-        this.closeDialog()
-        this.getTableData()
+          type: "success",
+          message: "创建/更改成功",
+        });
+        this.closeDialog();
+        this.getTableData();
       }
     },
     openDialog() {
-      this.type = 'create'
-      this.dialogFormVisible = true
+      this.type = "create";
+      this.dialogFormVisible = true;
+    },
+    // 添加问题
+    addProblem(row) {
+      this.$prompt("请输入站点问题", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        
+      })
+        .then(({ value }) => {
+          if (value == "" || value == null) {
+            this.$message({
+              type: "error",
+              message: "你的问题不能为空",
+            });
+          } else {
+            this.formDataProblem.placeId = row.ID;
+            this.formDataProblem.placeProText = value;
+            // console.log(this.formDataProblem)
+            createPlacePro(this.formDataProblem).then((res) => {
+              this.$message({
+                type: "success",
+                message: res.msg,
+              });
+            });
+          }
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "取消输入",
+          });
+        });
+    },
+
+    // 问题管理
+    async ProblemList(row) {
+      // console.log(row)
+      this.dialogProblemVisible = true;
+      this.currentID = this.currentID == 0 ? row.ID : this.currentID
+      let res = await findPlace({ ID: this.currentID });
+      if (res.code == 0) {
+        this.problemData = res.data.replace.proList;
+      }
+    },
+
+    // 修改更新问题
+    async updateProblem(row) {
+      console.log(row)
+      this.$prompt("请修改站点问题", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        inputValue: row.placeProText
+      }).then( async(value) => {
+        console.log(value)
+        if (value == "" || value == null) {
+            this.$message({
+              type: "error",
+              message: "你的问题不能为空",
+            });
+          } else {
+            this.formDataProblem.ID = row.ID
+            this.formDataProblem.placeId = row.placeId;
+            this.formDataProblem.placeProText = value.value;
+            // console.log(this.formDataProblem)
+            
+            // console.log(this.formDataProblem)
+            let res = await updatePlacePro(this.formDataProblem)
+            if( res.code == 0 ) {
+              this.$message({
+                type: "success",
+                message: res.msg,
+              });  
+              this.ProblemList()
+            }
+              
+         
+          }
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "取消输入",
+          });
+      })
+    },
+
+    // 删除问题
+    async deleteProblem(row) {
+      this.$confirm("确定要删除吗?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      }).then(async () => {
+        let res = await deletePlacePro({ ID: row.ID });
+        
+        if (res.code === 0) {
+          this.$message({
+            type: "success",
+            message: "删除成功",
+          });
+        this.ProblemList()  
+          
+        }
+      });
+    },
+
+    //区域更改
+    changeArea(value) {
+      console.log(value[0])
+      this.formData.organCode = value[0]
     }
   },
-}
+};
 </script>
 
 <style>

web/src/view/placePro/placePro.vue

@@ -3,18 +3,23 @@
     <div class="search-term">
       <el-form :inline="true" :model="searchInfo" class="demo-form-inline">
         <el-form-item>
-          <el-button size="mini" type="primary" icon="el-icon-search" @click="onSubmit">查询</el-button>
-          <el-button size="mini" type="primary" icon="el-icon-plus" @click="openDialog">新增</el-button>
-          <el-popover v-model:visible="deleteVisible" placement="top" width="160">
-            <p>确定要删除吗？</p>
-            <div style="text-align: right; margin: 0">
-              <el-button size="mini" type="text" @click="deleteVisible = false">取消</el-button>
-              <el-button size="mini" type="primary" @click="onDelete">确定</el-button>
-            </div>
-            <template #reference>
-              <el-button icon="el-icon-delete" size="mini" type="danger" style="margin-left: 10px;">批量删除</el-button>
-            </template>
-          </el-popover>
+          <div class="flex-item mr10"><el-input v-model="ID" placeholder="请输入"></el-input></div>
+          <div class="flex-item">
+            <el-button size="mini" type="primary" icon="el-icon-search" @click="onSubmit">查询</el-button>
+            <el-button size="mini" type="primary" icon="el-icon-plus" @click="openDialog">新增</el-button>
+            <el-popover v-model:visible="deleteVisible" placement="top" width="160">
+              <p>确定要删除吗？</p>
+              <div style="text-align: right; margin: 0">
+                <el-button size="mini" type="text" @click="deleteVisible = false">取消</el-button>
+                <el-button size="mini" type="primary" @click="onDelete">确定</el-button>
+              </div>
+              <template #reference>
+                <el-button icon="el-icon-delete" size="mini" type="danger" style="margin-left: 10px;">批量删除</el-button>
+              </template>
+            </el-popover>
+          </div>
+          
+          
         </el-form-item>
       </el-form>
     </div>
@@ -52,8 +57,18 @@
     />
     <el-dialog v-model="dialogFormVisible" :before-close="closeDialog" title="弹窗操作">
       <el-form :model="formData" label-position="right" label-width="80px">
-        <el-form-item label="站点id:">
+        <!-- <el-form-item label="站点id:">
           <el-input v-model.number="formData.placeId" clearable placeholder="请输入" />
+        </el-form-item> -->
+        <el-form-item label="站点id:">
+          <el-select v-model="name" filterable placeholder="请选择" >
+            <el-option
+              v-for="item in options"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value">
+            </el-option>
+          </el-select>
         </el-form-item>
         <el-form-item label="站点问题:">
           <el-input v-model="formData.placeProText" clearable placeholder="请输入" />
@@ -78,12 +93,18 @@ import {
   findPlacePro,
   getPlaceProList
 } from '@/api/placePro' //  此处请自行替换地址
+import {
+  getPlaceList
+} from '@/api/place' 
 import infoList from '@/mixins/infoList'
 export default {
   name: 'PlacePro',
   mixins: [infoList],
   data() {
     return {
+      name: "",
+      // options: [], //站点下拉列表
+      ID: "",
       listApi: getPlaceProList,
       dialogFormVisible: false,
       type: '',
@@ -98,11 +119,19 @@ export default {
   async created() {
     await this.getTableData()
   },
+  watch: {
+    name(newVal, oldVal) {
+      console.log(newVal)
+    } 
+  },
   methods: {
   // 条件搜索前端看此方法
     onSubmit() {
       this.page = 1
       this.pageSize = 10
+      this.searchInfo = {
+        ID: this.ID
+      }
       this.getTableData()
     },
     handleSelectionChange(val) {
@@ -172,6 +201,8 @@ export default {
       }
     },
     async enterDialog() {
+      // console.log(this.options)
+      
       let res
       switch (this.type) {
         case 'create':
@@ -202,4 +233,7 @@ export default {
 </script>
 
 <style>
+.el-form-item__content {
+  display: flex;
+}
 </style>