发展历程

src/api/index.js

@@ -35,3 +35,31 @@ export const user_update = (data) =>
     method: "post",
     data
   });
+// 发展历程列表
+export const dh_list = (data) =>
+  request({
+    url: window._config.baseUrl + "dh/list",
+    method: "post",
+    data
+  });
+// 发展历程保存
+export const dh_save = (data) =>
+  request({
+    url: window._config.baseUrl + "dh/save",
+    method: "post",
+    data
+  });
+// 发展历程更新
+export const dh_update = (data) =>
+  request({
+    url: window._config.baseUrl + "dh/update",
+    method: "post",
+    data
+  });
+// 发展历程删除
+export const dh_remove = (data) =>
+  request({
+    url: window._config.baseUrl + "dh/remove",
+    method: "post",
+    data
+  });

src/views/history/index.vue

@@ -1,14 +1,418 @@
 <template>
-  <div>user</div>
+  <div>
+    <div class="searchBox">
+      <div>
+        <DatePicker
+          type="year"
+          placeholder="请选择年份"
+          v-model="historySearch.dhyear"
+          style="margin-right: 16px; width: 200px"
+          :clearable="false"
+        />
+        <RadioGroup v-model="historySearch.ltype" @on-change="searchList()">
+          <Radio :label="1">中文</Radio>
+          <Radio :label="2">英文</Radio>
+        </RadioGroup>
+        <Button type="primary" style="margin-left: 16px" @click="searchList()"
+          >搜索</Button
+        >
+      </div>
+      <div>
+        <Button type="primary" @click="toAdd()">添加</Button>
+      </div>
+    </div>
+    <Table border :columns="historyColumns" :data="historySearch.list">
+      <template slot-scope="{ row }" slot="ltypeSlot">
+        <span>{{ row.ltype === 1 ? "中文" : "英文" }}</span>
+      </template>
+      <template slot-scope="{ row }" slot="createtimeSlot">
+        <span>{{ dateFormat(row.createtime) }}</span>
+      </template>
+      <template slot-scope="{ row }" slot="actionSlot">
+        <div>
+          <span
+            style="color: #2d8cf0; cursor: pointer"
+            @click="toModifyHistory(row)"
+            >修改</span
+          >
+          <span style="margin: 0 10px; color: #2d8cf0">|</span>
+          <span
+            style="color: #ff001e; cursor: pointer"
+            @click="toDelHistory(row.dhid)"
+            >删除</span
+          >
+        </div>
+      </template>
+    </Table>
+    <div class="foot_page" v-if="historySearch.total > 0">
+      <Page
+        :total="historySearch.total"
+        @on-change="changePage"
+        :current="historySearch.page"
+        show-total
+      ></Page>
+    </div>
+    <Modal
+      v-model="userAddForm.show"
+      class="modal1"
+      :mask-closable="false"
+      title="添加用户信息"
+    >
+      <Form
+        :label-width="90"
+        label-position="right"
+        ref="userAddForm"
+        :rules="addFormRules"
+        :model="userAddForm"
+      >
+        <FormItem label="用户姓名" prop="username">
+          <Input v-model="userAddForm.username" placeholder="请输入用户姓名" />
+        </FormItem>
+        <FormItem label="登录账号" prop="loginname">
+          <Input v-model="userAddForm.loginname" placeholder="请输入登录账号" />
+        </FormItem>
+        <FormItem label="登录密码" prop="loginpwd">
+          <Input v-model="userAddForm.loginpwd" placeholder="请输入登录密码" />
+        </FormItem>
+        <FormItem label="手机号" prop="userphone">
+          <Input v-model="userAddForm.userphone" placeholder="请输入手机号" />
+        </FormItem>
+      </Form>
+      <div slot="footer" style="text-align: right">
+        <Button @click="userAddForm.show = false">取消</Button>
+        <Button @click="toSaveAdd()" type="primary">保存</Button>
+      </div>
+    </Modal>
+    <Modal
+      v-model="userModifyForm.show"
+      class="modal1"
+      :mask-closable="false"
+      title="修改用户信息"
+    >
+      <Form
+        :label-width="90"
+        label-position="right"
+        ref="userModifyForm"
+        :rules="modifyFormRules"
+        :model="userModifyForm"
+      >
+        <FormItem label="用户姓名" prop="username">
+          <Input
+            v-model="userModifyForm.username"
+            placeholder="请输入用户姓名"
+          />
+        </FormItem>
+        <FormItem label="登录账号" prop="loginname">
+          <Input
+            v-model="userModifyForm.loginname"
+            placeholder="请输入登录账号"
+          />
+        </FormItem>
+        <FormItem label="登录密码" prop="loginpwd">
+          <Input
+            v-model="userModifyForm.loginpwd"
+            placeholder="请输入登录密码"
+          />
+        </FormItem>
+        <FormItem label="手机号" prop="userphone">
+          <Input
+            v-model="userModifyForm.userphone"
+            placeholder="请输入手机号"
+          />
+        </FormItem>
+      </Form>
+      <div slot="footer" style="text-align: right">
+        <Button @click="userModifyForm.show = false">取消</Button>
+        <Button @click="toSaveModifyUser()" type="primary">保存</Button>
+      </div>
+    </Modal>
+  </div>
 </template>
 
 <script>
+import { dh_list, dh_save, dh_update, dh_remove } from "@/api";
+import { dateFormat } from "@/utils";
 export default {
   data() {
-    return {};
+    // 手机号验证
+    const phoneCheck = async (rule, value, callback) => {
+      var filter = /^[1][3,4,5,6,7,8,9][0-9]{9}$/;
+      if (!value) {
+        return;
+      }
+      let blnTest = filter.test(value);
+      if (!blnTest) {
+        return callback(new Error("手机号码格式不正确"));
+      }
+    };
+    return {
+      dateFormat,
+      historySearch: {
+        page: 1,
+        size: 10,
+        dhyear: new Date(),
+        ltype: 1,
+        total: 0,
+        list: []
+      },
+      historyColumns: [
+        {
+          title: "序号",
+          width: 70,
+          render: (h, params) => {
+            return h(
+              "span",
+              params.index +
+                (this.historySearch.page - 1) * this.historySearch.size +
+                1
+            );
+          }
+        },
+        {
+          title: "年份",
+          key: "dhyear",
+          width: 80
+        },
+        {
+          title: "月份",
+          key: "dhmonth",
+          width: 90
+        },
+        {
+          title: "状态",
+          slot: "ltypeSlot",
+          width: 90
+        },
+        {
+          title: "内容",
+          key: "content"
+        },
+        {
+          title: "创建人",
+          key: "createname",
+          width: 120
+        },
+        {
+          title: "创建时间",
+          slot: "createtimeSlot",
+          width: 200
+        },
+        {
+          title: "操作",
+          slot: "actionSlot",
+          width: 150
+        }
+      ],
+      userAddForm: {
+        show: false,
+        username: "",
+        loginname: "",
+        loginpwd: "",
+        userphone: null
+      },
+      addFormRules: {
+        username: [
+          {
+            required: true,
+            message: "用户姓名不能为空",
+            trigger: "blur"
+          }
+        ],
+        loginname: [
+          {
+            required: true,
+            message: "登录账号不能为空",
+            trigger: "blur"
+          },
+          {
+            min: 4,
+            max: 18,
+            message: "登录账号长度为4~18个字符",
+            trigger: "blur"
+          }
+        ],
+        loginpwd: [
+          {
+            required: true,
+            message: "登录密码不能为空",
+            trigger: "blur"
+          },
+          {
+            min: 6,
+            max: 16,
+            message: "登录密码长度为6~16个字符",
+            trigger: "blur"
+          }
+        ],
+        userphone: [{ validator: phoneCheck, trigger: "blur" }]
+      },
+      userModifyForm: {
+        show: false,
+        dhid: null,
+        username: "",
+        loginname: "",
+        loginpwd: "",
+        userphone: null
+      },
+      modifyFormRules: {
+        username: [
+          {
+            required: true,
+            message: "用户姓名不能为空",
+            trigger: "blur"
+          }
+        ],
+        loginname: [
+          {
+            required: true,
+            message: "登录账号不能为空",
+            trigger: "blur"
+          },
+          {
+            min: 4,
+            max: 18,
+            message: "登录账号长度为4~18个字符"
+          }
+        ],
+        loginpwd: [
+          // {
+          //   required: true,
+          //   message: "登录密码不能为空",
+          //   trigger: "blur",
+          // },
+          {
+            min: 6,
+            max: 16,
+            message: "登录密码长度为6~16个字符",
+            trigger: "blur"
+          }
+        ],
+        userphone: [{ validator: phoneCheck, trigger: "blur" }]
+      },
+      userInfo: {}
+    };
   },
-  methods: {}
+  created() {
+    this.userInfo = JSON.parse(localStorage.getItem("xhWebAdminUser"));
+    this.getHistoryList();
+  },
+  methods: {
+    searchList() {
+      this.historySearch.page = 1;
+      this.getHistoryList();
+    },
+    getHistoryList() {
+      dh_list({
+        page: this.historySearch.page,
+        size: this.historySearch.size,
+        dhyear: this.historySearch.dhyear.getFullYear(),
+        ltype: this.historySearch.ltype
+      })
+        .then((data) => {
+          if (data.code === 0) {
+            this.historySearch.total = data.obj.total;
+            this.historySearch.list = data.obj.list;
+          } else {
+            this.historySearch.total = 0;
+            this.historySearch.list = [];
+            this.$Message.error(data.msg);
+          }
+        })
+        .catch(() => {});
+    },
+    toDelHistory(dhid) {
+      this.$Modal.confirm({
+        title: "提示",
+        content: "您确定删除选中数据吗?",
+        onOk: () => {
+          dh_remove({ dhid }).then((res) => {
+            if (res.code == 0) {
+              this.$Message.success(res.msg);
+              this.searchList();
+            }
+          });
+        },
+        onCancel: () => {}
+      });
+    },
+    toAdd() {
+      this.userAddForm = {
+        show: true,
+        username: "",
+        loginname: "",
+        loginpwd: "",
+        userphone: null
+      };
+    },
+    toSaveAdd() {
+      this.$refs.userAddForm.validate((valid) => {
+        if (valid) {
+          dh_save({
+            username: this.userAddForm.username,
+            loginname: this.userAddForm.loginname,
+            loginpwd: this.userAddForm.loginpwd,
+            createid: this.userInfo.dhid,
+            userphone: this.userAddForm.userphone
+          }).then((data) => {
+            if (data.code === 0) {
+              this.userAddForm.show = false;
+              this.$Message.success(data.msg);
+              this.searchList();
+            } else {
+              this.$Message.error(data.msg);
+            }
+          });
+        }
+      });
+    },
+    toModifyHistory(user) {
+      this.userModifyForm = {
+        show: true,
+        dhid: user.dhid,
+        username: user.username,
+        loginname: user.loginname,
+        loginpwd: user.loginpwd,
+        userphone: user.userphone
+      };
+    },
+    toSaveModifyUser() {
+      this.$refs.userModifyForm.validate((valid) => {
+        if (valid) {
+          dh_update({
+            username: this.userModifyForm.username,
+            loginname: this.userModifyForm.loginname,
+            loginpwd: this.userModifyForm.loginpwd,
+            createid: this.userInfo.dhid,
+            userphone: this.userModifyForm.userphone,
+            dhid: this.userModifyForm.dhid
+          }).then((data) => {
+            if (data.code === 0) {
+              this.userModifyForm.show = false;
+              this.$Message.success(data.msg);
+              this.searchList();
+            } else {
+              this.$Message.error(data.msg);
+            }
+          });
+        }
+      });
+    },
+    changePage(page) {
+      this.historySearch.page = page;
+      this.getHistoryList();
+    }
+  }
 };
 </script>
 
-<style scoped lang="less"></style>
+<style scoped lang="less">
+.searchBox {
+  display: flex;
+  justify-content: space-between;
+  padding: 16px 0;
+}
+.foot_page {
+  padding: 16px 0;
+  text-align: right;
+}
+</style>