sc

src/views/Customer/AppletUser/index.vue

@@ -0,0 +1,118 @@
+<template>
+  <div>
+    <el-form :model="searchForm" inline @submit.prevent>
+      <el-form-item>
+        <el-input
+          v-model="searchForm.phone"
+          placeholder="请输入手机号"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-select
+          v-model="searchForm.resellMan"
+          placeholder="选择分销人"
+          clearable
+          filterable
+          @change="handleQuery"
+        >
+          <el-option
+            v-for="item in resellOptions"
+            :key="item.distributionId"
+            :label="item.name"
+            :value="item.distributionId"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item>
+        <el-date-picker
+          v-model="searchForm.createDate"
+          type="daterange"
+          range-separator="-"
+          start-placeholder="注册日期"
+          end-placeholder="注册日期"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button @click="handleQuery">搜索</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-table v-loading="loading" :data="tableList" border stripe>
+      <el-table-column type="index" width="50" />
+      <el-table-column label="手机号码" prop="phone" width="120" />
+      <el-table-column label="分销人" prop="distributionName" min-width="120" />
+      <el-table-column label="注册日期" prop="registerDate" min-width="120" />
+      <el-table-column label="最近登陆日期" prop="lastLoginTime" min-width="120" />
+    </el-table>
+    <Pagination
+      :total="total"
+      v-model:page="searchForm.pageNo"
+      v-model:limit="searchForm.pageSize"
+      @pagination="getList"
+    />
+  </div>
+</template>
+
+<script name="AppletUser" setup>
+// import { removeNullField } from '@/utils'
+// import * as CustomerApi from '@/api/customer/customer.js'
+
+const searchForm = ref({
+  resellMan: undefined,
+  phone: '',
+  createDate: [],
+  pageNo: 1,
+  pageSize: 20
+})
+
+const resellOptions = ref([])
+
+onMounted(() => {
+  // CustomerApi.getCustomerExamCarType().then((res) => {
+  //   carTypeOptions.value = res
+  // })
+  handleQuery()
+})
+
+/** 搜索按钮操作 */
+const handleQuery = () => {
+  searchForm.value.pageNo = 1
+  getList()
+}
+
+const loading = ref(false)
+const tableList = ref([])
+const total = ref(0)
+/** 查询列表 */
+const getList = async () => {
+  loading.value = true
+  try {
+    // const data = await CustomerApi.getCustomerPage(removeNullField(searchForm.value))
+    const data = {
+      list: [
+        {
+          phone: '12345678901',
+          distributionName: '分销人A',
+          registerDate: '2023-10-01',
+          lastLoginTime: '2023-10-02'
+        },
+        {
+          phone: '12345678902',
+          distributionName: '分销人B',
+          registerDate: '2023-10-03',
+          lastLoginTime: '2023-10-04'
+        }
+      ],
+      total: 2
+    }
+    tableList.value = data.list
+    total.value = data.total
+  } finally {
+    loading.value = false
+  }
+}
+</script>
+
+<style lang="scss" scoped></style>