平台-区域管理接口对接

src/api/login.js

@@ -0,0 +1,6 @@
+import { setRequest } from "@/utils/httpRequest";
+
+/**
+ * 生成短信验证码
+ */
+export const login_msg_code = (data) => setRequest("login/msg_code", data);

src/api/region.js

@@ -1,6 +1,31 @@
-import { region_url } from "@/utils/httpRequest";
+import { setRequest } from "@/utils/httpRequest";
 
 /**
- * 1.0.1管理员--账号登录
+ * 2.1区域--管理列表
  */
-export const admin_login = (data) => region_url("admin/login", data);
+export const region_list = (data) => setRequest("region/list", data);
+/**
+ * 2.1.2区域--选择列表
+ */
+export const region_list_sel = (data) => setRequest("region/list_sel", data);
+/**
+ * 2.2区域--添加
+ */
+export const region_add = (data) => setRequest("region/add", data);
+/**
+ * 2.3区域--更新
+ */
+export const region_edit = (data) => setRequest("region/edit", data);
+/**
+ * 2.4区域--删除
+ */
+export const region_delete = (data) => setRequest("region/delete", data);
+/**
+ * 2.5区域--详情
+ */
+export const region_detail = (data) => setRequest("region/detail", data);
+/**
+ * 2.5.2区域--管理员列表
+ */
+export const region_list_admin = (data) =>
+  setRequest("region/list_admin", data);

src/utils/index.js

@@ -336,89 +336,59 @@ export function hexToRgba(hex, opacity) {
   }
   return rgbaColor;
 }
-export const unitsDigit = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9"];
-export const upperCaseLetters = [
-  "A",
-  "B",
-  "C",
-  "D",
-  "E",
-  "F",
-  "G",
-  "H",
-  "I",
-  "J",
-  "K",
-  "L",
-  "M",
-  "N",
-  "O",
-  "P",
-  "Q",
-  "R",
-  "S",
-  "T",
-  "U",
-  "V",
-  "W",
-  "X",
-  "Y",
-  "Z"
-];
-export const lowerCaseLetters = [
-  "a",
-  "b",
-  "c",
-  "d",
-  "e",
-  "f",
-  "g",
-  "h",
-  "i",
-  "j",
-  "k",
-  "l",
-  "m",
-  "n",
-  "o",
-  "p",
-  "q",
-  "r",
-  "s",
-  "t",
-  "u",
-  "v",
-  "w",
-  "x",
-  "y",
-  "z"
-];
-// 随机字母和数字组合
-export const getRandomPassword = (num = 6) => {
-  if (num <= 0) {
-    return "";
-  }
-  let passwordArr = [unitsDigit, upperCaseLetters, lowerCaseLetters];
-  let psw = "";
-  let numDigit = 0;
-  for (let i = 0; i < num; i++) {
-    let selectIndex = Math.floor(Math.random() * passwordArr.length);
-    if (selectIndex === 0) {
-      numDigit++;
+// 包含大小写字母和数字的随机组合
+export const generateRandomString = (n = 8) => {
+  let chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
+  let result = "";
+  let hasUpperCase = false;
+  let hasLowerCase = false;
+  let hasDigit = false;
+  // 当n<3时，只需随机选择字符即可
+  if (n < 3) {
+    for (let i = 0; i < n; i++) {
+      result += chars.charAt(Math.floor(Math.random() * chars.length));
     }
-    if (numDigit === num && i === num - 1) {
-      let selectArr = [upperCaseLetters, lowerCaseLetters][
-        Math.floor(Math.random() * 2)
-      ];
-      psw += selectArr[Math.floor(Math.random() * selectArr.length)];
-    } else if (numDigit === 0 && i === num - 1) {
-      psw += unitsDigit[Math.floor(Math.random() * unitsDigit.length)];
+    return result;
+  }
+  // 当n>=3时，需要确保包含大写字母、小写字母和数字
+  while (result.length < n) {
+    let randomIndex = Math.floor(Math.random() * chars.length);
+    let randomChar = chars.charAt(randomIndex);
+
+    // 确保每种类型的字符至少被选中一次
+    if (hasUpperCase && hasLowerCase && hasDigit) {
+      result += randomChar;
     } else {
-      let selectArr = passwordArr[selectIndex];
-      psw += selectArr[Math.floor(Math.random() * selectArr.length)];
+      // 如果还没包含大写字母，并且当前字符是大写字母，则添加
+      if (!hasUpperCase && /[A-Z]/.test(randomChar)) {
+        result += randomChar;
+        hasUpperCase = true;
+      }
+      // 如果还没包含小写字母，并且当前字符是小写字母，则添加
+      else if (!hasLowerCase && /[a-z]/.test(randomChar)) {
+        result += randomChar;
+        hasLowerCase = true;
+      }
+      // 如果还没包含数字，并且当前字符是数字，则添加
+      else if (!hasDigit && /\d/.test(randomChar)) {
+        result += randomChar;
+        hasDigit = true;
+      }
+      // 否则跳过这个字符，重新选择
     }
   }
-  return psw;
+  // 如果字符串长度仍然小于n，则随机添加字符直到满足长度
+  while (result.length < n) {
+    result += chars.charAt(Math.floor(Math.random() * chars.length));
+  }
+  // 打乱结果字符串的顺序以确保随机性
+  result = result
+    .split("")
+    .sort(function () {
+      return 0.5 - Math.random();
+    })
+    .join("");
+  return result;
 };
 /**
  * 提取html字符串中的文字

src/views/platformSection/regionManage/regionManage.vue

@@ -12,12 +12,6 @@
     </div>
     <div class="table_wrap">
       <Table :columns="columns" :data="searchForm.list">
-        <template slot-scope="{ row }" slot="createtimeSlot">
-          <div>{{ date_format(row.createtime) }}</div>
-        </template>
-        <template slot-scope="{ row }" slot="updatetimeSlot">
-          <div>{{ date_format(row.updatetime) }}</div>
-        </template>
         <template slot-scope="{ row }" slot="actionSlot">
           <div class="action_list">
             <div @click="toEnter(row)">进入</div>
@@ -49,6 +43,7 @@
       title="新建"
     >
       <Form
+        v-if="regionInfo.show"
         ref="addForm"
         :model="regionInfo"
         :rules="rules"
@@ -61,9 +56,15 @@
             placeholder="请输入区域名称"
           ></Input>
         </FormItem>
+        <FormItem label="区域码" prop="regionCode" style="width: 100%">
+          <Input
+            v-model="regionInfo.regionCode"
+            placeholder="请输入区域码"
+          ></Input>
+        </FormItem>
         <FormItem
           label="管理员名称"
-          prop="admin"
+          prop="aname"
           style="width: calc(50% - 10px)"
         >
           <Input
@@ -110,15 +111,45 @@
         >
           <Input
             style="width: calc(100% - 102px)"
-            v-model="regionInfo.msgcode"
+            v-model="regionInfo.admin.msgcode"
             placeholder="请输入短信验证码"
           ></Input>
-          <div class="code_btn disabled">获取验证码</div>
+          <div
+            :class="['code_btn', regionInfo.second === 60 ? '' : 'disabled']"
+            @click="getMsgCode()"
+          >
+            获取验证码
+          </div>
+        </FormItem>
+        <FormItem label="地址" prop="address" style="width: 100%">
+          <Input
+            v-model="regionInfo.admin.address"
+            placeholder="请输入地址"
+          ></Input>
+        </FormItem>
+        <FormItem label="描述信息" prop="comm" style="width: 100%">
+          <Input
+            type="textarea"
+            v-model="regionInfo.admin.comm"
+            placeholder="请输入描述信息"
+          ></Input>
         </FormItem>
       </Form>
-      <div slot="footer">
-        <Button @click="regionInfo.show = false">取消</Button>
-        <Button @click="saveAddInfo()" type="primary">保存</Button>
+      <div
+        slot="footer"
+        style="
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+        "
+      >
+        <div style="color: #b50000">
+          注：密码必须包含大小写字母和数字的组合，长度在8-32之间。
+        </div>
+        <div>
+          <Button @click="regionInfo.show = false">取消</Button>
+          <Button @click="saveAddInfo()" type="primary">保存</Button>
+        </div>
       </div>
     </Modal>
     <!-- 查看 -->
@@ -128,7 +159,7 @@
       v-model="viewInfo.show"
       title="查看"
     >
-      <div class="view_title">河南星火燎原软件科技有限公司</div>
+      <div class="view_title">{{ viewInfo.regionName }}</div>
       <Table
         style="border: 1px solid #e8eaec; border-bottom: none"
         :columns="viewInfo.columns"
@@ -142,11 +173,41 @@
 </template>
 
 <script>
-import { date_format } from "@/utils";
+import { generateRandomString } from "@/utils";
+import {
+  region_list,
+  region_list_admin,
+  region_delete,
+  region_add
+} from "@/api/region";
 export default {
   data() {
+    const reg = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)[a-zA-Z\d]{8,32}$/;
+    // 密码验证
+    const pwdCheck = (rule, value, callback) => {
+      if (!reg.test(this.regionInfo.admin.loginpwd)) {
+        return callback(
+          new Error("密码必须包含大小写字母和数字的组合，长度在8-32之间。")
+        );
+      } else {
+        callback();
+      }
+    };
+    // 重复密码验证
+    const pwdAgainCheck = async (rule, value, callback) => {
+      if (!reg.test(this.regionInfo.admin.loginpwd1)) {
+        return callback(
+          new Error("密码必须包含大小写字母和数字的组合，长度在8-32之间。")
+        );
+      } else if (
+        this.regionInfo.admin.loginpwd != this.regionInfo.admin.loginpwd1
+      ) {
+        return callback(new Error("两次输入密码不一致！"));
+      } else {
+        callback();
+      }
+    };
     return {
-      date_format,
       searchForm: {
         regionName: "",
         page: 1,
@@ -157,13 +218,20 @@ export default {
       // 新建
       regionInfo: {
         show: false,
+        // 验证码计时
+        timer: null,
+        second: 60,
         regionName: "",
+        regionCode: "",
         admin: {
           aname: "",
           loginname: "",
           loginpwd: "",
           loginpwd1: "",
-          phone: ""
+          phone: "",
+          msgcode: "",
+          address: "",
+          comm: ""
         }
       },
       // 查看
@@ -180,7 +248,7 @@ export default {
           },
           {
             title: "名称",
-            key: "admin",
+            key: "aname",
             align: "center"
           },
           {
@@ -203,7 +271,7 @@ export default {
             trigger: "blur"
           }
         ],
-        admin: [
+        aname: [
           {
             required: true,
             message: "请输入管理员名称",
@@ -217,17 +285,17 @@ export default {
             trigger: "blur"
           }
         ],
-        pwd: [
+        loginpwd: [
           {
             required: true,
-            message: "请输入密码",
+            validator: pwdCheck,
             trigger: "blur"
           }
         ],
-        pwd1: [
+        loginpwd1: [
           {
             required: true,
-            message: "请输入确认密码",
+            validator: pwdAgainCheck,
             trigger: "blur"
           }
         ]
@@ -259,7 +327,7 @@ export default {
         },
         {
           title: "创建时间",
-          slot: "createtimeSlot",
+          key: "createtime",
           width: 190,
           align: "center"
         },
@@ -271,7 +339,7 @@ export default {
         },
         {
           title: "操作时间",
-          slot: "updatetimeSlot",
+          key: "updatetime",
           width: 190,
           align: "center"
         },
@@ -288,6 +356,30 @@ export default {
     this.searchList();
   },
   methods: {
+    // 获取短信验证码
+    getMsgCode() {
+      if (this.regionInfo.second < 60) {
+        return;
+      }
+      // 手机号验证
+      if (!this.regionInfo.admin.phone) {
+        this.$Message.error("手机号码不能为空");
+        return;
+      }
+      let filter = /^[1][3,4,5,6,7,8,9][0-9]{9}$/;
+      if (!filter.test(this.regionInfo.admin.phone)) {
+        this.$Message.error("手机号码格式不正确");
+        return;
+      }
+      this.regionInfo.second = 60;
+      this.regionInfo.timer = setTimeout(() => {
+        this.regionInfo.second--;
+        if (this.regionInfo.second <= 0) {
+          clearTimeout(this.regionInfo.timer);
+          this.regionInfo.second = 60;
+        }
+      }, 1000);
+    },
     // 搜索
     searchList() {
       this.searchForm.page = 1;
@@ -306,48 +398,75 @@ export default {
     },
     // 获取列表
     getList() {
-      this.searchForm.list = [
-        {
-          regionid: 1,
-          regionName: "区域一",
-          createname: "区域一",
-          createtime: 1710838418,
-          updatename: "区域一",
-          updatetime: 1710838430
-        },
-        {
-          regionid: 2,
-          regionName: "区域二",
-          createname: "区域一",
-          createtime: 1710838418,
-          updatename: "区域一",
-          updatetime: 1710838430
-        },
-        {
-          regionid: 3,
-          regionName: "区域三",
-          createname: "区域一",
-          createtime: 1710838418,
-          updatename: "区域一",
-          updatetime: 1710838430
+      region_list({
+        page: this.searchForm.page,
+        size: this.searchForm.size,
+        regionName: this.searchForm.regionName
+      }).then((data) => {
+        if (data.code === 0) {
+          this.searchForm.list = data.obj.data;
+          this.searchForm.total = data.obj.total;
+        } else {
+          this.$Message.error(data.msg);
         }
-      ];
-      this.searchForm.total = 3;
+      });
     },
     // 新建
     toAdd() {
-      this.regionInfo.show = true;
-      this.regionInfo.regionName = "";
-      this.regionInfo.admin = "";
-      this.regionInfo.loginname = "";
-      this.regionInfo.pwd = "";
-      this.regionInfo.pwd1 = "";
-      this.regionInfo.phone = "";
-      this.regionInfo.code = "";
+      if (this.regionInfo.timer) {
+        clearTimeout(this.regionInfo.timer);
+        this.regionInfo.timer = null;
+      }
+      this.regionInfo = {
+        show: true,
+        // 验证码计时
+        timer: null,
+        second: 60,
+        regionName: "",
+        regionCode: "",
+        admin: {
+          aname: "",
+          loginname: "",
+          loginpwd: generateRandomString(8),
+          loginpwd1: "",
+          phone: "",
+          msgcode: "",
+          address: "",
+          comm: ""
+        }
+      };
     },
     // 保存新建
     saveAddInfo() {
-      this.regionInfo.show = false;
+      this.$refs.addForm.validate((valid) => {
+        if (valid) {
+          if (this.regionInfo.timer) {
+            clearTimeout(this.regionInfo.timer);
+            this.regionInfo.timer = null;
+          }
+          this.regionInfo.show = false;
+          region_add({
+            regionName: this.regionInfo.regionName,
+            regionCode: this.regionInfo.regionCode,
+            admin: {
+              aname: this.regionInfo.admin.aname,
+              loginname: this.regionInfo.admin.loginname,
+              loginpwd: this.regionInfo.admin.loginpwd,
+              phone: this.regionInfo.admin.phone,
+              msgcode: this.regionInfo.admin.msgcode,
+              address: this.regionInfo.admin.address,
+              comm: this.regionInfo.admin.comm
+            }
+          }).then((data) => {
+            if (data.code === 0) {
+              this.searchList();
+              this.$Message.success(data.msg);
+            } else {
+              this.$Message.error(data.msg);
+            }
+          });
+        }
+      });
     },
     // 进入
     toEnter() {
@@ -357,21 +476,18 @@ export default {
       });
     },
     // 查看
-    toView() {
-      this.viewInfo.show = true;
-      this.viewInfo.regionName = "河南星火燎原软件科技有限公司";
-      this.viewInfo.list = [
-        {
-          admin: "周文彦",
-          loginname: "zhouwenyan@xhkjedu.com",
-          phone: "15610230213"
-        },
-        {
-          admin: "齐思宇",
-          loginname: "zhouwenyan@xhkjedu.com",
-          phone: "15610230213"
+    toView(row) {
+      region_list_admin({
+        regionid: row.regionid
+      }).then((data) => {
+        if (data.code === 0) {
+          this.viewInfo.show = true;
+          this.viewInfo.regionName = row.regionName;
+          this.viewInfo.list = data.obj;
+        } else {
+          this.$Message.error(data.msg);
         }
-      ];
+      });
     },
     // 编辑
     toEdit(row) {
@@ -379,11 +495,23 @@ export default {
       this.regionInfo.regionid = row.regionid;
     },
     // 删除
-    toDel() {
+    toDel(row) {
       this.$Modal.confirm({
         title: "提示",
         content: "您确定删除选中数据吗？",
-        onOk: () => {},
+        onOk: () => {
+          region_delete({
+            regionid: row.regionid,
+            rversion: row.rversion
+          }).then((data) => {
+            if (data.code === 0) {
+              this.searchList();
+              this.$Message.success(data.msg);
+            } else {
+              this.$Message.error(data.msg);
+            }
+          });
+        },
         onCancel: () => {}
       });
     }