bugfix

src/views/admin/agent/service/matching-demand/index.vue

@@ -0,0 +1,175 @@
+<script setup>
+import { reactive, ref, toRefs } from "vue";
+import FieldSingle from "@/views/components/FieldSingle";
+import dayjs from "dayjs";
+import {
+  insertBrokerEnterprise,
+  listBrokerEnterprise,
+} from "@/api/admin/agent/service/enterprise";
+import { ElMessage } from "element-plus";
+
+const dataList = ref([]);
+const loading = ref(true);
+const total = ref(0);
+const showSearch = ref(true);
+const showDialog = ref();
+const queryRef = ref();
+const fieldRef = ref();
+const formRef = ref();
+const data = reactive({
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    enterpriseName: null,
+  },
+  form: {},
+  rules: {
+    enterpriseName: [
+      {
+        required: true,
+        message: "请输入企业名称",
+        trigger: "blur",
+      },
+    ],
+  },
+});
+const { queryParams, form, rules } = toRefs(data);
+
+const getList = async () => {
+  loading.value = true;
+  const resp = await listBrokerEnterprise(queryParams.value);
+  dataList.value = resp.rows;
+  total.value = resp.total;
+  loading.value = false;
+};
+
+/** 搜索按钮操作 */
+const handleQuery = () => {
+  queryParams.value.pageNum = 1;
+  getList();
+};
+
+/** 重置按钮操作 */
+const resetQuery = () => {
+  if (queryRef.value) {
+    queryRef.value.resetFields();
+    handleQuery();
+  }
+};
+
+const reset = () => {
+  form.value = {
+    enterpriseName: null,
+    industrys: [],
+  };
+  formRef.value?.resetFields();
+};
+const handleAdd = () => {
+  reset();
+  showDialog.value = true;
+};
+
+const submitForm = async () => {
+  formRef.value.validate(async (valid) => {
+    const fieldValid = await fieldRef.value.validateForm();
+    if (valid && fieldValid) {
+      if (form.value.id) {
+        /*TODO edit*/
+      } else {
+        /*TODO add*/
+        insertBrokerEnterprise(form.value).then(() => {
+          ElMessage.success("新增企业成功");
+        });
+      }
+    } else {
+      console.log("校验未通过");
+    }
+  });
+};
+const cancel = () => {
+  reset();
+  showDialog.value = false;
+};
+</script>
+
+<template>
+  <div class="app-container">
+    <el-form
+      v-show="showSearch"
+      ref="queryRef"
+      :inline="true"
+      :model="queryParams"
+    >
+      <el-form-item label="企业名称" prop="title">
+        <el-input
+          v-model="queryParams.title"
+          clearable
+          placeholder="请输入企业名称"
+          size="small"
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+
+      <el-form-item>
+        <el-button
+          icon="Search"
+          size="small"
+          type="primary"
+          @click="handleQuery"
+          >搜索
+        </el-button>
+        <el-button icon="Refresh" size="small" @click="resetQuery"
+          >重置
+        </el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-table :data="dataList">
+      <el-table-column align="center" label="企业名称" prop="name" />
+      <el-table-column align="center" label="所属领域" prop="name" />
+      <el-table-column align="center" label="需求数量" prop="name" />
+      <el-table-column align="center" label="正在服务需求数" prop="name" />
+      <el-table-column align="center" label="已完成需求数" prop="name" />
+      <el-table-column align="center" label="添加时间" prop="name">
+        <template #default="{ row }">
+          {{ dayjs(row.createTime).format("YYYY-MM-DD HH:mm:ss") }}
+        </template>
+      </el-table-column>
+      <el-table-column align="center" label="操作">
+        <template #default="{ row }">
+          <el-button link size="small" type="primary" @click=""
+            >查看详情</el-button
+          >
+          <el-button link size="small" type="primary">承接需求</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total > 0"
+      v-model:limit="queryParams.pageSize"
+      v-model:page="queryParams.pageNum"
+      :total="total"
+      @pagination="getList"
+    />
+    <el-dialog v-model="showDialog" append-to-body width="800px">
+      <el-form ref="formRef" :label-width="120" :model="form" :rules="rules">
+        <el-form-item label="企业名称" prop="enterpriseName">
+          <el-input v-model="form.enterpriseName" />
+        </el-form-item>
+        <!--        <el-form-item>-->
+        <field-single ref="fieldRef" v-model="form" />
+        <!--        </el-form-item>-->
+        <!--        <field-options />-->
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="submitForm">确 定</el-button>
+          <el-button @click="cancel">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<style lang="scss" scoped></style>