小满配置管理

src/views/xiaoman/config.vue

@@ -0,0 +1,238 @@
+<template>
+  <div class="tenant">
+    <div class="content">
+      <byTable
+        :source="sourceList.data"
+        :pagination="sourceList.pagination"
+        :config="config"
+        :loading="loading"
+        :selectConfig="selectConfig"
+        highlight-current-row
+        :action-list="[]"
+        @get-list="getList"
+      >
+      </byTable>
+    </div>
+  </div>
+
+  <el-dialog title="修改用户名密码" v-if="editShow" v-model="editShow" width="500" destroy-on-close>
+    <byForm :formConfig="configDataForm" :formOption="formOption" v-model="configData.data" :rules="rulesFollow" ref="configHandle">
+    </byForm>
+    <template #footer>
+      <el-button @click="editShow = false" size="large">取 消</el-button>
+      <el-button type="primary" @click="submitForm()" size="large">确 定</el-button>
+    </template>
+  </el-dialog>
+</template>
+
+<script setup>
+import { computed, ref } from "vue";
+import byTable from "@/components/byTable/index";
+import byForm from "@/components/byForm/index";
+import moment from "moment";
+import { ElMessage, ElMessageBox } from "element-plus";
+
+const { proxy } = getCurrentInstance();
+
+
+let rulesFollow = ref({
+  username: [{ required: true, message: "请输入用户名", trigger: "change" }],
+  password: [{ required: true, message: "请输入密码", trigger: "change" }],
+});
+const configHandle = ref(null);
+let configData = reactive({
+  data: {},
+});
+
+let editShow = ref(false);
+const formOption = reactive({
+  inline: true,
+  labelWidth: 100,
+  itemWidth: 100,
+  rules: [],
+});
+
+const configDataForm = computed(() => {
+  return [
+    {
+      type: "input",
+      label: "用户名",
+      prop: "username",
+      itemWidth: 100,
+    },
+    {
+      type: "input",
+      label: "密码",
+      prop: "password",
+      itemWidth: 100,
+    },
+  ];
+});
+
+
+
+const sourceList = ref({
+  data: [],
+  pagination: {
+    total: 0,
+    pageNum: 1,
+    pageSize: 10,
+    keyword: "",
+    status: "",
+    sellCorporationId: "",
+  },
+});
+const loading = ref(false);
+const selectConfig = computed(() => {
+  return [
+  ];
+});
+const config = computed(() => {
+  return [
+    {
+      attrs: {
+        label: "小满CRM账号",
+        prop: "username",
+        width: 200,
+      },
+    },
+    {
+      attrs: {
+        label: "小满CRM账号密码",
+        prop: "password",
+        "min-width": 220,
+      },
+    },
+    {
+      attrs: {
+        label: "client_id",
+        prop: "clientId",
+        width: 160,
+      },
+    },
+    {
+      attrs: {
+        label: "client_secret",
+        prop: "clientSecret",
+        width: 160,
+      },
+    },
+    {
+      attrs: {
+        label: "access_token",
+        prop: "accessToken",
+        "min-width": 220,
+      },
+    },
+    {
+      attrs: {
+        label: "token过期时间",
+        prop: "expireTime",
+        width: 180,
+      },
+    },
+    {
+      attrs: {
+        label: "最后一次获取token时间",
+        prop: "lastTokenTime",
+        width: 180,
+      },
+    },
+    {
+      attrs: {
+          label: "操作",
+          width: 180,
+          align: "center",
+          fixed: "right",
+      },
+        renderHTML(row) {
+          return [
+            {
+              attrs: {
+                  label: "修改",
+                  type: "primary",
+                  text: true,
+              },
+              el: "button",
+              click() {
+                editConfig(row);
+              },
+            },
+          ];
+        },
+    },
+  ];
+});
+
+
+
+const getList = async (req) => {
+  sourceList.value.pagination = { ...sourceList.value.pagination, ...req };
+  loading.value = true;
+  proxy.post("/xiaomanConfig/page", sourceList.value.pagination).then((res) => {
+    res.rows.forEach((x) => {
+      x.addTagShow = false;
+      if (x.tag) {
+        x.tags = x.tag.split(",");
+      } else {
+        x.tags = [];
+      }
+    });
+    sourceList.value.data = res.rows;
+    sourceList.value.pagination.total = res.total;
+    setTimeout(() => {
+      loading.value = false;
+    }, 200);
+  });
+};
+
+const editConfig = (item) => {
+  configData.data = {
+    id: item.id,
+    username: item.username,
+    password: '',
+  };
+  editShow.value = true;
+};
+
+const submitForm = () => {
+  configHandle.value.handleSubmit(() => {
+    proxy
+      .post("/xiaomanConfig/edit", configData.data)
+      .then(
+        () => {
+          ElMessage({
+            message: "保存成功",
+            type: "success",
+          });
+          editShow.value = false;
+          getList();
+        },
+        (err) => {
+          console.log(err);
+        }
+      );
+  });
+};
+
+getList();
+</script>
+
+<style lang="scss" scoped>
+.tenant {
+  padding: 20px;
+}
+::v-deep(.el-input-number .el-input__inner) {
+  text-align: left;
+}
+.baseRow {
+  min-height: 24px;
+  border-top: 1px solid black;
+  border-left: 1px solid black;
+}
+.contentRow {
+  border-right: 1px solid black;
+  line-height: 24px;
+  padding-left: 4px;
+}
+</style>