完成订单模块

src/views/booking/account/components/merchantAccountEdit.vue

@@ -75,16 +75,19 @@
   import { ref, reactive, watch } from 'vue';
   import { Form, message } from 'ant-design-vue';
   import { assignObject, uuid } from 'ele-admin-pro';
-  import { addMerchantAccount, updateMerchantAccount } from '@/api/shop/merchantAccount';
+  import {
+    addMerchantAccount,
+    updateMerchantAccount
+  } from '@/api/shop/merchantAccount';
   import { MerchantAccount } from '@/api/shop/merchantAccount/model';
   import { useThemeStore } from '@/store/modules/theme';
   import { storeToRefs } from 'pinia';
   import { ItemType } from 'ele-admin-pro/es/ele-image-upload/types';
   import { FormInstance } from 'ant-design-vue/es/form';
   import { FileRecord } from '@/api/system/file/model';
-  import {DictData} from "@/api/system/dict-data/model";
-  import {Merchant} from "@/api/shop/merchant/model";
-  import {Role} from "@/api/system/role/model";
+  import { DictData } from '@/api/system/dict-data/model';
+  import { Merchant } from '@/api/shop/merchant/model';
+  import { Role } from '@/api/system/role/model';
 
   // 是否是修改
   const isUpdate = ref(false);
@@ -196,7 +199,7 @@
   const chooseRoleId = (item: Role) => {
     form.roleId = item.roleId;
     form.roleName = item.roleName;
-  }
+  };
 
   const { resetFields } = useForm(form, rules);
 
@@ -212,7 +215,9 @@
         const formData = {
           ...form
         };
-        const saveOrUpdate = isUpdate.value ? updateMerchantAccount : addMerchantAccount;
+        const saveOrUpdate = isUpdate.value
+          ? updateMerchantAccount
+          : addMerchantAccount;
         saveOrUpdate(formData)
           .then((msg) => {
             loading.value = false;

src/views/booking/card/components/search.vue

@@ -8,7 +8,6 @@
       <span>添加</span>
     </a-button>
     <a-radio-group v-model:value="where.cardCode" @change="handleSearch">
-      <a-radio-button :value="undefined">全部</a-radio-button>
       <a-radio-button :value="`月/年卡`">月/年卡</a-radio-button>
       <a-radio-button :value="`次卡`">次卡</a-radio-button>
       <a-radio-button :value="`充值卡`">充值卡</a-radio-button>
@@ -44,7 +43,7 @@
 
   // 表单数据
   const { where } = useSearch<any>({
-    cardCode: ''
+    cardCode: '月/年卡'
   });
 
   const handleSearch = () => {

src/views/booking/field/components/category-edit.vue

@@ -0,0 +1,289 @@
+<!-- 分类编辑弹窗 -->
+<template>
+  <ele-modal
+    :width="620"
+    :visible="visible"
+    :confirm-loading="loading"
+    :title="isUpdate ? '修改分类' : '添加分类'"
+    :body-style="{ paddingBottom: '8px' }"
+    @update:visible="updateVisible"
+    @ok="save"
+  >
+    <a-form
+      ref="formRef"
+      :model="form"
+      :rules="rules"
+      :label-col="styleResponsive ? { md: 7, sm: 4, xs: 24 } : { flex: '90px' }"
+      :wrapper-col="
+        styleResponsive ? { md: 18, sm: 20, xs: 24 } : { flex: '1' }
+      "
+    >
+      <a-row :gutter="16">
+        <a-col
+          v-bind="styleResponsive ? { md: 12, sm: 24, xs: 24 } : { span: 12 }"
+        >
+          <a-form-item label="上级分类" name="parentId">
+            <a-tree-select
+              allow-clear
+              :tree-data="categoryList"
+              tree-default-expand-all
+              placeholder="请选择上级分类"
+              :value="form.parentId || undefined"
+              :dropdown-style="{ maxHeight: '360px', overflow: 'auto' }"
+              @update:value="(value?: number) => (form.parentId = value)"
+            />
+          </a-form-item>
+          <a-form-item label="分类名称" name="title">
+            <a-input
+              allow-clear
+              placeholder="请输入分类名称"
+              v-model:value="form.title"
+              @pressEnter="save"
+            />
+          </a-form-item>
+        </a-col>
+        <a-col
+          v-bind="styleResponsive ? { md: 12, sm: 24, xs: 24 } : { span: 12 }"
+        >
+          <a-form-item label="排序号" name="sortNumber">
+            <a-input-number
+              :min="0"
+              :max="99999"
+              class="ele-fluid"
+              placeholder="请输入排序号"
+              v-model:value="form.sortNumber"
+            />
+          </a-form-item>
+          <a-form-item label="是否展示" name="status">
+            <a-switch
+              checked-children="是"
+              un-checked-children="否"
+              :checked="form.status === 0"
+              @update:checked="updateHideValue"
+            />
+          </a-form-item>
+        </a-col>
+      </a-row>
+      <div style="margin-bottom: 22px">
+        <a-divider />
+      </div>
+      <a-form-item
+        label="备注"
+        name="comments"
+        :label-col="
+          styleResponsive ? { md: 3, sm: 4, xs: 24 } : { flex: '90px' }
+        "
+        :wrapper-col="
+          styleResponsive ? { md: 21, sm: 20, xs: 24 } : { flex: '1' }
+        "
+      >
+        <a-textarea
+          :rows="4"
+          :maxlength="200"
+          placeholder="请输入备注信息"
+          v-model:value="form.comments"
+        />
+      </a-form-item>
+    </a-form>
+  </ele-modal>
+</template>
+
+<script lang="ts" setup>
+  import { ref, reactive, watch } from 'vue';
+  import { Form, message } from 'ant-design-vue';
+  import { assignObject } from 'ele-admin-pro';
+  import {
+    addArticleCategory,
+    updateArticleCategory
+  } from '@/api/cms/category';
+  import type { ArticleCategory } from '@/api/cms/category/model';
+  import { useThemeStore } from '@/store/modules/theme';
+  import { storeToRefs } from 'pinia';
+  import { Design } from '@/api/cms/design/model';
+  import type { Rule } from 'ant-design-vue/es/form';
+
+  const useForm = Form.useForm;
+
+  const emit = defineEmits<{
+    (e: 'done'): void;
+    (e: 'update:visible', visible: boolean): void;
+  }>();
+
+  const props = defineProps<{
+    // 弹窗是否打开
+    visible: boolean;
+    // 修改回显的数据
+    data?: ArticleCategory | null;
+    // 分类id
+    categoryId?: number;
+    // 全部分类
+    categoryList: ArticleCategory[];
+  }>();
+
+  // 是否开启响应式布局
+  const themeStore = useThemeStore();
+  const { styleResponsive } = storeToRefs(themeStore);
+
+  // 是否是修改
+  const isUpdate = ref(false);
+
+  // 提交状态
+  const loading = ref(false);
+
+  // 表单数据
+  const form = reactive<ArticleCategory>({
+    categoryId: undefined,
+    type: 0,
+    title: '',
+    parentId: undefined,
+    image: '',
+    path: '/article/:id',
+    component: '/article/index',
+    pageId: undefined,
+    pageName: '',
+    status: 0,
+    showIndex: 0,
+    recommend: 0,
+    sortNumber: 100
+  });
+
+  // 表单验证规则
+  const rules = reactive({
+    type: [
+      {
+        required: true,
+        message: '请选择分类类型',
+        type: 'number',
+        trigger: 'blur'
+      }
+    ],
+    title: [
+      {
+        required: true,
+        message: '请输入分类名称',
+        type: 'string',
+        trigger: 'blur'
+      }
+    ],
+    sortNumber: [
+      {
+        required: true,
+        message: '请输入排序号',
+        type: 'number',
+        trigger: 'blur'
+      }
+    ],
+    status: [
+      {
+        required: true,
+        message: '请设置是否展示',
+        type: 'number',
+        trigger: 'blur'
+      }
+    ],
+    meta: [
+      {
+        type: 'string',
+        validator: async (_rule: Rule, value: string) => {
+          if (value) {
+            const msg = '请输入正确的JSON格式';
+            try {
+              const obj = JSON.parse(value);
+              if (typeof obj !== 'object' || obj === null) {
+                return Promise.reject(msg);
+              }
+            } catch (_e) {
+              return Promise.reject(msg);
+            }
+          }
+          return Promise.resolve();
+        },
+        trigger: 'blur'
+      }
+    ]
+  });
+
+  const { resetFields, validate } = useForm(form, rules);
+
+  const onType = (index: number) => {
+    if (index == 0) {
+      form.path = '/article/:id';
+      form.component = '/article/index';
+    }
+    if (index == 1) {
+      form.path = '/page/:id';
+      form.component = '/about/index';
+    }
+    if (index == 2) {
+      form.path = undefined;
+      form.component = '';
+    }
+  };
+
+  const choosePageId = (data: Design) => {
+    form.pageName = data.name;
+    form.pageId = data.pageId;
+    form.title = data.name;
+  };
+
+  const updateHideValue = (value: boolean) => {
+    form.status = value ? 0 : 1;
+  };
+
+  const updateIndexValue = (value: boolean) => {
+    form.showIndex = value ? 1 : 0;
+  };
+
+  const updateRecommendValue = (value: boolean) => {
+    form.recommend = value ? 1 : 0;
+  };
+
+  /* 保存编辑 */
+  const save = () => {
+    validate()
+      .then(() => {
+        loading.value = true;
+        const categoryData = {
+          ...form,
+          parentId: form.parentId || 0
+        };
+        const saveOrUpdate = isUpdate.value
+          ? updateArticleCategory
+          : addArticleCategory;
+        saveOrUpdate(categoryData)
+          .then((msg) => {
+            loading.value = false;
+            message.success(msg);
+            updateVisible(false);
+            emit('done');
+          })
+          .catch((e) => {
+            loading.value = false;
+            message.error(e.message);
+          });
+      })
+      .catch(() => {});
+  };
+
+  /* 更新visible */
+  const updateVisible = (value: boolean) => {
+    emit('update:visible', value);
+  };
+
+  watch(
+    () => props.visible,
+    (visible) => {
+      if (visible) {
+        if (props.data) {
+          assignObject(form, props.data);
+          isUpdate.value = true;
+        } else {
+          form.parentId = props.categoryId;
+          isUpdate.value = false;
+        }
+      } else {
+        resetFields();
+      }
+    }
+  );
+</script>

src/views/booking/field/components/category-select.vue

@@ -1,4 +1,4 @@
-<!-- 机构选择下拉框 -->
+<!-- 目录选择下拉框 -->
 <template>
   <a-tree-select
     allow-clear
@@ -12,7 +12,7 @@
 </template>
 
 <script lang="ts" setup>
-  import type { Organization } from '@/api/system/organization/model';
+  import type { Article } from '@/api/cms/article/model';
 
   const emit = defineEmits<{
     (e: 'update:value', value?: number): void;
@@ -23,12 +23,12 @@
       // 选中的数据(v-modal)
       value?: number;
       // 提示信息
-      placeholder?: string;
-      // 机构数据
-      data: Organization[];
+      placeholder?: any;
+      // 文章分类
+      data: Article[];
     }>(),
     {
-      placeholder: '请选择角色'
+      placeholder: '请选择上级分类'
     }
   );
 

src/views/booking/field/components/field-search.vue

@@ -0,0 +1,85 @@
+<!-- 搜索表单 -->
+<template>
+  <a-space :size="10" style="flex-wrap: wrap">
+    <a-button type="primary" class="ele-btn-icon" @click="add">
+      <template #icon>
+        <plus-outlined />
+      </template>
+      <span>添加</span>
+    </a-button>
+    <a-button
+      danger
+      type="primary"
+      class="ele-btn-icon"
+      @click="removeBatch"
+      :disabled="props.selection?.length === 0"
+    >
+      <template #icon>
+        <delete-outlined />
+      </template>
+      <span>批量删除</span>
+    </a-button>
+    <a-input-search
+      allow-clear
+      v-model:value="where.keywords"
+      placeholder="请输入关键词"
+      @search="search"
+      @pressEnter="search"
+    />
+    <a-button
+      type="primary"
+      style="background-color: var(--orange-6); border-color: var(--orange-5)"
+      @click="openPeriod"
+      >查看场馆时段</a-button
+    >
+  </a-space>
+</template>
+
+<script lang="ts" setup>
+  import { PlusOutlined, DeleteOutlined } from '@ant-design/icons-vue';
+  import useSearch from '@/utils/use-search';
+  import type { FieldParam } from '@/api/booking/field/model';
+  import { watch } from 'vue';
+
+  const emit = defineEmits<{
+    (e: 'search', where?: FieldParam): void;
+    (e: 'add'): void;
+    (e: 'remove'): void;
+    (e: 'period'): void;
+  }>();
+
+  const props = defineProps<{
+    // 勾选的项目
+    selection?: [];
+  }>();
+
+  // 表单数据
+  const { where } = useSearch<FieldParam>({
+    keywords: ''
+  });
+
+  /* 搜索 */
+  const search = () => {
+    emit('search', where);
+  };
+
+  /*  添加 */
+  const add = () => {
+    emit('add');
+  };
+
+  const openPeriod = () => {
+    emit('period');
+  };
+
+  // 批量删除
+  const removeBatch = () => {
+    emit('remove');
+  };
+
+  // 监听变化
+  watch(
+    () => props.selection,
+    () => {}
+  );
+</script>

src/views/booking/field/components/fieldEdit.vue

@@ -0,0 +1,232 @@
+<!-- 编辑弹窗 -->
+<template>
+  <ele-modal
+    :width="800"
+    :visible="visible"
+    :maskClosable="false"
+    :maxable="maxable"
+    :title="isUpdate ? '编辑场馆场地' : '添加场馆场地'"
+    :body-style="{ paddingBottom: '28px' }"
+    @update:visible="updateVisible"
+    @ok="save"
+  >
+    <a-form
+      ref="formRef"
+      :model="form"
+      :rules="rules"
+      :label-col="styleResponsive ? { md: 4, sm: 5, xs: 24 } : { flex: '90px' }"
+      :wrapper-col="
+        styleResponsive ? { md: 19, sm: 19, xs: 24 } : { flex: '1' }
+      "
+    >
+      <a-form-item label="场地名称" name="fieldName">
+        <a-input
+          allow-clear
+          placeholder="请输入场地名称"
+          v-model:value="form.fieldName"
+        />
+      </a-form-item>
+      <a-form-item label="是否可预订半场" name="isHalf">
+        <a-radio-group v-model:value="form.isHalf">
+          <a-radio :value="1">可以</a-radio>
+          <a-radio :value="2">不可以</a-radio>
+        </a-radio-group>
+      </a-form-item>
+      <a-form-item label="是否可重复预定" name="isRepeat">
+        <a-radio-group v-model:value="form.isRepeat">
+          <a-radio :value="1">可以</a-radio>
+          <a-radio :value="2">不可以</a-radio>
+        </a-radio-group>
+      </a-form-item>
+      <a-form-item label="可重复预订数" name="num" v-if="form.isRepeat == 1">
+        <a-input-number
+          allow-clear
+          style="width: 120px"
+          placeholder="可重复预订数"
+          v-model:value="form.num"
+        />
+      </a-form-item>
+
+      <a-form-item label="是否是卫生间" name="isToilet">
+        <a-radio-group v-model:value="form.isToilet">
+          <a-radio :value="1">是</a-radio>
+          <a-radio :value="2">否</a-radio>
+        </a-radio-group>
+      </a-form-item>
+      <a-form-item label="是否支持儿童价" name="isChildren">
+        <a-radio-group v-model:value="form.isChildren">
+          <a-radio :value="1">支持</a-radio>
+          <a-radio :value="2">不支持</a-radio>
+        </a-radio-group>
+      </a-form-item>
+      <a-form-item label="显示在第几行" name="row">
+        <a-input
+          allow-clear
+          placeholder="请输入显示在第几行"
+          v-model:value="form.row"
+        />
+      </a-form-item>
+      <a-form-item label="备注" name="comments">
+        <a-textarea
+          :rows="4"
+          :maxlength="200"
+          placeholder="请输入描述"
+          v-model:value="form.comments"
+        />
+      </a-form-item>
+      <a-form-item label="场地状态" name="isStatus">
+        <a-radio-group v-model:value="form.isStatus">
+          <a-radio :value="1">开启</a-radio>
+          <a-radio :value="2">关闭</a-radio>
+        </a-radio-group>
+      </a-form-item>
+      <a-form-item label="排序号" name="sortNumber">
+        <a-input-number
+          :min="0"
+          :max="9999"
+          class="ele-fluid"
+          placeholder="请输入排序号"
+          v-model:value="form.sortNumber"
+        />
+      </a-form-item>
+    </a-form>
+  </ele-modal>
+</template>
+
+<script lang="ts" setup>
+  import { ref, reactive, watch } from 'vue';
+  import { Form, message } from 'ant-design-vue';
+  import { assignObject, uuid } from 'ele-admin-pro';
+  import { addField, updateField } from '@/api/booking/field';
+  import { Field } from '@/api/booking/field/model';
+  import { useThemeStore } from '@/store/modules/theme';
+  import { storeToRefs } from 'pinia';
+  import { ItemType } from 'ele-admin-pro/es/ele-image-upload/types';
+  import { FormInstance } from 'ant-design-vue/es/form';
+
+  // 是否是修改
+  const isUpdate = ref(false);
+  const useForm = Form.useForm;
+  // 是否开启响应式布局
+  const themeStore = useThemeStore();
+  const { styleResponsive } = storeToRefs(themeStore);
+
+  const props = defineProps<{
+    // 弹窗是否打开
+    visible: boolean;
+    // 商户ID
+    categoryId?: number;
+    // 修改回显的数据
+    data?: Field | null;
+  }>();
+
+  const emit = defineEmits<{
+    (e: 'done'): void;
+    (e: 'update:visible', visible: boolean): void;
+  }>();
+
+  // 提交状态
+  const loading = ref(false);
+  // 是否显示最大化切换按钮
+  const maxable = ref(true);
+  // 表格选中数据
+  const formRef = ref<FormInstance | null>(null);
+  const images = ref<ItemType[]>([]);
+
+  // 用户信息
+  const form = reactive<Field>({
+    fieldId: undefined,
+    fieldName: undefined,
+    image: undefined,
+    categoryId: 0,
+    userId: 0,
+    teacherId: 0,
+    merchantId: 0,
+    isHalf: 2,
+    isRepeat: 2,
+    isToilet: 2,
+    isChildren: 2,
+    row: undefined,
+    num: 0,
+    startTime: undefined,
+    maxNumber: undefined,
+    address: '',
+    comments: '',
+    isStatus: 1,
+    status: 0,
+    sortNumber: 0
+  });
+
+  /* 更新visible */
+  const updateVisible = (value: boolean) => {
+    emit('update:visible', value);
+  };
+
+  // 表单验证规则
+  const rules = reactive({
+    fieldName: [
+      {
+        required: true,
+        type: 'string',
+        message: '请填写场馆场地名称',
+        trigger: 'blur'
+      }
+    ]
+  });
+
+  const { resetFields } = useForm(form, rules);
+
+  /* 保存编辑 */
+  const save = () => {
+    if (!formRef.value) {
+      return;
+    }
+    formRef.value
+      .validate()
+      .then(() => {
+        loading.value = true;
+        form.merchantId = props.categoryId;
+        const formData = {
+          ...form
+        };
+        const saveOrUpdate = isUpdate.value ? updateField : addField;
+        saveOrUpdate(formData)
+          .then((msg) => {
+            loading.value = false;
+            message.success(msg);
+            updateVisible(false);
+            emit('done');
+          })
+          .catch((e) => {
+            loading.value = false;
+            message.error(e.message);
+          });
+      })
+      .catch(() => {});
+  };
+
+  watch(
+    () => props.visible,
+    (visible) => {
+      if (visible) {
+        images.value = [];
+        if (props.data) {
+          assignObject(form, props.data);
+          if (props.data.image) {
+            images.value.push({
+              uid: uuid(),
+              url: props.data.image,
+              status: 'done'
+            });
+          }
+          isUpdate.value = true;
+        } else {
+          isUpdate.value = false;
+        }
+      } else {
+        resetFields();
+      }
+    },
+    { immediate: true }
+  );
+</script>

src/views/booking/field/dictionary/source-select.vue

@@ -1,7 +1,6 @@
-<!-- 角色选择下拉框 -->
+<!-- 文章来源选择下拉框 -->
 <template>
   <a-select
-    show-search
     optionFilterProp="label"
     :options="data"
     allow-clear
@@ -9,6 +8,7 @@
     :placeholder="placeholder"
     @update:value="updateValue"
     @blur="onBlur"
+    @change="onChange"
   />
 </template>
 
@@ -18,6 +18,7 @@
   const emit = defineEmits<{
     (e: 'update:value', value: string): void;
     (e: 'blur'): void;
+    (e: 'change'): void;
   }>();
 
   withDefaults(
@@ -26,12 +27,12 @@
       placeholder?: string;
     }>(),
     {
-      placeholder: '请选择性别'
+      placeholder: '请选择文章来源'
     }
   );
 
   // 字典数据
-  const data = getDictionaryOptions('sex');
+  const data = getDictionaryOptions('articleSource');
 
   /* 更新选中数据 */
   const updateValue = (value: string) => {
@@ -42,4 +43,9 @@
   const onBlur = () => {
     emit('blur');
   };
+
+  /* 选择事件 */
+  const onChange = (e) => {
+    emit('change', e);
+  };
 </script>

src/views/booking/field/index.vue

@@ -0,0 +1,208 @@
+<template>
+  <div class="ele-body">
+    <a-card :bordered="false" :body-style="{ padding: '16px' }">
+      <ele-split-layout
+        width="266px"
+        allow-collapse
+        :right-style="{ overflow: 'hidden' }"
+        :style="{ minHeight: 'calc(100vh - 152px)' }"
+      >
+        <div>
+          <ele-toolbar theme="default">
+            <span class="ele-text-heading">场馆列表</span>
+          </ele-toolbar>
+          <div class="ele-border-split sys-category-list">
+            <a-tree
+              :tree-data="data"
+              v-model:expanded-keys="expandedRowKeys"
+              v-model:selected-keys="selectedRowKeys"
+              :show-line="true"
+              :show-icon="false"
+              @select="onTreeSelect"
+            >
+              <template #title="{ type, key: treeKey, title }">
+                <a-dropdown :trigger="['contextmenu']">
+                  <span>{{ title }}</span>
+                  <template #overlay v-if="type == 0">
+                    <a-menu
+                      @click="
+                        ({ key: menuKey }) =>
+                          onContextMenuClick(treeKey, menuKey)
+                      "
+                    >
+                      <a-menu-item key="1">修改</a-menu-item>
+                      <a-menu-item key="2">删除</a-menu-item>
+                    </a-menu>
+                  </template>
+                </a-dropdown>
+              </template>
+            </a-tree>
+          </div>
+        </div>
+        <template #content>
+          <list
+            v-if="current"
+            :category-list="data"
+            :data="current"
+            :category-id="current.merchantId"
+          />
+        </template>
+      </ele-split-layout>
+    </a-card>
+    <!-- 编辑弹窗 -->
+    <category-edit
+      v-model:visible="showEdit"
+      :data="editData"
+      :category-list="data"
+      :category-id="current?.categoryId"
+      @done="query"
+    />
+  </div>
+</template>
+
+<script lang="ts" setup>
+  import { createVNode, ref } from 'vue';
+  import { message, Modal } from 'ant-design-vue';
+  import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
+  import { eachTreeData } from 'ele-admin-pro';
+  import List from './list.vue';
+  import CategoryEdit from './components/category-edit.vue';
+  import { removeMerchant } from '@/api/shop/merchant';
+  import { Merchant } from '@/api/shop/merchant/model';
+  import { listMerchant } from '@/api/shop/merchant';
+
+  // 加载状态
+  const loading = ref(true);
+
+  // 树形数据
+  const data = ref<Merchant[]>([]);
+
+  // 树展开的key
+  const expandedRowKeys = ref<number[]>([]);
+
+  // 树选中的key
+  const selectedRowKeys = ref<number[]>([]);
+
+  // 选中数据
+  const current = ref<Merchant | any>(null);
+
+  // 是否显示表单弹窗
+  const showEdit = ref(false);
+
+  // 编辑回显数据
+  const editData = ref<Merchant | null>(null);
+
+  /* 查询 */
+  const query = () => {
+    loading.value = true;
+    listMerchant()
+      .then((list) => {
+        loading.value = false;
+        const eks: number[] = [];
+        list.forEach((d) => {
+          d.key = d.merchantId;
+          d.value = d.merchantId;
+          if (typeof d.merchantId === 'number') {
+            eks.push(d.merchantId);
+          }
+        });
+        expandedRowKeys.value = eks;
+        data.value = list.map((d) => {
+          d.key = d.merchantId;
+          d.value = d.merchantId;
+          d.title = d.merchantName;
+          return d;
+        });
+        // data.value = toTreeData({
+        //   data: list,
+        //   idField: 'categoryId',
+        //   parentIdField: 'parentId'
+        // });
+        if (list.length) {
+          if (typeof list[0].merchantId === 'number') {
+            selectedRowKeys.value = [list[0].merchantId];
+          }
+          current.value = list[0];
+        } else {
+          selectedRowKeys.value = [];
+          current.value = null;
+        }
+      })
+      .catch((e) => {
+        loading.value = false;
+        message.error(e.message);
+      });
+  };
+
+  /* 选择数据 */
+  const onTreeSelect = () => {
+    current.value = {};
+    eachTreeData(data.value, (d) => {
+      if (
+        typeof d.merchantId === 'number' &&
+        selectedRowKeys.value.includes(d.merchantId)
+      ) {
+        current.value = d;
+        return false;
+      }
+    });
+  };
+
+  const onContextMenuClick = (treeKey: number, menuKey: number) => {
+    // 修改
+    if (menuKey == 1) {
+      openEdit(current.value);
+    }
+    // 删除
+    if (menuKey == 2) {
+      remove();
+    }
+  };
+
+  /* 打开编辑弹窗 */
+  const openEdit = (item?: Merchant | null) => {
+    editData.value = item ?? null;
+    showEdit.value = true;
+  };
+
+  /* 删除 */
+  const remove = () => {
+    Modal.confirm({
+      title: '提示',
+      content: '确定要删除选中的分类吗?',
+      icon: createVNode(ExclamationCircleOutlined),
+      maskClosable: true,
+      onOk: () => {
+        const hide = message.loading('请求中..', 0);
+        removeMerchant(current.value?.categoryId)
+          .then((msg) => {
+            hide();
+            message.success(msg);
+            query();
+          })
+          .catch((e) => {
+            hide();
+            message.error(e.message);
+          });
+      }
+    });
+  };
+
+  query();
+</script>
+
+<script lang="ts">
+  export default {
+    name: 'ArticleIndex'
+  };
+</script>
+
+<style lang="less" scoped>
+  .sys-category-list {
+    padding: 12px 6px;
+    height: calc(100vh - 242px);
+    border-width: 1px;
+    border-style: solid;
+    overflow: auto;
+  }
+</style>

src/views/booking/field/list.vue

@@ -0,0 +1,313 @@
+<template>
+  <!-- 表格 -->
+  <ele-pro-table
+    ref="tableRef"
+    row-key="fieldId"
+    :columns="columns"
+    :datasource="datasource"
+    v-model:selection="selection"
+    :customRow="customRow"
+    height="calc(100vh - 290px)"
+    tool-class="ele-toolbar-form"
+    :scroll="{ x: 800 }"
+  >
+    <template #toolbar>
+      <field-search
+        :selection="selection"
+        @search="reload"
+        @add="openEdit()"
+        @period="openPeriod()"
+        @remove="removeBatch"
+      />
+    </template>
+    <template #bodyCell="{ column, record }">
+      <template v-if="column.key === 'fieldName'">
+        {{ record.fieldName }}
+      </template>
+      <template v-if="column.key === 'isToilet'">
+        <a-tag v-if="record.isToilet == 1" color="green">是</a-tag>
+        <a-tag v-else>否</a-tag>
+      </template>
+      <template v-if="column.key === 'isHalf'">
+        <a-tag v-if="record.isHalf == 2">不可以</a-tag>
+        <a-tag v-if="record.isHalf == 1" color="green">可以</a-tag>
+      </template>
+      <template v-if="column.key === 'isChildren'">
+        <a-tag v-if="record.isChildren == 2">不支持</a-tag>
+        <a-tag v-if="record.isChildren == 1" color="green">支持</a-tag>
+      </template>
+      <template v-if="column.key === 'isRepeat'">
+        <a-tag v-if="record.isRepeat == 2">不可以</a-tag>
+        <a-tag v-if="record.isRepeat == 1" color="green">可以</a-tag>
+      </template>
+      <template v-if="column.key === 'isStatus'">
+        <a-tag v-if="record.isStatus == 2">关闭</a-tag>
+        <a-tag v-if="record.isStatus == 1" color="green">开启</a-tag>
+      </template>
+      <template v-else-if="column.key === 'action'">
+        <a-space>
+          <a @click="openEdit(record)">修改</a>
+          <a-divider type="vertical" />
+          <a-popconfirm
+            title="确定要删除此场馆场地吗？"
+            @confirm="remove(record)"
+          >
+            <a class="ele-text-danger">删除</a>
+          </a-popconfirm>
+        </a-space>
+      </template>
+    </template>
+  </ele-pro-table>
+  <!-- 编辑弹窗 -->
+  <field-edit
+    :data="current"
+    v-model:visible="showEdit"
+    :category-list="categoryList"
+    :category-id="categoryId"
+    @done="reload"
+  />
+  <!-- 时段弹窗 -->
+  <PeriodEdit
+    v-model:visible="showPeriodEidt"
+    :category-id="categoryId"
+    :data="data"
+    @done="reload"
+  />
+</template>
+
+<script lang="ts" setup>
+  import { createVNode, ref, watch } from 'vue';
+  import { message, Modal } from 'ant-design-vue';
+  import type { EleProTable } from 'ele-admin-pro';
+  import type {
+    DatasourceFunction,
+    ColumnItem
+  } from 'ele-admin-pro/es/ele-pro-table/types';
+  import { toDateString } from 'ele-admin-pro';
+  import FieldSearch from './components/field-search.vue';
+  import FieldEdit from './components/fieldEdit.vue';
+  import {
+    pageField,
+    removeField,
+    removeBatchField
+  } from '@/api/booking/field';
+  import type { Field, FieldParam } from '@/api/booking/field/model';
+  import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
+  import { Merchant } from '@/api/shop/merchant/model';
+  import PeriodEdit from './period/index.vue';
+
+  const props = defineProps<{
+    // 场馆场地 id
+    categoryId?: number;
+    // 全部分类
+    categoryList: Merchant[];
+    // 当期选中
+    data: Merchant;
+  }>();
+
+  // 表格实例
+  const tableRef = ref<InstanceType<typeof EleProTable> | null>(null);
+
+  // 表格选中数据
+  const selection = ref<any[]>([]);
+  // 表格列配置
+  const columns = ref<ColumnItem[]>([
+    // {
+    //   key: 'index',
+    //   width: 48,
+    //   align: 'center',
+    //   fixed: 'left',
+    //   hideInSetting: true,
+    //   customRender: ({ index }) => index + (tableRef.value?.tableIndex ?? 0)
+    // },
+    {
+      title: 'ID',
+      width: 80,
+      dataIndex: 'fieldId'
+    },
+    {
+      title: '场地名称',
+      dataIndex: 'fieldName',
+      key: 'fieldName'
+    },
+    {
+      title: '显示在第几行',
+      dataIndex: 'row',
+      key: 'row'
+    },
+    {
+      title: '可重复预订次数',
+      dataIndex: 'num',
+      key: 'num'
+    },
+    {
+      title: '是否是卫生间',
+      dataIndex: 'isToilet',
+      key: 'isToilet',
+      align: 'center',
+      customRender: ({ text }) => (text == true ? '否' : '是')
+    },
+    {
+      title: '是否可预订半场',
+      dataIndex: 'isHalf',
+      key: 'isHalf',
+      align: 'center'
+    },
+    {
+      title: '是否支持儿童价',
+      dataIndex: 'isChildren',
+      key: 'isChildren',
+      align: 'center',
+      customRender: ({ text }) => (text == true ? '不支持' : '支持')
+    },
+    {
+      title: '是否可重复预订',
+      dataIndex: 'isRepeat',
+      key: 'isRepeat',
+      align: 'center',
+      customRender: ({ text }) => (text == true ? '不可以' : '可以')
+    },
+    {
+      title: '场地状态',
+      dataIndex: 'isStatus',
+      key: 'isStatus',
+      align: 'center',
+      customRender: ({ text }) => (text == 1 ? '开启' : '关闭')
+    },
+    {
+      title: '排序',
+      dataIndex: 'sortNumber',
+      width: 100,
+      align: 'center'
+    },
+    {
+      title: '创建时间',
+      dataIndex: 'createTime',
+      key: 'createTime',
+      width: 120,
+      align: 'center',
+      sorter: true,
+      ellipsis: true,
+      customRender: ({ text }) => toDateString(text, 'yyyy-MM-dd')
+    },
+    {
+      title: '操作',
+      key: 'action',
+      width: 100,
+      align: 'center'
+    }
+  ]);
+
+  // 当前编辑数据
+  const current = ref<Field | null>(null);
+  // 是否显示编辑弹窗
+  const showEdit = ref(false);
+  // 是否显示时段弹窗
+  const showPeriodEidt = ref(false);
+
+  // 表格数据源
+  const datasource: DatasourceFunction = ({
+    page,
+    limit,
+    where,
+    orders,
+    filters
+  }) => {
+    if (props.categoryId) {
+      where.merchantId = props.categoryId;
+    }
+    // 按条件排序
+    if (filters) {
+      where.virtualViews = filters.virtualViews;
+      where.actualViews = filters.actualViews;
+      where.sortNumber = filters.sortNumber;
+      where.status = filters.status;
+    }
+    return pageField({
+      ...where,
+      ...orders,
+      page,
+      limit
+    });
+  };
+
+  /* 搜索 */
+  const reload = (where?: FieldParam) => {
+    selection.value = [];
+    tableRef?.value?.reload({ where: where });
+  };
+
+  /* 打开编辑弹窗 */
+  const openEdit = (row?: Field) => {
+    current.value = row ?? null;
+    showEdit.value = true;
+  };
+
+  const openPeriod = () => {
+    showPeriodEidt.value = true;
+  };
+
+  /* 删除单个 */
+  const remove = (row: Field) => {
+    const hide = message.loading('请求中..', 0);
+    removeField(row.fieldId)
+      .then((msg) => {
+        hide();
+        message.success(msg);
+        reload();
+      })
+      .catch((e) => {
+        hide();
+        message.error(e.message);
+      });
+  };
+
+  /* 批量删除 */
+  const removeBatch = () => {
+    if (!selection.value.length) {
+      message.error('请至少选择一条数据');
+      return;
+    }
+    Modal.confirm({
+      title: '提示',
+      content: '确定要删除选中的记录吗?',
+      icon: createVNode(ExclamationCircleOutlined),
+      maskClosable: true,
+      onOk: () => {
+        const hide = message.loading('请求中..', 0);
+        removeBatchField(selection.value.map((d) => d.fieldId))
+          .then((msg) => {
+            hide();
+            message.success(msg);
+            reload();
+          })
+          .catch((e) => {
+            hide();
+            message.error(e.message);
+          });
+      }
+    });
+  };
+
+  /* 自定义行属性 */
+  const customRow = (record: Field) => {
+    return {
+      // 行点击事件
+      onClick: () => {
+        // console.log(record);
+      },
+      // 行双击事件
+      onDblclick: () => {
+        openEdit(record);
+      }
+    };
+  };
+
+  // 监听场馆场地 id 变化
+  watch(
+    () => props.categoryId,
+    () => {
+      reload();
+    }
+  );
+</script>

src/views/booking/field/period/components/periodEdit.vue

@@ -0,0 +1,283 @@
+<!-- 编辑弹窗 -->
+<template>
+  <ele-modal
+    :width="800"
+    :visible="visible"
+    :maskClosable="false"
+    :title="isUpdate ? '编辑时段' : '添加时段'"
+    :body-style="{ paddingBottom: '28px' }"
+    @update:visible="updateVisible"
+    @ok="save"
+  >
+    <a-spin :spinning="loading">
+      <a-form
+        ref="formRef"
+        :model="form"
+        :rules="rules"
+        :label-col="
+          styleResponsive ? { md: 4, sm: 5, xs: 24 } : { flex: '90px' }
+        "
+        :wrapper-col="
+          styleResponsive ? { md: 19, sm: 19, xs: 24 } : { flex: '1' }
+        "
+      >
+        <a-form-item label="时段" name="timePeriod">
+          <a-time-picker
+            v-model:value="form.timePeriod1"
+            format="HH:mm"
+            valueFormat="HH:mm"
+          />
+          -
+          <a-time-picker
+            v-model:value="form.timePeriod2"
+            format="HH:mm"
+            valueFormat="HH:mm"
+          />
+        </a-form-item>
+        <a-form-item label="价格" name="price">
+          <a-input-number
+            allow-clear
+            placeholder="请输入价格"
+            style="width: 200px"
+            v-model:value="form.price"
+          />
+        </a-form-item>
+        <!--      <a-form-item label="每日不同价格" name="prices">-->
+        <!--        <a-input-number-->
+        <!--          allow-clear-->
+        <!--          style="width: 200px"-->
+        <!--          placeholder="请输入每日不同价格"-->
+        <!--          v-model:value="form.prices"-->
+        <!--        />-->
+        <!--      </a-form-item>-->
+        <a-form-item label="半场价格" name="halfPrice">
+          <a-input-number
+            allow-clear
+            style="width: 200px"
+            placeholder="请输入半场价格"
+            v-model:value="form.halfPrice"
+          />
+        </a-form-item>
+        <!--      <a-form-item label="每日不同半场价格" name="halfPrices">-->
+        <!--        <a-input-number-->
+        <!--          allow-clear-->
+        <!--          style="width: 200px"-->
+        <!--          placeholder="请输入每日不同半场价格"-->
+        <!--          v-model:value="form.halfPrices"-->
+        <!--        />-->
+        <!--      </a-form-item>-->
+        <a-form-item label="儿童价" name="childrenPrice">
+          <a-input-number
+            allow-clear
+            style="width: 200px"
+            placeholder="请输入儿童价"
+            v-model:value="form.childrenPrice"
+          />
+        </a-form-item>
+        <a-form-item label="星期选择" name="week">
+          <a-select
+            v-model:value="form.week"
+            :options="weekOptions"
+            mode="tags"
+            placeholder="星期选择"
+            style="width: 200px"
+          />
+        </a-form-item>
+        <a-form-item label="排序" name="sortNumber">
+          <a-input-number
+            :min="0"
+            :max="9999"
+            class="ele-fluid"
+            placeholder="请输入排序号"
+            v-model:value="form.sortNumber"
+          />
+        </a-form-item>
+        <a-form-item label="是否关闭" name="isStatus">
+          <a-radio-group v-model:value="form.isStatus">
+            <a-radio :value="1">开启</a-radio>
+            <a-radio :value="2">关闭</a-radio>
+          </a-radio-group>
+        </a-form-item>
+        <a-form-item label="是否免费" name="isFree">
+          <a-radio-group v-model:value="form.isFree">
+            <a-radio :value="1">免费</a-radio>
+            <a-radio :value="2">收费</a-radio>
+          </a-radio-group>
+        </a-form-item>
+        <a-form-item label="备注" name="comments">
+          <a-textarea
+            :rows="4"
+            :maxlength="200"
+            placeholder="请输入描述"
+            v-model:value="form.comments"
+          />
+        </a-form-item>
+      </a-form>
+    </a-spin>
+  </ele-modal>
+</template>
+
+<script lang="ts" setup>
+  import { ref, reactive, watch } from 'vue';
+  import { Form, message } from 'ant-design-vue';
+  import { assignObject } from 'ele-admin-pro';
+  import { addPeriod, updatePeriod } from '@/api/booking/period';
+  import { Period } from '@/api/booking/period/model';
+  import { useThemeStore } from '@/store/modules/theme';
+  import { storeToRefs } from 'pinia';
+  import { FormInstance, RuleObject } from 'ant-design-vue/es/form';
+  import { Merchant } from '@/api/shop/merchant/model';
+
+  // 是否是修改
+  const isUpdate = ref(false);
+  const useForm = Form.useForm;
+  // 是否开启响应式布局
+  const themeStore = useThemeStore();
+  const { styleResponsive } = storeToRefs(themeStore);
+
+  const props = defineProps<{
+    // 弹窗是否打开
+    visible: boolean;
+    // 商户ID
+    merchantId?: number;
+    // 商户信息
+    merchant?: Merchant | null;
+    // 修改回显的数据
+    data?: Period | null;
+  }>();
+
+  const emit = defineEmits<{
+    (e: 'done'): void;
+    (e: 'update:visible', visible: boolean): void;
+  }>();
+
+  // 提交状态
+  const loading = ref(false);
+  // 表格选中数据
+  const formRef = ref<FormInstance | null>(null);
+  const weekOptions = ref([
+    { label: '星期一', value: '1' },
+    { label: '星期二', value: '2' },
+    { label: '星期三', value: '3' },
+    { label: '星期四', value: '4' },
+    { label: '星期五', value: '5' },
+    { label: '星期六', value: '6' },
+    { label: '星期日', value: '7' }
+  ]);
+
+  // 用户信息
+  const form = reactive<Period>({
+    periodId: undefined,
+    timePeriod: '',
+    timePeriod1: undefined,
+    timePeriod2: undefined,
+    price: 0,
+    prices: '',
+    halfPrice: 0,
+    halfPrices: '',
+    childrenPrice: 0,
+    week: undefined,
+    sortNumber: 0,
+    merchantId: 0,
+    isStatus: 1,
+    isFree: 2,
+    startTime: '',
+    comments: '',
+    status: 0
+  });
+
+  /* 更新visible */
+  const updateVisible = (value: boolean) => {
+    emit('update:visible', value);
+  };
+
+  // 表单验证规则
+  const rules = reactive({
+    period: [
+      {
+        required: true,
+        type: 'string',
+        message: '请填写时段,如红色、L码、远峰蓝、原色钛金属等',
+        trigger: 'blur'
+      }
+    ],
+    timePeriod: [
+      {
+        required: true,
+        type: 'string',
+        message: '请选择时段',
+        trigger: 'blur',
+        validator: async (_rule: RuleObject, value: string) => {
+          if (form.timePeriod1 == undefined || form.timePeriod2 == undefined) {
+            return Promise.reject('请选择时段' + value);
+          }
+          return Promise.resolve();
+        }
+      }
+    ]
+  });
+
+  const { resetFields } = useForm(form, rules);
+
+  /* 保存编辑 */
+  const save = () => {
+    if (!formRef.value) {
+      return;
+    }
+    formRef.value
+      .validate()
+      .then(() => {
+        loading.value = true;
+        form.merchantId = props.merchantId;
+        if (!form.merchantId || form.merchantId == 0) {
+          return;
+        }
+        form.week = JSON.stringify(form.week);
+        form.prices = JSON.stringify(form.prices);
+        form.halfPrices = JSON.stringify(form.halfPrices);
+        form.timePeriod = `${form.timePeriod1} - ${form.timePeriod2}`;
+        form.startTime = `${form.timePeriod1?.replace(':', '')}`;
+        const formData = {
+          ...form
+        };
+        const saveOrUpdate = isUpdate.value ? updatePeriod : addPeriod;
+        saveOrUpdate(formData)
+          .then((msg) => {
+            loading.value = false;
+            message.success(msg);
+            updateVisible(false);
+            emit('done');
+          })
+          .catch((e) => {
+            loading.value = false;
+            message.error(e.message);
+          });
+      })
+      .catch(() => {});
+  };
+
+  watch(
+    () => props.visible,
+    (visible) => {
+      if (visible) {
+        if (props.data) {
+          assignObject(form, props.data);
+          if (props.data.timePeriod) {
+            const strings = props.data.timePeriod.split('-');
+            form.timePeriod1 = strings[0].replace(' ', '');
+            form.timePeriod2 = strings[1].replace(' ', '');
+          }
+          if (props.data.week) {
+            form.week = JSON.parse(props.data.week);
+          }
+          isUpdate.value = true;
+        } else {
+          isUpdate.value = false;
+        }
+      } else {
+        resetFields();
+      }
+    },
+    { immediate: true }
+  );
+</script>

src/views/booking/field/period/components/search.vue

@@ -0,0 +1,42 @@
+<!-- 搜索表单 -->
+<template>
+  <a-space :size="10" style="flex-wrap: wrap">
+    <a-button type="primary" class="ele-btn-icon" @click="add">
+      <template #icon>
+        <PlusOutlined />
+      </template>
+      <span>添加</span>
+    </a-button>
+  </a-space>
+</template>
+
+<script lang="ts" setup>
+  import { PlusOutlined } from '@ant-design/icons-vue';
+  import type { GradeParam } from '@/api/user/grade/model';
+  import { watch } from 'vue';
+
+  const props = withDefaults(
+    defineProps<{
+      // 选中的角色
+      selection?: [];
+    }>(),
+    {}
+  );
+
+  const emit = defineEmits<{
+    (e: 'search', where?: GradeParam): void;
+    (e: 'add'): void;
+    (e: 'remove'): void;
+    (e: 'batchMove'): void;
+  }>();
+
+  // 新增
+  const add = () => {
+    emit('add');
+  };
+
+  watch(
+    () => props.selection,
+    () => {}
+  );
+</script>

src/views/booking/field/period/index.vue

@@ -0,0 +1,303 @@
+<template>
+  <a-drawer
+    width="70%"
+    :visible="visible"
+    :title="`${data?.merchantName}时段列表`"
+    :body-style="{ paddingBottom: '28px' }"
+    @update:visible="updateVisible"
+    :confirm-loading="loading"
+    :footer="null"
+  >
+    <ele-pro-table
+      ref="tableRef"
+      row-key="specValueId"
+      :columns="columns"
+      :datasource="datasource"
+      :customRow="customRow"
+      tool-class="ele-toolbar-form"
+      class="sys-org-table"
+    >
+      <template #toolbar>
+        <search
+          @search="reload"
+          :selection="selection"
+          @add="openEdit"
+          @remove="removeBatch"
+          @batchMove="openMove"
+        />
+      </template>
+      <template #bodyCell="{ column, record }">
+        <template v-if="column.key === 'isStatus'">
+          <a-tag v-if="record.isStatus === 1" color="green">开启</a-tag>
+          <a-tag v-if="record.isStatus === 2" color="red">关闭</a-tag>
+        </template>
+        <template v-if="column.key === 'isFree'">
+          <a-tag v-if="record.isFree === 1" color="green">免费</a-tag>
+          <a-tag v-if="record.isFree === 2" color="orange">收费</a-tag>
+        </template>
+        <template v-if="column.key === 'action'">
+          <a-space>
+            <a @click="moveUp(record)">上移<ArrowUpOutlined /></a>
+            <a-divider type="vertical" />
+            <a @click="openEdit(record)">编辑</a>
+            <a-divider type="vertical" />
+            <a-popconfirm
+              title="确定要删除此记录吗？"
+              @confirm="remove(record)"
+            >
+              <a class="ele-text-danger">删除</a>
+            </a-popconfirm>
+          </a-space>
+        </template>
+      </template>
+    </ele-pro-table>
+    <!-- 编辑弹窗 -->
+    <PeriodEdit
+      v-model:visible="showEdit"
+      :merchant="data"
+      :merchantId="categoryId"
+      :data="current"
+      @done="reload"
+    />
+  </a-drawer>
+</template>
+
+<script lang="ts" setup>
+  import { createVNode, ref, watch } from 'vue';
+  import { message, Modal } from 'ant-design-vue';
+  import {
+    ArrowUpOutlined,
+    ExclamationCircleOutlined
+  } from '@ant-design/icons-vue';
+  import { EleProTable } from 'ele-admin-pro';
+  import type {
+    DatasourceFunction,
+    ColumnItem
+  } from 'ele-admin-pro/es/ele-pro-table/types';
+  import Search from './components/search.vue';
+  import PeriodEdit from './components/periodEdit.vue';
+  import {
+    pagePeriod,
+    removePeriod,
+    removeBatchPeriod,
+    updatePeriod
+  } from '@/api/booking/period';
+  import type { Period, PeriodParam } from '@/api/booking/period/model';
+  import { Merchant } from '@/api/shop/merchant/model';
+
+  const props = defineProps<{
+    // 弹窗是否打开
+    visible: boolean;
+    // 修改回显的数据
+    categoryId?: number | null;
+    // 商户信息
+    data?: Merchant;
+  }>();
+
+  const emit = defineEmits<{
+    (e: 'done'): void;
+    (e: 'update:visible', visible: boolean): void;
+  }>();
+
+  /* 更新visible */
+  const updateVisible = (value: boolean) => {
+    emit('update:visible', value);
+  };
+
+  // 表格实例
+  const tableRef = ref<InstanceType<typeof EleProTable> | null>(null);
+  // 表格选中数据
+  const selection = ref<Period[]>([]);
+  // 当前编辑数据
+  const current = ref<Period | null>(null);
+  // 是否显示编辑弹窗
+  const showEdit = ref(false);
+  // 是否显示批量移动弹窗
+  const showMove = ref(false);
+  // 加载状态
+  const loading = ref(true);
+
+  // 表格数据源
+  const datasource: DatasourceFunction = ({
+    page,
+    limit,
+    where,
+    orders,
+    filters
+  }) => {
+    if (filters) {
+      where.status = filters.status;
+    }
+    where.merchantId = props.categoryId;
+    return pagePeriod({
+      ...where,
+      ...orders,
+      page,
+      limit
+    });
+  };
+
+  // 表格列配置
+  const columns = ref<ColumnItem[]>([
+    {
+      title: 'ID',
+      dataIndex: 'periodId',
+      key: 'periodId',
+      width: 90
+    },
+    {
+      title: '时段',
+      dataIndex: 'timePeriod',
+      key: 'timePeriod',
+      align: 'center'
+    },
+    {
+      title: '价格',
+      dataIndex: 'price',
+      key: 'price',
+      align: 'center'
+    },
+    {
+      title: '半场价格',
+      dataIndex: 'halfPrice',
+      key: 'halfPrice',
+      align: 'center'
+    },
+    {
+      title: '儿童价',
+      dataIndex: 'childrenPrice',
+      key: 'childrenPrice',
+      align: 'center'
+    },
+    {
+      title: '时间段状态',
+      dataIndex: 'isStatus',
+      key: 'isStatus',
+      align: 'center'
+    },
+    {
+      title: '是否免费',
+      dataIndex: 'isFree',
+      key: 'isFree',
+      align: 'center'
+    },
+    {
+      title: '排序',
+      dataIndex: 'sortNumber',
+      key: 'sortNumber',
+      align: 'center'
+    },
+    {
+      title: '操作',
+      key: 'action',
+      width: 180,
+      fixed: 'right',
+      align: 'center',
+      hideInSetting: true
+    }
+  ]);
+
+  /* 搜索 */
+  const reload = (where?: PeriodParam) => {
+    selection.value = [];
+    tableRef?.value?.reload({ where: where });
+  };
+
+  /* 打开编辑弹窗 */
+  const openEdit = (row?: Period) => {
+    current.value = row ?? null;
+    // if (props.data?.specId) {
+    //   specId.value = props.data?.specId;
+    // }
+    showEdit.value = true;
+  };
+
+  /* 打开批量移动弹窗 */
+  const openMove = () => {
+    showMove.value = true;
+  };
+
+  /* 删除单个 */
+  const remove = (row: Period) => {
+    const hide = message.loading('请求中..', 0);
+    removePeriod(row.periodId)
+      .then((msg) => {
+        hide();
+        message.success(msg);
+        reload();
+      })
+      .catch((e) => {
+        hide();
+        message.error(e.message);
+      });
+  };
+
+  /* 批量删除 */
+  const removeBatch = () => {
+    if (!selection.value.length) {
+      message.error('请至少选择一条数据');
+      return;
+    }
+    Modal.confirm({
+      title: '提示',
+      content: '确定要删除选中的记录吗?',
+      icon: createVNode(ExclamationCircleOutlined),
+      maskClosable: true,
+      onOk: () => {
+        const hide = message.loading('请求中..', 0);
+        removeBatchPeriod(selection.value.map((d) => d.periodId))
+          .then((msg) => {
+            hide();
+            message.success(msg);
+            reload();
+          })
+          .catch((e) => {
+            hide();
+            message.error(e.message);
+          });
+      }
+    });
+  };
+
+  // 上移
+  const moveUp = (row?: Period) => {
+    updatePeriod({
+      periodId: row?.periodId,
+      sortNumber: Number(row?.sortNumber) - 1
+    }).then((msg) => {
+      message.success(msg);
+      reload();
+    });
+  };
+
+  /* 自定义行属性 */
+  const customRow = (record: Period) => {
+    return {
+      // 行点击事件
+      onClick: () => {
+        // console.log(record);
+      },
+      // 行双击事件
+      onDblclick: () => {
+        openEdit(record);
+      }
+    };
+  };
+
+  watch(
+    () => props.categoryId,
+    (categoryId) => {
+      if (categoryId) {
+        reload();
+      }
+    }
+  );
+</script>
+
+<script lang="ts">
+  export default {
+    name: 'Period'
+  };
+</script>
+
+<style lang="less" scoped></style>

src/views/booking/field/preview/index.vue

@@ -0,0 +1,82 @@
+<template>
+  <a-card class="ele-body">
+    <a-spin :spinning="spinning">
+      <a-typography-title :level="3" class="ele-text-center">{{
+        form.title
+      }}</a-typography-title>
+      <a-divider dashed />
+      <div class="content" v-html="form.content"></div>
+    </a-spin>
+  </a-card>
+</template>
+
+<script lang="ts" setup>
+  import { ref, unref, watch } from 'vue';
+  import { useRouter } from 'vue-router';
+  import { setPageTabTitle } from '@/utils/page-tab-util';
+  import { getArticle } from '@/api/cms/article';
+  import { Article } from '@/api/cms/article/model';
+  import useFormData from '@/utils/use-form-data';
+
+  const { currentRoute } = useRouter();
+  // 是否开启响应式布局
+  const title = ref('');
+  const spinning = ref(true);
+  // 应用信息
+  const { form, assignFields } = useFormData<Article>({
+    articleId: undefined,
+    title: '',
+    content: '',
+    createTime: ''
+  });
+
+  /**
+   * 加载数据
+   */
+  const reload = (id: number) => {
+    console.log(id);
+    // 加载项目详情
+    getArticle(id).then((data) => {
+      assignFields(data);
+      if (data.title) {
+        title.value = data.title;
+        // 修改页签标题
+        setPageTabTitle(data.title);
+      }
+      spinning.value = false;
+    });
+  };
+
+  watch(
+    currentRoute,
+    (route) => {
+      const { params } = unref(route);
+      const { id } = params;
+      if (id) {
+        reload(Number(id));
+      }
+    },
+    { immediate: true }
+  );
+</script>
+
+<script lang="ts">
+  export default {
+    name: 'ArticlePreview'
+  };
+</script>
+<style>
+  body {
+    background: #f0f2f5;
+  }
+  .ele-body {
+    margin: 0 auto;
+    max-width: 1000px;
+  }
+  .content {
+    padding: 10px;
+  }
+  * {
+    max-width: 100%;
+  }
+</style>

src/views/booking/integral/components/integralEdit.vue

@@ -0,0 +1,210 @@
+<!-- 编辑弹窗 -->
+<template>
+  <ele-modal
+    :width="800"
+    :visible="visible"
+    :maskClosable="false"
+    :maxable="maxable"
+    :title="isUpdate ? '编辑签到积分' : '添加签到积分'"
+    :body-style="{ paddingBottom: '28px' }"
+    @update:visible="updateVisible"
+    @ok="save"
+  >
+    <a-form
+      ref="formRef"
+      :model="form"
+      :rules="rules"
+      :label-col="styleResponsive ? { md: 4, sm: 5, xs: 24 } : { flex: '90px' }"
+      :wrapper-col="
+        styleResponsive ? { md: 19, sm: 19, xs: 24 } : { flex: '1' }
+      "
+    >
+      <a-form-item label="用户id" name="userId">
+        <a-input
+          allow-clear
+          placeholder="请输入用户id"
+          v-model:value="form.userId"
+        />
+      </a-form-item>
+      <a-form-item label="微信昵称" name="username">
+        <a-input
+          allow-clear
+          placeholder="请输入微信昵称"
+          v-model:value="form.username"
+        />
+      </a-form-item>
+      <a-form-item label="手机号码" name="phone">
+        <a-input
+          allow-clear
+          placeholder="请输入手机号码"
+          v-model:value="form.phone"
+        />
+      </a-form-item>
+      <a-form-item label="获得积分" name="integral">
+        <a-input
+          allow-clear
+          placeholder="请输入获得积分"
+          v-model:value="form.integral"
+        />
+      </a-form-item>
+      <a-form-item label="日期" name="dateTime">
+        <a-input
+          allow-clear
+          placeholder="请输入日期"
+          v-model:value="form.dateTime"
+        />
+      </a-form-item>
+      <a-form-item label="天" name="day">
+        <a-input
+          allow-clear
+          placeholder="请输入天"
+          v-model:value="form.day"
+        />
+      </a-form-item>
+    </a-form>
+  </ele-modal>
+</template>
+
+<script lang="ts" setup>
+  import { ref, reactive, watch } from 'vue';
+  import { Form, message } from 'ant-design-vue';
+  import { assignObject, uuid } from 'ele-admin-pro';
+  import { addIntegral, updateIntegral } from '@/api/booking/integral';
+  import { Integral } from '@/api/booking/integral/model';
+  import { useThemeStore } from '@/store/modules/theme';
+  import { storeToRefs } from 'pinia';
+  import { ItemType } from 'ele-admin-pro/es/ele-image-upload/types';
+  import { FormInstance } from 'ant-design-vue/es/form';
+  import { FileRecord } from '@/api/system/file/model';
+
+  // 是否是修改
+  const isUpdate = ref(false);
+  const useForm = Form.useForm;
+  // 是否开启响应式布局
+  const themeStore = useThemeStore();
+  const { styleResponsive } = storeToRefs(themeStore);
+
+  const props = defineProps<{
+    // 弹窗是否打开
+    visible: boolean;
+    // 修改回显的数据
+    data?: Integral | null;
+  }>();
+
+  const emit = defineEmits<{
+    (e: 'done'): void;
+    (e: 'update:visible', visible: boolean): void;
+  }>();
+
+  // 提交状态
+  const loading = ref(false);
+  // 是否显示最大化切换按钮
+  const maxable = ref(true);
+  // 表格选中数据
+  const formRef = ref<FormInstance | null>(null);
+  const images = ref<ItemType[]>([]);
+
+  // 用户信息
+  const form = reactive<Integral>({
+    id: undefined,
+    userId: undefined,
+    username: undefined,
+    phone: undefined,
+    integral: undefined,
+    dateTime: undefined,
+    day: undefined,
+    tenantId: undefined,
+    createTime: undefined,
+    integralId: undefined,
+    integralName: '',
+    status: 0,
+    comments: '',
+    sortNumber: 100
+  });
+
+  /* 更新visible */
+  const updateVisible = (value: boolean) => {
+    emit('update:visible', value);
+  };
+
+  // 表单验证规则
+  const rules = reactive({
+    integralName: [
+      {
+        required: true,
+        type: 'string',
+        message: '请填写签到积分名称',
+        trigger: 'blur'
+      }
+    ]
+  });
+
+  const chooseImage = (data: FileRecord) => {
+    images.value.push({
+      uid: data.id,
+      url: data.path,
+      status: 'done'
+    });
+    form.image = data.path;
+  };
+
+  const onDeleteItem = (index: number) => {
+    images.value.splice(index, 1);
+    form.image = '';
+  };
+
+  const { resetFields } = useForm(form, rules);
+
+  /* 保存编辑 */
+  const save = () => {
+    if (!formRef.value) {
+      return;
+    }
+    formRef.value
+      .validate()
+      .then(() => {
+        loading.value = true;
+        const formData = {
+          ...form
+        };
+        const saveOrUpdate = isUpdate.value ? updateIntegral : addIntegral;
+        saveOrUpdate(formData)
+          .then((msg) => {
+            loading.value = false;
+            message.success(msg);
+            updateVisible(false);
+            emit('done');
+          })
+          .catch((e) => {
+            loading.value = false;
+            message.error(e.message);
+          });
+      })
+      .catch(() => {});
+  };
+
+  watch(
+    () => props.visible,
+    (visible) => {
+      if (visible) {
+        images.value = [];
+        if (props.data) {
+          assignObject(form, props.data);
+          if(props.data.image){
+            images.value.push({
+              uid: uuid(),
+              url: props.data.image,
+              status: 'done'
+            })
+          }
+          isUpdate.value = true;
+        } else {
+          isUpdate.value = false;
+        }
+      } else {
+        resetFields();
+      }
+    },
+    { immediate: true }
+  );
+</script>

src/views/booking/integral/components/search.vue

@@ -0,0 +1,42 @@
+<!-- 搜索表单 -->
+<template>
+  <a-space :size="10" style="flex-wrap: wrap">
+    <a-button type="primary" class="ele-btn-icon" @click="add">
+      <template #icon>
+        <PlusOutlined />
+      </template>
+      <span>添加</span>
+    </a-button>
+  </a-space>
+</template>
+
+<script lang="ts" setup>
+  import { PlusOutlined } from '@ant-design/icons-vue';
+  import type { GradeParam } from '@/api/user/grade/model';
+  import { watch } from 'vue';
+
+  const props = withDefaults(
+    defineProps<{
+      // 选中的角色
+      selection?: [];
+    }>(),
+    {}
+  );
+
+  const emit = defineEmits<{
+    (e: 'search', where?: GradeParam): void;
+    (e: 'add'): void;
+    (e: 'remove'): void;
+    (e: 'batchMove'): void;
+  }>();
+
+  // 新增
+  const add = () => {
+    emit('add');
+  };
+
+  watch(
+    () => props.selection,
+    () => {}
+  );
+</script>

src/views/booking/integral/index.vue

@@ -0,0 +1,251 @@
+<template>
+  <div class="page">
+    <div class="ele-body">
+      <a-card :bordered="false" :body-style="{ padding: '16px' }">
+        <ele-pro-table
+          ref="tableRef"
+          row-key="integralId"
+          :columns="columns"
+          :datasource="datasource"
+          :customRow="customRow"
+          tool-class="ele-toolbar-form"
+          class="sys-org-table"
+        >
+          <template #toolbar>
+            <search
+              @search="reload"
+              :selection="selection"
+              @add="openEdit"
+              @remove="removeBatch"
+              @batchMove="openMove"
+            />
+          </template>
+          <template #bodyCell="{ column, record }">
+            <template v-if="column.key === 'image'">
+              <a-image :src="record.image" :width="50" />
+            </template>
+            <template v-if="column.key === 'status'">
+              <a-tag v-if="record.status === 0" color="green">显示</a-tag>
+              <a-tag v-if="record.status === 1" color="red">隐藏</a-tag>
+            </template>
+            <template v-if="column.key === 'action'">
+              <a-space>
+                <a @click="openEdit(record)">修改</a>
+                <a-divider type="vertical" />
+                <a-popconfirm
+                  title="确定要删除此记录吗？"
+                  @confirm="remove(record)"
+                >
+                  <a class="ele-text-danger">删除</a>
+                </a-popconfirm>
+              </a-space>
+            </template>
+          </template>
+        </ele-pro-table>
+      </a-card>
+
+      <!-- 编辑弹窗 -->
+      <IntegralEdit v-model:visible="showEdit" :data="current" @done="reload" />
+    </div>
+  </div>
+</template>
+
+<script lang="ts" setup>
+  import { createVNode, ref } from 'vue';
+  import { message, Modal } from 'ant-design-vue';
+  import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
+  import type { EleProTable } from 'ele-admin-pro';
+  import { toDateString } from 'ele-admin-pro';
+  import type {
+    DatasourceFunction,
+    ColumnItem
+  } from 'ele-admin-pro/es/ele-pro-table/types';
+  import Search from './components/search.vue';
+  import IntegralEdit from './components/integralEdit.vue';
+  import { pageIntegral, removeIntegral, removeBatchIntegral } from '@/api/booking/integral';
+  import type { Integral, IntegralParam } from '@/api/booking/integral/model';
+
+  // 表格实例
+  const tableRef = ref<InstanceType<typeof EleProTable> | null>(null);
+
+  // 表格选中数据
+  const selection = ref<Integral[]>([]);
+  // 当前编辑数据
+  const current = ref<Integral | null>(null);
+  // 是否显示编辑弹窗
+  const showEdit = ref(false);
+  // 是否显示批量移动弹窗
+  const showMove = ref(false);
+  // 加载状态
+  const loading = ref(true);
+
+  // 表格数据源
+  const datasource: DatasourceFunction = ({
+    page,
+    limit,
+    where,
+    orders,
+    filters
+  }) => {
+    if (filters) {
+      where.status = filters.status;
+    }
+    return pageIntegral({
+      ...where,
+      ...orders,
+      page,
+      limit
+    });
+  };
+
+  // 表格列配置
+  const columns = ref<ColumnItem[]>([
+    {
+      title: '',
+      dataIndex: 'id',
+      key: 'id',
+      align: 'center',
+      width: 90,
+    },
+    {
+      title: '用户id',
+      dataIndex: 'userId',
+      key: 'userId',
+      align: 'center',
+    },
+    {
+      title: '微信昵称',
+      dataIndex: 'username',
+      key: 'username',
+      align: 'center',
+    },
+    {
+      title: '手机号码',
+      dataIndex: 'phone',
+      key: 'phone',
+      align: 'center',
+    },
+    {
+      title: '获得积分',
+      dataIndex: 'integral',
+      key: 'integral',
+      align: 'center',
+    },
+    {
+      title: '日期',
+      dataIndex: 'dateTime',
+      key: 'dateTime',
+      align: 'center',
+    },
+    {
+      title: '天',
+      dataIndex: 'day',
+      key: 'day',
+      align: 'center',
+    },
+    {
+      title: '签到时间',
+      dataIndex: 'createTime',
+      key: 'createTime',
+      align: 'center',
+      sorter: true,
+      ellipsis: true,
+      customRender: ({ text }) => toDateString(text, 'yyyy-MM-dd')
+    },
+    {
+      title: '操作',
+      key: 'action',
+      width: 180,
+      fixed: 'right',
+      align: 'center',
+      hideInSetting: true
+    }
+  ]);
+
+  /* 搜索 */
+  const reload = (where?: IntegralParam) => {
+    selection.value = [];
+    tableRef?.value?.reload({ where: where });
+  };
+
+  /* 打开编辑弹窗 */
+  const openEdit = (row?: Integral) => {
+    current.value = row ?? null;
+    showEdit.value = true;
+  };
+
+  /* 打开批量移动弹窗 */
+  const openMove = () => {
+    showMove.value = true;
+  };
+
+  /* 删除单个 */
+  const remove = (row: Integral) => {
+    const hide = message.loading('请求中..', 0);
+    removeIntegral(row.integralId)
+      .then((msg) => {
+        hide();
+        message.success(msg);
+        reload();
+      })
+      .catch((e) => {
+        hide();
+        message.error(e.message);
+      });
+  };
+
+  /* 批量删除 */
+  const removeBatch = () => {
+    if (!selection.value.length) {
+      message.error('请至少选择一条数据');
+      return;
+    }
+    Modal.confirm({
+      title: '提示',
+      content: '确定要删除选中的记录吗?',
+      icon: createVNode(ExclamationCircleOutlined),
+      maskClosable: true,
+      onOk: () => {
+        const hide = message.loading('请求中..', 0);
+        removeBatchIntegral(selection.value.map((d) => d.integralId))
+          .then((msg) => {
+            hide();
+            message.success(msg);
+            reload();
+          })
+          .catch((e) => {
+            hide();
+            message.error(e.message);
+          });
+      }
+    });
+  };
+
+  /* 查询 */
+  const query = () => {
+    loading.value = true;
+  };
+
+  /* 自定义行属性 */
+  const customRow = (record: Integral) => {
+    return {
+      // 行点击事件
+      onClick: () => {
+        // console.log(record);
+      },
+      // 行双击事件
+      onDblclick: () => {
+        openEdit(record);
+      }
+    };
+  };
+  query();
+</script>
+
+<script lang="ts">
+  export default {
+    name: 'Integral'
+  };
+</script>
+
+<style lang="less" scoped></style>

src/views/booking/integralLog/components/integralLogEdit.vue

@@ -0,0 +1,234 @@
+<!-- 编辑弹窗 -->
+<template>
+  <ele-modal
+    :width="800"
+    :visible="visible"
+    :maskClosable="false"
+    :maxable="maxable"
+    :title="isUpdate ? '编辑积分明细' : '添加积分明细'"
+    :body-style="{ paddingBottom: '28px' }"
+    @update:visible="updateVisible"
+    @ok="save"
+  >
+    <a-form
+      ref="formRef"
+      :model="form"
+      :rules="rules"
+      :label-col="styleResponsive ? { md: 4, sm: 5, xs: 24 } : { flex: '90px' }"
+      :wrapper-col="
+        styleResponsive ? { md: 19, sm: 19, xs: 24 } : { flex: '1' }
+      "
+    >
+      <a-form-item label="场馆订单号" name="orderNum">
+        <a-input
+          allow-clear
+          placeholder="请输入场馆订单号"
+          v-model:value="form.orderNum"
+        />
+      </a-form-item>
+      <a-form-item label="订单id" name="oid">
+        <a-input
+          allow-clear
+          placeholder="请输入订单id"
+          v-model:value="form.oid"
+        />
+      </a-form-item>
+      <a-form-item label="场馆名称" name="siteName">
+        <a-input
+          allow-clear
+          placeholder="请输入场馆名称"
+          v-model:value="form.siteName"
+        />
+      </a-form-item>
+      <a-form-item label="微信昵称" name="username">
+        <a-input
+          allow-clear
+          placeholder="请输入微信昵称"
+          v-model:value="form.username"
+        />
+      </a-form-item>
+      <a-form-item label="手机号码" name="phone">
+        <a-input
+          allow-clear
+          placeholder="请输入手机号码"
+          v-model:value="form.phone"
+        />
+      </a-form-item>
+      <a-form-item label="获得积分" name="integral">
+        <a-input
+          allow-clear
+          placeholder="请输入获得积分"
+          v-model:value="form.integral"
+        />
+      </a-form-item>
+      <a-form-item label="变化前积分" name="oldMoney">
+        <a-input
+          allow-clear
+          placeholder="请输入变化前积分"
+          v-model:value="form.oldMoney"
+        />
+      </a-form-item>
+      <a-form-item label="变化后积分" name="newMoney">
+        <a-input
+          allow-clear
+          placeholder="请输入变化后积分"
+          v-model:value="form.newMoney"
+        />
+      </a-form-item>
+      <a-form-item label="描述" name="info">
+        <a-input
+          allow-clear
+          placeholder="请输入描述"
+          v-model:value="form.info"
+        />
+      </a-form-item>
+    </a-form>
+  </ele-modal>
+</template>
+
+<script lang="ts" setup>
+  import { ref, reactive, watch } from 'vue';
+  import { Form, message } from 'ant-design-vue';
+  import { assignObject, uuid } from 'ele-admin-pro';
+  import { addIntegralLog, updateIntegralLog } from '@/api/booking/integralLog';
+  import { IntegralLog } from '@/api/booking/integralLog/model';
+  import { useThemeStore } from '@/store/modules/theme';
+  import { storeToRefs } from 'pinia';
+  import { ItemType } from 'ele-admin-pro/es/ele-image-upload/types';
+  import { FormInstance } from 'ant-design-vue/es/form';
+  import { FileRecord } from '@/api/system/file/model';
+
+  // 是否是修改
+  const isUpdate = ref(false);
+  const useForm = Form.useForm;
+  // 是否开启响应式布局
+  const themeStore = useThemeStore();
+  const { styleResponsive } = storeToRefs(themeStore);
+
+  const props = defineProps<{
+    // 弹窗是否打开
+    visible: boolean;
+    // 修改回显的数据
+    data?: IntegralLog | null;
+  }>();
+
+  const emit = defineEmits<{
+    (e: 'done'): void;
+    (e: 'update:visible', visible: boolean): void;
+  }>();
+
+  // 提交状态
+  const loading = ref(false);
+  // 是否显示最大化切换按钮
+  const maxable = ref(true);
+  // 表格选中数据
+  const formRef = ref<FormInstance | null>(null);
+  const images = ref<ItemType[]>([]);
+
+  // 用户信息
+  const form = reactive<IntegralLog>({
+    id: undefined,
+    orderNum: undefined,
+    oid: undefined,
+    siteName: undefined,
+    username: undefined,
+    phone: undefined,
+    integral: undefined,
+    oldMoney: undefined,
+    newMoney: undefined,
+    info: undefined,
+    tenantId: undefined,
+    createTime: undefined,
+    integralLogId: undefined,
+    integralLogName: '',
+    status: 0,
+    comments: '',
+    sortNumber: 100
+  });
+
+  /* 更新visible */
+  const updateVisible = (value: boolean) => {
+    emit('update:visible', value);
+  };
+
+  // 表单验证规则
+  const rules = reactive({
+    integralLogName: [
+      {
+        required: true,
+        type: 'string',
+        message: '请填写积分明细名称',
+        trigger: 'blur'
+      }
+    ]
+  });
+
+  const chooseImage = (data: FileRecord) => {
+    images.value.push({
+      uid: data.id,
+      url: data.path,
+      status: 'done'
+    });
+    form.image = data.path;
+  };
+
+  const onDeleteItem = (index: number) => {
+    images.value.splice(index, 1);
+    form.image = '';
+  };
+
+  const { resetFields } = useForm(form, rules);
+
+  /* 保存编辑 */
+  const save = () => {
+    if (!formRef.value) {
+      return;
+    }
+    formRef.value
+      .validate()
+      .then(() => {
+        loading.value = true;
+        const formData = {
+          ...form
+        };
+        const saveOrUpdate = isUpdate.value ? updateIntegralLog : addIntegralLog;
+        saveOrUpdate(formData)
+          .then((msg) => {
+            loading.value = false;
+            message.success(msg);
+            updateVisible(false);
+            emit('done');
+          })
+          .catch((e) => {
+            loading.value = false;
+            message.error(e.message);
+          });
+      })
+      .catch(() => {});
+  };
+
+  watch(
+    () => props.visible,
+    (visible) => {
+      if (visible) {
+        images.value = [];
+        if (props.data) {
+          assignObject(form, props.data);
+          if(props.data.image){
+            images.value.push({
+              uid: uuid(),
+              url: props.data.image,
+              status: 'done'
+            })
+          }
+          isUpdate.value = true;
+        } else {
+          isUpdate.value = false;
+        }
+      } else {
+        resetFields();
+      }
+    },
+    { immediate: true }
+  );
+</script>

src/views/booking/integralLog/components/search.vue

@@ -0,0 +1,42 @@
+<!-- 搜索表单 -->
+<template>
+  <a-space :size="10" style="flex-wrap: wrap">
+    <a-button type="primary" class="ele-btn-icon" @click="add">
+      <template #icon>
+        <PlusOutlined />
+      </template>
+      <span>添加</span>
+    </a-button>
+  </a-space>
+</template>
+
+<script lang="ts" setup>
+  import { PlusOutlined } from '@ant-design/icons-vue';
+  import type { GradeParam } from '@/api/user/grade/model';
+  import { watch } from 'vue';
+
+  const props = withDefaults(
+    defineProps<{
+      // 选中的角色
+      selection?: [];
+    }>(),
+    {}
+  );
+
+  const emit = defineEmits<{
+    (e: 'search', where?: GradeParam): void;
+    (e: 'add'): void;
+    (e: 'remove'): void;
+    (e: 'batchMove'): void;
+  }>();
+
+  // 新增
+  const add = () => {
+    emit('add');
+  };
+
+  watch(
+    () => props.selection,
+    () => {}
+  );
+</script>

src/views/booking/integralLog/index.vue

@@ -0,0 +1,269 @@
+<template>
+  <div class="page">
+    <div class="ele-body">
+      <a-card :bordered="false" :body-style="{ padding: '16px' }">
+        <ele-pro-table
+          ref="tableRef"
+          row-key="integralLogId"
+          :columns="columns"
+          :datasource="datasource"
+          :customRow="customRow"
+          tool-class="ele-toolbar-form"
+          class="sys-org-table"
+        >
+          <template #toolbar>
+            <search
+              @search="reload"
+              :selection="selection"
+              @add="openEdit"
+              @remove="removeBatch"
+              @batchMove="openMove"
+            />
+          </template>
+          <template #bodyCell="{ column, record }">
+            <template v-if="column.key === 'image'">
+              <a-image :src="record.image" :width="50" />
+            </template>
+            <template v-if="column.key === 'status'">
+              <a-tag v-if="record.status === 0" color="green">显示</a-tag>
+              <a-tag v-if="record.status === 1" color="red">隐藏</a-tag>
+            </template>
+            <template v-if="column.key === 'action'">
+              <a-space>
+                <a @click="openEdit(record)">修改</a>
+                <a-divider type="vertical" />
+                <a-popconfirm
+                  title="确定要删除此记录吗？"
+                  @confirm="remove(record)"
+                >
+                  <a class="ele-text-danger">删除</a>
+                </a-popconfirm>
+              </a-space>
+            </template>
+          </template>
+        </ele-pro-table>
+      </a-card>
+
+      <!-- 编辑弹窗 -->
+      <IntegralLogEdit v-model:visible="showEdit" :data="current" @done="reload" />
+    </div>
+  </div>
+</template>
+
+<script lang="ts" setup>
+  import { createVNode, ref } from 'vue';
+  import { message, Modal } from 'ant-design-vue';
+  import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
+  import type { EleProTable } from 'ele-admin-pro';
+  import { toDateString } from 'ele-admin-pro';
+  import type {
+    DatasourceFunction,
+    ColumnItem
+  } from 'ele-admin-pro/es/ele-pro-table/types';
+  import Search from './components/search.vue';
+  import IntegralLogEdit from './components/integralLogEdit.vue';
+  import { pageIntegralLog, removeIntegralLog, removeBatchIntegralLog } from '@/api/booking/integralLog';
+  import type { IntegralLog, IntegralLogParam } from '@/api/booking/integralLog/model';
+
+  // 表格实例
+  const tableRef = ref<InstanceType<typeof EleProTable> | null>(null);
+
+  // 表格选中数据
+  const selection = ref<IntegralLog[]>([]);
+  // 当前编辑数据
+  const current = ref<IntegralLog | null>(null);
+  // 是否显示编辑弹窗
+  const showEdit = ref(false);
+  // 是否显示批量移动弹窗
+  const showMove = ref(false);
+  // 加载状态
+  const loading = ref(true);
+
+  // 表格数据源
+  const datasource: DatasourceFunction = ({
+    page,
+    limit,
+    where,
+    orders,
+    filters
+  }) => {
+    if (filters) {
+      where.status = filters.status;
+    }
+    return pageIntegralLog({
+      ...where,
+      ...orders,
+      page,
+      limit
+    });
+  };
+
+  // 表格列配置
+  const columns = ref<ColumnItem[]>([
+    {
+      title: '',
+      dataIndex: 'id',
+      key: 'id',
+      align: 'center',
+      width: 90,
+    },
+    {
+      title: '场馆订单号',
+      dataIndex: 'orderNum',
+      key: 'orderNum',
+      align: 'center',
+    },
+    {
+      title: '订单id',
+      dataIndex: 'oid',
+      key: 'oid',
+      align: 'center',
+    },
+    {
+      title: '场馆名称',
+      dataIndex: 'siteName',
+      key: 'siteName',
+      align: 'center',
+    },
+    {
+      title: '微信昵称',
+      dataIndex: 'username',
+      key: 'username',
+      align: 'center',
+    },
+    {
+      title: '手机号码',
+      dataIndex: 'phone',
+      key: 'phone',
+      align: 'center',
+    },
+    {
+      title: '获得积分',
+      dataIndex: 'integral',
+      key: 'integral',
+      align: 'center',
+    },
+    {
+      title: '变化前积分',
+      dataIndex: 'oldMoney',
+      key: 'oldMoney',
+      align: 'center',
+    },
+    {
+      title: '变化后积分',
+      dataIndex: 'newMoney',
+      key: 'newMoney',
+      align: 'center',
+    },
+    {
+      title: '描述',
+      dataIndex: 'info',
+      key: 'info',
+      align: 'center',
+    },
+    {
+      title: '记录时间',
+      dataIndex: 'createTime',
+      key: 'createTime',
+      align: 'center',
+      sorter: true,
+      ellipsis: true,
+      customRender: ({ text }) => toDateString(text, 'yyyy-MM-dd')
+    },
+    {
+      title: '操作',
+      key: 'action',
+      width: 180,
+      fixed: 'right',
+      align: 'center',
+      hideInSetting: true
+    }
+  ]);
+
+  /* 搜索 */
+  const reload = (where?: IntegralLogParam) => {
+    selection.value = [];
+    tableRef?.value?.reload({ where: where });
+  };
+
+  /* 打开编辑弹窗 */
+  const openEdit = (row?: IntegralLog) => {
+    current.value = row ?? null;
+    showEdit.value = true;
+  };
+
+  /* 打开批量移动弹窗 */
+  const openMove = () => {
+    showMove.value = true;
+  };
+
+  /* 删除单个 */
+  const remove = (row: IntegralLog) => {
+    const hide = message.loading('请求中..', 0);
+    removeIntegralLog(row.integralLogId)
+      .then((msg) => {
+        hide();
+        message.success(msg);
+        reload();
+      })
+      .catch((e) => {
+        hide();
+        message.error(e.message);
+      });
+  };
+
+  /* 批量删除 */
+  const removeBatch = () => {
+    if (!selection.value.length) {
+      message.error('请至少选择一条数据');
+      return;
+    }
+    Modal.confirm({
+      title: '提示',
+      content: '确定要删除选中的记录吗?',
+      icon: createVNode(ExclamationCircleOutlined),
+      maskClosable: true,
+      onOk: () => {
+        const hide = message.loading('请求中..', 0);
+        removeBatchIntegralLog(selection.value.map((d) => d.integralLogId))
+          .then((msg) => {
+            hide();
+            message.success(msg);
+            reload();
+          })
+          .catch((e) => {
+            hide();
+            message.error(e.message);
+          });
+      }
+    });
+  };
+
+  /* 查询 */
+  const query = () => {
+    loading.value = true;
+  };
+
+  /* 自定义行属性 */
+  const customRow = (record: IntegralLog) => {
+    return {
+      // 行点击事件
+      onClick: () => {
+        // console.log(record);
+      },
+      // 行双击事件
+      onDblclick: () => {
+        openEdit(record);
+      }
+    };
+  };
+  query();
+</script>
+
+<script lang="ts">
+  export default {
+    name: 'IntegralLog'
+  };
+</script>
+
+<style lang="less" scoped></style>

src/views/booking/order/components/orderEdit.vue

@@ -0,0 +1,459 @@
+<!-- 编辑弹窗 -->
+<template>
+  <ele-modal
+    :width="800"
+    :visible="visible"
+    :maskClosable="false"
+    :maxable="maxable"
+    :title="isUpdate ? '编辑预约订单' : '添加预约订单'"
+    :body-style="{ paddingBottom: '28px' }"
+    @update:visible="updateVisible"
+    @ok="save"
+  >
+    <a-form
+      ref="formRef"
+      :model="form"
+      :rules="rules"
+      :label-col="styleResponsive ? { md: 4, sm: 5, xs: 24 } : { flex: '90px' }"
+      :wrapper-col="
+        styleResponsive ? { md: 19, sm: 19, xs: 24 } : { flex: '1' }
+      "
+    >
+      <a-form-item label="订单编号" name="orderNo">
+        <a-input
+          allow-clear
+          placeholder="请输入订单编号"
+          v-model:value="form.orderNo"
+        />
+      </a-form-item>
+      <a-form-item label="微信支付订单号" name="wechatOrder">
+        <a-input
+          allow-clear
+          placeholder="请输入微信支付订单号"
+          v-model:value="form.wechatOrder"
+        />
+      </a-form-item>
+      <a-form-item label="微信退款订单号" name="refundOrder">
+        <a-input
+          allow-clear
+          placeholder="请输入微信退款订单号"
+          v-model:value="form.refundOrder"
+        />
+      </a-form-item>
+      <a-form-item label="场馆id用于权限判断" name="merchantId">
+        <a-input
+          allow-clear
+          placeholder="请输入场馆id用于权限判断"
+          v-model:value="form.merchantId"
+        />
+      </a-form-item>
+      <a-form-item label="用户id" name="userId">
+        <a-input
+          allow-clear
+          placeholder="请输入用户id"
+          v-model:value="form.userId"
+        />
+      </a-form-item>
+      <a-form-item label="使用的优惠券id" name="couponId">
+        <a-input
+          allow-clear
+          placeholder="请输入使用的优惠券id"
+          v-model:value="form.couponId"
+        />
+      </a-form-item>
+      <a-form-item label="使用的会员卡id" name="cardId">
+        <a-input
+          allow-clear
+          placeholder="请输入使用的会员卡id"
+          v-model:value="form.cardId"
+        />
+      </a-form-item>
+      <a-form-item label="关联管理员id" name="aid">
+        <a-input
+          allow-clear
+          placeholder="请输入关联管理员id"
+          v-model:value="form.aid"
+        />
+      </a-form-item>
+      <a-form-item label="核销管理员id" name="adminId">
+        <a-input
+          allow-clear
+          placeholder="请输入核销管理员id"
+          v-model:value="form.adminId"
+        />
+      </a-form-item>
+      <a-form-item label="IC卡号" name="code">
+        <a-input
+          allow-clear
+          placeholder="请输入IC卡号"
+          v-model:value="form.code"
+        />
+      </a-form-item>
+      <a-form-item label="真实姓名" name="name">
+        <a-input
+          allow-clear
+          placeholder="请输入真实姓名"
+          v-model:value="form.name"
+        />
+      </a-form-item>
+      <a-form-item label="手机号码" name="phone">
+        <a-input
+          allow-clear
+          placeholder="请输入手机号码"
+          v-model:value="form.phone"
+        />
+      </a-form-item>
+      <a-form-item label="订单总额" name="totalPrice">
+        <a-input
+          allow-clear
+          placeholder="请输入订单总额"
+          v-model:value="form.totalPrice"
+        />
+      </a-form-item>
+      <a-form-item label="减少的金额，使用VIP会员折扣、优惠券抵扣、优惠券折扣后减去的价格" name="reducePrice">
+        <a-input
+          allow-clear
+          placeholder="请输入减少的金额，使用VIP会员折扣、优惠券抵扣、优惠券折扣后减去的价格"
+          v-model:value="form.reducePrice"
+        />
+      </a-form-item>
+      <a-form-item label="实际付款" name="payPrice">
+        <a-input
+          allow-clear
+          placeholder="请输入实际付款"
+          v-model:value="form.payPrice"
+        />
+      </a-form-item>
+      <a-form-item label="用于统计" name="price">
+        <a-input
+          allow-clear
+          placeholder="请输入用于统计"
+          v-model:value="form.price"
+        />
+      </a-form-item>
+      <a-form-item label="价钱，用于积分赠送" name="money">
+        <a-input
+          allow-clear
+          placeholder="请输入价钱，用于积分赠送"
+          v-model:value="form.money"
+        />
+      </a-form-item>
+      <a-form-item label="退款金额" name="refundMoney">
+        <a-input
+          allow-clear
+          placeholder="请输入退款金额"
+          v-model:value="form.refundMoney"
+        />
+      </a-form-item>
+      <a-form-item label="教练价格" name="coachPrice">
+        <a-input
+          allow-clear
+          placeholder="请输入教练价格"
+          v-model:value="form.coachPrice"
+        />
+      </a-form-item>
+      <a-form-item label="教练id" name="coachId">
+        <a-input
+          allow-clear
+          placeholder="请输入教练id"
+          v-model:value="form.coachId"
+        />
+      </a-form-item>
+      <a-form-item label="1微信支付，2积分，3支付宝，4现金，5POS机，6VIP月卡，7VIP年卡，8VIP次卡，9IC月卡，10IC年卡，11IC次卡，12免费，13VIP充值卡，14IC充值卡，15积分支付，16VIP季卡，17IC季卡" name="payType">
+        <a-input
+          allow-clear
+          placeholder="请输入1微信支付，2积分，3支付宝，4现金，5POS机，6VIP月卡，7VIP年卡，8VIP次卡，9IC月卡，10IC年卡，11IC次卡，12免费，13VIP充值卡，14IC充值卡，15积分支付，16VIP季卡，17IC季卡"
+          v-model:value="form.payType"
+        />
+      </a-form-item>
+      <a-form-item label="1已付款，2未付款" name="payStatus">
+        <a-input
+          allow-clear
+          placeholder="请输入1已付款，2未付款"
+          v-model:value="form.payStatus"
+        />
+      </a-form-item>
+      <a-form-item label="1已完成，2未使用，3已取消，4退款申请中，5退款被拒绝，6退款成功，7客户端申请退款" name="orderStatus">
+        <a-input
+          allow-clear
+          placeholder="请输入1已完成，2未使用，3已取消，4退款申请中，5退款被拒绝，6退款成功，7客户端申请退款"
+          v-model:value="form.orderStatus"
+        />
+      </a-form-item>
+      <a-form-item label="优惠类型：0无、1抵扣优惠券、2折扣优惠券、3、VIP月卡、4VIP年卡，5VIP次卡、6VIP会员卡、7IC月卡、8IC年卡、9IC次卡、10IC会员卡、11免费订单、12VIP充值卡、13IC充值卡、14VIP季卡、15IC季卡" name="type">
+        <a-input
+          allow-clear
+          placeholder="请输入优惠类型：0无、1抵扣优惠券、2折扣优惠券、3、VIP月卡、4VIP年卡，5VIP次卡、6VIP会员卡、7IC月卡、8IC年卡、9IC次卡、10IC会员卡、11免费订单、12VIP充值卡、13IC充值卡、14VIP季卡、15IC季卡"
+          v-model:value="form.type"
+        />
+      </a-form-item>
+      <a-form-item label="二维码地址，保存订单号，支付成功后才生成" name="qrcode">
+        <a-input
+          allow-clear
+          placeholder="请输入二维码地址，保存订单号，支付成功后才生成"
+          v-model:value="form.qrcode"
+        />
+      </a-form-item>
+      <a-form-item label="优惠说明" name="desc">
+        <a-input
+          allow-clear
+          placeholder="请输入优惠说明"
+          v-model:value="form.desc"
+        />
+      </a-form-item>
+      <a-form-item label="vip月卡年卡、ic月卡年卡回退次数" name="returnNum">
+        <a-input
+          allow-clear
+          placeholder="请输入vip月卡年卡、ic月卡年卡回退次数"
+          v-model:value="form.returnNum"
+        />
+      </a-form-item>
+      <a-form-item label="vip充值回退金额" name="returnMoney">
+        <a-input
+          allow-clear
+          placeholder="请输入vip充值回退金额"
+          v-model:value="form.returnMoney"
+        />
+      </a-form-item>
+      <a-form-item label="预约详情开始时间数组" name="startTime">
+        <a-input
+          allow-clear
+          placeholder="请输入预约详情开始时间数组"
+          v-model:value="form.startTime"
+        />
+      </a-form-item>
+      <a-form-item label="是否已开具发票：1已开发票，2未开发票，3不能开具发票" name="isInvoice">
+        <a-input
+          allow-clear
+          placeholder="请输入是否已开具发票：1已开发票，2未开发票，3不能开具发票"
+          v-model:value="form.isInvoice"
+        />
+      </a-form-item>
+      <a-form-item label="" name="updateTime">
+        <a-input
+          allow-clear
+          placeholder="请输入"
+          v-model:value="form.updateTime"
+        />
+      </a-form-item>
+      <a-form-item label="付款时间" name="payTime">
+        <a-input
+          allow-clear
+          placeholder="请输入付款时间"
+          v-model:value="form.payTime"
+        />
+      </a-form-item>
+      <a-form-item label="退款时间" name="refundTime">
+        <a-input
+          allow-clear
+          placeholder="请输入退款时间"
+          v-model:value="form.refundTime"
+        />
+      </a-form-item>
+      <a-form-item label="申请退款时间" name="refundApplyTime">
+        <a-input
+          allow-clear
+          placeholder="请输入申请退款时间"
+          v-model:value="form.refundApplyTime"
+        />
+      </a-form-item>
+      <a-form-item label="对账情况：1=已对账；2=未对账；3=已对账，金额对不上；4=未查询到该订单" name="checkBill">
+        <a-input
+          allow-clear
+          placeholder="请输入对账情况：1=已对账；2=未对账；3=已对账，金额对不上；4=未查询到该订单"
+          v-model:value="form.checkBill"
+        />
+      </a-form-item>
+      <a-form-item label="备注" name="comments">
+        <a-textarea
+          :rows="4"
+          :maxlength="200"
+          placeholder="请输入描述"
+          v-model:value="form.comments"
+        />
+      </a-form-item>
+      <a-form-item label="是否删除, 0否, 1是" name="deleted">
+        <a-input
+          allow-clear
+          placeholder="请输入是否删除, 0否, 1是"
+          v-model:value="form.deleted"
+        />
+      </a-form-item>
+    </a-form>
+  </ele-modal>
+</template>
+
+<script lang="ts" setup>
+  import { ref, reactive, watch } from 'vue';
+  import { Form, message } from 'ant-design-vue';
+  import { assignObject, uuid } from 'ele-admin-pro';
+  import { addOrder, updateOrder } from '@/api/shop/order';
+  import { Order } from '@/api/shop/order/model';
+  import { useThemeStore } from '@/store/modules/theme';
+  import { storeToRefs } from 'pinia';
+  import { ItemType } from 'ele-admin-pro/es/ele-image-upload/types';
+  import { FormInstance } from 'ant-design-vue/es/form';
+  import { FileRecord } from '@/api/system/file/model';
+
+  // 是否是修改
+  const isUpdate = ref(false);
+  const useForm = Form.useForm;
+  // 是否开启响应式布局
+  const themeStore = useThemeStore();
+  const { styleResponsive } = storeToRefs(themeStore);
+
+  const props = defineProps<{
+    // 弹窗是否打开
+    visible: boolean;
+    // 修改回显的数据
+    data?: Order | null;
+  }>();
+
+  const emit = defineEmits<{
+    (e: 'done'): void;
+    (e: 'update:visible', visible: boolean): void;
+  }>();
+
+  // 提交状态
+  const loading = ref(false);
+  // 是否显示最大化切换按钮
+  const maxable = ref(true);
+  // 表格选中数据
+  const formRef = ref<FormInstance | null>(null);
+  const images = ref<ItemType[]>([]);
+
+  // 用户信息
+  const form = reactive<Order>({
+    orderId: undefined,
+    orderNo: undefined,
+    wechatOrder: undefined,
+    refundOrder: undefined,
+    merchantId: undefined,
+    userId: undefined,
+    couponId: undefined,
+    cardId: undefined,
+    aid: undefined,
+    adminId: undefined,
+    code: undefined,
+    name: undefined,
+    phone: undefined,
+    totalPrice: undefined,
+    reducePrice: undefined,
+    payPrice: undefined,
+    price: undefined,
+    money: undefined,
+    refundMoney: undefined,
+    coachPrice: undefined,
+    coachId: undefined,
+    payType: undefined,
+    payStatus: undefined,
+    orderStatus: undefined,
+    type: undefined,
+    qrcode: undefined,
+    desc: undefined,
+    returnNum: undefined,
+    returnMoney: undefined,
+    startTime: undefined,
+    isInvoice: undefined,
+    createTime: undefined,
+    updateTime: undefined,
+    payTime: undefined,
+    refundTime: undefined,
+    refundApplyTime: undefined,
+    checkBill: undefined,
+    comments: undefined,
+    deleted: undefined,
+    tenantId: undefined,
+    orderId: undefined,
+    orderName: '',
+    status: 0,
+    comments: '',
+    sortNumber: 100
+  });
+
+  /* 更新visible */
+  const updateVisible = (value: boolean) => {
+    emit('update:visible', value);
+  };
+
+  // 表单验证规则
+  const rules = reactive({
+    orderName: [
+      {
+        required: true,
+        type: 'string',
+        message: '请填写预约订单名称',
+        trigger: 'blur'
+      }
+    ]
+  });
+
+  const chooseImage = (data: FileRecord) => {
+    images.value.push({
+      uid: data.id,
+      url: data.path,
+      status: 'done'
+    });
+    form.image = data.path;
+  };
+
+  const onDeleteItem = (index: number) => {
+    images.value.splice(index, 1);
+    form.image = '';
+  };
+
+  const { resetFields } = useForm(form, rules);
+
+  /* 保存编辑 */
+  const save = () => {
+    if (!formRef.value) {
+      return;
+    }
+    formRef.value
+      .validate()
+      .then(() => {
+        loading.value = true;
+        const formData = {
+          ...form
+        };
+        const saveOrUpdate = isUpdate.value ? updateOrder : addOrder;
+        saveOrUpdate(formData)
+          .then((msg) => {
+            loading.value = false;
+            message.success(msg);
+            updateVisible(false);
+            emit('done');
+          })
+          .catch((e) => {
+            loading.value = false;
+            message.error(e.message);
+          });
+      })
+      .catch(() => {});
+  };
+
+  watch(
+    () => props.visible,
+    (visible) => {
+      if (visible) {
+        images.value = [];
+        if (props.data) {
+          assignObject(form, props.data);
+          if(props.data.image){
+            images.value.push({
+              uid: uuid(),
+              url: props.data.image,
+              status: 'done'
+            })
+          }
+          isUpdate.value = true;
+        } else {
+          isUpdate.value = false;
+        }
+      } else {
+        resetFields();
+      }
+    },
+    { immediate: true }
+  );
+</script>

src/views/booking/order/components/search.vue

@@ -0,0 +1,48 @@
+<!-- 搜索表单 -->
+<template>
+  <a-space :size="10" style="flex-wrap: wrap">
+    <a-input-search
+      allow-clear
+      v-model:value="where.keywords"
+      placeholder="请输入关键词"
+      @search="search"
+      @pressEnter="search"
+    />
+  </a-space>
+</template>
+
+<script lang="ts" setup>
+  import { watch } from 'vue';
+  import useSearch from '@/utils/use-search';
+  import { OrderParam } from '@/api/shop/order/model';
+
+  const props = withDefaults(
+    defineProps<{
+      // 选中的角色
+      selection?: [];
+    }>(),
+    {}
+  );
+
+  const emit = defineEmits<{
+    (e: 'search', where?: OrderParam): void;
+    (e: 'add'): void;
+    (e: 'remove'): void;
+    (e: 'batchMove'): void;
+  }>();
+
+  // 表单数据
+  const { where } = useSearch<OrderParam>({
+    keywords: ''
+  });
+
+  /* 搜索 */
+  const search = () => {
+    emit('search', where);
+  };
+
+  watch(
+    () => props.selection,
+    () => {}
+  );
+</script>

src/views/booking/order/index.vue

@@ -0,0 +1,431 @@
+<template>
+  <div class="page">
+    <div class="ele-body">
+      <a-card :bordered="false" :body-style="{ padding: '16px' }">
+        <ele-pro-table
+          ref="tableRef"
+          row-key="orderId"
+          :columns="columns"
+          :datasource="datasource"
+          :customRow="customRow"
+          :scroll="{ x: 800 }"
+          tool-class="ele-toolbar-form"
+          class="sys-org-table"
+        >
+          <template #toolbar>
+            <search
+              @search="reload"
+              :selection="selection"
+              @add="openEdit"
+              @remove="removeBatch"
+              @batchMove="openMove"
+            />
+          </template>
+          <template #bodyCell="{ column, record }">
+            <template v-if="column.key === 'image'">
+              <a-image :src="record.image" :width="50" />
+            </template>
+            <template v-if="column.key === 'payType'">
+              <a-tag v-if="record.payType == 1" color="green"
+                ><WechatOutlined class="tag-icon" />微信支付</a-tag
+              >
+              <a-tag v-if="record.payType == 2" color="green">积分</a-tag>
+              <a-tag v-if="record.payType == 3" color="green"
+                ><AlipayCircleOutlined class="tag-icon" />支付宝</a-tag
+              >
+              <a-tag v-if="record.payType == 4" color="green"
+                ><IdcardOutlined class="tag-icon" />现金</a-tag
+              >
+              <a-tag v-if="record.payType == 5" color="green"
+                ><IdcardOutlined class="tag-icon" />POS机</a-tag
+              >
+              <a-tag v-if="record.payType == 6" color="green"
+                ><IdcardOutlined class="tag-icon" />VIP月卡</a-tag
+              >
+              <a-tag v-if="record.payType == 7" color="green"
+                ><IdcardOutlined class="tag-icon" />VIP年卡</a-tag
+              >
+              <a-tag v-if="record.payType == 8" color="green"
+                ><IdcardOutlined class="tag-icon" />VIP次卡</a-tag
+              >
+              <a-tag v-if="record.payType == 9" color="green"
+                ><IdcardOutlined class="tag-icon" />IC月卡</a-tag
+              >
+              <a-tag v-if="record.payType == 10" color="green"
+                ><IdcardOutlined class="tag-icon" />IC年卡</a-tag
+              >
+              <a-tag v-if="record.payType == 11" color="green"
+                ><IdcardOutlined class="tag-icon" />IC次卡</a-tag
+              >
+              <a-tag v-if="record.payType == 12" color="green"
+                ><IdcardOutlined class="tag-icon" />免费</a-tag
+              >
+              <a-tag v-if="record.payType == 13" color="green"
+                ><IdcardOutlined class="tag-icon" />VIP充值卡</a-tag
+              >
+              <a-tag v-if="record.payType == 14" color="green"
+                ><IdcardOutlined class="tag-icon" />IC充值卡</a-tag
+              >
+              <a-tag v-if="record.payType == 15" color="green"
+                ><IdcardOutlined class="tag-icon" />积分支付</a-tag
+              >
+              <a-tag v-if="record.payType == 16" color="green"
+                ><IdcardOutlined class="tag-icon" />VIP季卡</a-tag
+              >
+              <a-tag v-if="record.payType == 17" color="green"
+                ><IdcardOutlined class="tag-icon" />IC季卡</a-tag
+              >
+            </template>
+            <template v-if="column.key === 'type'">
+              <a-tag v-if="record.type == 0">无</a-tag>
+              <a-tag v-if="record.type == 1" color="blue"
+                ><IdcardOutlined class="tag-icon" />抵扣优惠券</a-tag
+              >
+              <a-tag v-if="record.type == 2" color="blue"
+                ><IdcardOutlined class="tag-icon" />折扣优惠券</a-tag
+              >
+              <a-tag v-if="record.type == 3" color="blue"
+                ><IdcardOutlined class="tag-icon" />VIP月卡</a-tag
+              >
+              <a-tag v-if="record.type == 4" color="blue"
+                ><IdcardOutlined class="tag-icon" />VIP年卡</a-tag
+              >
+              <a-tag v-if="record.type == 5" color="blue"
+                ><IdcardOutlined class="tag-icon" />VIP次卡</a-tag
+              >
+              <a-tag v-if="record.type == 6" color="blue"
+                ><IdcardOutlined class="tag-icon" />VIP会员卡</a-tag
+              >
+              <a-tag v-if="record.type == 7" color="blue"
+                ><IdcardOutlined class="tag-icon" />IC月卡</a-tag
+              >
+              <a-tag v-if="record.type == 8" color="blue"
+                ><IdcardOutlined class="tag-icon" />IC年卡</a-tag
+              >
+              <a-tag v-if="record.type == 9" color="blue"
+                ><IdcardOutlined class="tag-icon" />IC次卡</a-tag
+              >
+              <a-tag v-if="record.type == 10" color="blue"
+                ><IdcardOutlined class="tag-icon" />IC会员卡</a-tag
+              >
+              <a-tag v-if="record.type == 11" color="blue"
+                ><IdcardOutlined class="tag-icon" />免费订单</a-tag
+              >
+              <a-tag v-if="record.type == 12" color="blue"
+                ><IdcardOutlined class="tag-icon" />VIP充值卡</a-tag
+              >
+              <a-tag v-if="record.type == 13" color="blue"
+                ><IdcardOutlined class="tag-icon" />IC充值卡</a-tag
+              >
+              <a-tag v-if="record.type == 14" color="blue"
+                ><IdcardOutlined class="tag-icon" />VIP季卡</a-tag
+              >
+              <a-tag v-if="record.type == 15" color="blue"
+                ><IdcardOutlined class="tag-icon" />IC季卡</a-tag
+              >
+            </template>
+            <template v-if="column.key === 'payStatus'">
+              <a-tag v-if="record.payStatus == 1" color="green"
+                ><CheckOutlined class="tag-icon" />已付款</a-tag
+              >
+              <a-tag v-if="record.payStatus == 2" color="error"
+                ><CloseOutlined class="tag-icon" />未付款</a-tag
+              >
+              <a-tag v-if="record.payStatus == 3" color="cyan"
+                ><CoffeeOutlined class="tag-icon" />未付款,占场中</a-tag
+              >
+            </template>
+            <template v-if="column.key === 'orderStatus'">
+              <a-tag v-if="record.orderStatus == 1" color="green"
+                ><CheckOutlined class="tag-icon" />已付款</a-tag
+              >
+              <a-tag v-if="record.orderStatus == 2" color="blue"
+                ><ClockCircleOutlined class="tag-icon" />未使用</a-tag
+              >
+              <a-tag v-if="record.orderStatus == 3" color="error"
+                ><CloseOutlined class="tag-icon" />已取消</a-tag
+              >
+              <a-tag v-if="record.orderStatus == 4" color="error"
+                >退款申请中</a-tag
+              >
+              <a-tag v-if="record.orderStatus == 5" color="error"
+                >退款被拒绝</a-tag
+              >
+              <a-tag v-if="record.orderStatus == 6" color="green"
+                >退款成功</a-tag
+              >
+              <a-tag v-if="record.orderStatus == 7" color="green"
+                >客户端申请退款</a-tag
+              >
+            </template>
+            <template v-if="column.key === 'isInvoice'">
+              <a-tag v-if="record.isInvoice == 1" color="green">已开</a-tag>
+              <a-tag v-if="record.isInvoice == 2" color="green">未开</a-tag>
+              <a-tag v-if="record.isInvoice == 1" color="green">不能开</a-tag>
+            </template>
+            <template v-if="column.key === 'status'">
+              <a-tag v-if="record.status === 0" color="green">显示</a-tag>
+              <a-tag v-if="record.status === 1" color="red">隐藏</a-tag>
+            </template>
+            <template v-if="column.key === 'action'">
+              <a-space>
+                <a @click="openEdit(record)">详情</a>
+              </a-space>
+            </template>
+          </template>
+        </ele-pro-table>
+      </a-card>
+
+      <!-- 编辑弹窗 -->
+      <OrderEdit v-model:visible="showEdit" :data="current" @done="reload" />
+    </div>
+  </div>
+</template>
+
+<script lang="ts" setup>
+  import { createVNode, ref } from 'vue';
+  import { message, Modal } from 'ant-design-vue';
+  import {
+    ExclamationCircleOutlined,
+    CheckOutlined,
+    CloseOutlined,
+    RestOutlined,
+    ClockCircleOutlined,
+    IdcardOutlined,
+    WechatOutlined,
+    CoffeeOutlined,
+    AlipayCircleOutlined
+  } from '@ant-design/icons-vue';
+  import { EleProTable, toDateString } from 'ele-admin-pro';
+  import type {
+    DatasourceFunction,
+    ColumnItem
+  } from 'ele-admin-pro/es/ele-pro-table/types';
+  import Search from './components/search.vue';
+  import OrderEdit from './components/orderEdit.vue';
+  import { pageOrder, removeOrder, removeBatchOrder } from '@/api/shop/order';
+  import type { Order, OrderParam } from '@/api/shop/order/model';
+
+  // 表格实例
+  const tableRef = ref<InstanceType<typeof EleProTable> | null>(null);
+
+  // 表格选中数据
+  const selection = ref<Order[]>([]);
+  // 当前编辑数据
+  const current = ref<Order | null>(null);
+  // 是否显示编辑弹窗
+  const showEdit = ref(false);
+  // 是否显示批量移动弹窗
+  const showMove = ref(false);
+  // 加载状态
+  const loading = ref(true);
+
+  // 表格数据源
+  const datasource: DatasourceFunction = ({
+    page,
+    limit,
+    where,
+    orders,
+    filters
+  }) => {
+    if (filters) {
+      where.status = filters.status;
+    }
+    return pageOrder({
+      ...where,
+      ...orders,
+      page,
+      limit
+    });
+  };
+
+  // 表格列配置
+  const columns = ref<ColumnItem[]>([
+    {
+      title: '订单号',
+      dataIndex: 'orderId',
+      key: 'orderId',
+      width: 90
+    },
+    {
+      title: '姓名',
+      dataIndex: 'name',
+      key: 'name',
+      align: 'center'
+    },
+    {
+      title: '手机号',
+      dataIndex: 'phone',
+      key: 'phone',
+      width: 120,
+      align: 'center'
+    },
+    {
+      title: '总额',
+      dataIndex: 'totalPrice',
+      key: 'totalPrice',
+      align: 'center'
+    },
+    {
+      title: '减少金额',
+      dataIndex: 'reducePrice',
+      key: 'reducePrice',
+      align: 'center'
+    },
+    {
+      title: '实付金额',
+      dataIndex: 'payPrice',
+      key: 'payPrice',
+      align: 'center'
+    },
+    {
+      title: '支付方式',
+      dataIndex: 'payType',
+      key: 'payType',
+      align: 'center'
+    },
+    {
+      title: '付款状态',
+      dataIndex: 'payStatus',
+      key: 'payStatus',
+      align: 'center'
+    },
+    {
+      title: '订单状态',
+      dataIndex: 'orderStatus',
+      key: 'orderStatus',
+      align: 'center'
+    },
+    {
+      title: '优惠类型',
+      dataIndex: 'type',
+      key: 'type',
+      align: 'center'
+    },
+    {
+      title: '是否已开票',
+      dataIndex: 'isInvoice',
+      key: 'isInvoice',
+      align: 'center'
+    },
+    {
+      title: '付款时间',
+      dataIndex: 'payTime',
+      key: 'payTime',
+      align: 'center',
+      customRender: ({ text }) => toDateString(text, 'yyyy-MM-dd HH:mm:ss')
+    },
+    // {
+    //   title: '申请退款时间',
+    //   dataIndex: 'refundApplyTime',
+    //   key: 'refundApplyTime',
+    //   align: 'center',
+    //   customRender: ({ text }) => toDateString(text, 'yyyy-MM-dd HH:mm:ss')
+    // },
+    // {
+    //   title: '备注',
+    //   dataIndex: 'comments',
+    //   key: 'comments',
+    //   align: 'center'
+    // },
+    {
+      title: '操作',
+      key: 'action',
+      width: 120,
+      fixed: 'right',
+      align: 'center',
+      hideInSetting: true
+    }
+  ]);
+
+  /* 搜索 */
+  const reload = (where?: OrderParam) => {
+    selection.value = [];
+    tableRef?.value?.reload({ where: where });
+  };
+
+  /* 打开编辑弹窗 */
+  const openEdit = (row?: Order) => {
+    current.value = row ?? null;
+    showEdit.value = true;
+  };
+
+  /* 打开批量移动弹窗 */
+  const openMove = () => {
+    showMove.value = true;
+  };
+
+  /* 删除单个 */
+  const remove = (row: Order) => {
+    const hide = message.loading('请求中..', 0);
+    removeOrder(row.orderId)
+      .then((msg) => {
+        hide();
+        message.success(msg);
+        reload();
+      })
+      .catch((e) => {
+        hide();
+        message.error(e.message);
+      });
+  };
+
+  /* 批量删除 */
+  const removeBatch = () => {
+    if (!selection.value.length) {
+      message.error('请至少选择一条数据');
+      return;
+    }
+    Modal.confirm({
+      title: '提示',
+      content: '确定要删除选中的记录吗?',
+      icon: createVNode(ExclamationCircleOutlined),
+      maskClosable: true,
+      onOk: () => {
+        const hide = message.loading('请求中..', 0);
+        removeBatchOrder(selection.value.map((d) => d.orderId))
+          .then((msg) => {
+            hide();
+            message.success(msg);
+            reload();
+          })
+          .catch((e) => {
+            hide();
+            message.error(e.message);
+          });
+      }
+    });
+  };
+
+  /* 查询 */
+  const query = () => {
+    loading.value = true;
+  };
+
+  /* 自定义行属性 */
+  const customRow = (record: Order) => {
+    return {
+      // 行点击事件
+      onClick: () => {
+        // console.log(record);
+      },
+      // 行双击事件
+      onDblclick: () => {
+        openEdit(record);
+      }
+    };
+  };
+  query();
+</script>
+
+<script lang="ts">
+  export default {
+    name: 'Order'
+  };
+</script>
+
+<style lang="less" scoped>
+  .tag-icon {
+    padding-right: 6px;
+  }
+</style>

src/views/booking/school/components/merchantEdit.vue

@@ -36,15 +36,11 @@
           v-model:value="form.merchantName"
         />
       </a-form-item>
-      <a-form-item
-        label="手机号码"
-        name="phone"
-        extra="手机号码将用做于场馆端的登录账号请填写真实手机号码"
-      >
+      <a-form-item label="场馆电话" name="phone">
         <a-input
           allow-clear
           :maxlength="11"
-          placeholder="请输入场馆手机号"
+          placeholder="请输入场馆电话"
           v-model:value="form.phone"
         />
       </a-form-item>
@@ -188,7 +184,7 @@
 <script lang="ts" setup>
   import { ref, reactive, watch } from 'vue';
   import { Form, message } from 'ant-design-vue';
-  import { assignObject, uuid, phoneReg } from 'ele-admin-pro';
+  import { assignObject, uuid } from 'ele-admin-pro';
   import { addMerchant, updateMerchant } from '@/api/shop/merchant';
   import { Merchant } from '@/api/shop/merchant/model';
   import { useThemeStore } from '@/store/modules/theme';
@@ -199,7 +195,6 @@
   import { MerchantType } from '@/api/shop/merchantType/model';
   import { CenterPoint } from 'ele-admin-pro/es/ele-map-picker/types';
   import { listRoles } from '@/api/system/role';
-  import { getTenantId } from '@/utils/domain';
 
   // 是否是修改
   const isUpdate = ref(false);
@@ -310,13 +305,8 @@
     phone: [
       {
         required: true,
-        message: '请输入手机号',
+        message: '请输入场馆电话',
         trigger: 'blur'
-      },
-      {
-        pattern: phoneReg,
-        message: '手机号格式不正确',
-        type: 'string'
       }
     ]
   });

src/views/booking/school/index.vue

@@ -30,7 +30,7 @@
             </template>
             <template v-if="column.key === 'action'">
               <a-space>
-                <a @click="openNew(record.adminUrl)">管理后台</a>
+                <a @click="openNew(record.adminUrl)">场馆管理端</a>
                 <a-divider type="vertical" />
                 <a @click="openEdit(record)">修改</a>
                 <a-divider type="vertical" />
@@ -121,12 +121,6 @@
       key: 'merchantName',
       align: 'center'
     },
-    {
-      title: '场馆图标',
-      dataIndex: 'image',
-      key: 'image',
-      align: 'center'
-    },
     {
       title: '负责人',
       dataIndex: 'realName',
@@ -134,7 +128,7 @@
       align: 'center'
     },
     {
-      title: '手机号',
+      title: '场馆电话',
       dataIndex: 'phone',
       key: 'phone',
       align: 'center'

src/views/booking/teacher3/components/role-select.vue

@@ -1,71 +0,0 @@
-<!-- 角色选择下拉框 -->
-<template>
-  <a-select
-    allow-clear
-    mode="multiple"
-    :value="roleIds"
-    :placeholder="placeholder"
-    @update:value="updateValue"
-    @blur="onBlur"
-  >
-    <a-select-option
-      v-for="item in data"
-      :key="item.roleId"
-      :value="item.roleId"
-    >
-      {{ item.roleName }}
-    </a-select-option>
-  </a-select>
-</template>
-
-<script lang="ts" setup>
-  import { ref, computed } from 'vue';
-  import { message } from 'ant-design-vue/es';
-  import { listRoles } from '@/api/system/role';
-  import type { Role } from '@/api/system/role/model';
-
-  const emit = defineEmits<{
-    (e: 'update:value', value: Role[]): void;
-    (e: 'blur'): void;
-  }>();
-
-  const props = withDefaults(
-    defineProps<{
-      // 选中的角色
-      value?: Role[];
-      //
-      placeholder?: string;
-    }>(),
-    {
-      placeholder: '请选择角色'
-    }
-  );
-
-  // 选中的角色id
-  const roleIds = computed(() => props.value?.map((d) => d.roleId as number));
-
-  // 角色数据
-  const data = ref<Role[]>([]);
-
-  /* 更新选中数据 */
-  const updateValue = (value: number[]) => {
-    emit(
-      'update:value',
-      value.map((v) => ({ roleId: v }))
-    );
-  };
-
-  /* 获取角色数据 */
-  listRoles()
-    .then((list) => {
-      data.value = list;
-    })
-    .catch((e) => {
-      message.error(e.message);
-    });
-
-  /* 失去焦点 */
-  const onBlur = () => {
-    emit('blur');
-  };
-</script>

src/views/booking/teacher3/components/user-edit.vue

@@ -1,312 +0,0 @@
-<!-- 用户编辑弹窗 -->
-<template>
-  <ele-modal
-    :width="800"
-    :visible="visible"
-    :confirm-loading="loading"
-    :title="isUpdate ? '用户详情' : '新建用户'"
-    :body-style="{ paddingBottom: '8px' }"
-    @update:visible="updateVisible"
-    @ok="save"
-  >
-    <a-form
-      ref="formRef"
-      :model="form"
-      :rules="rules"
-      :label-col="styleResponsive ? { md: 5, sm: 4, xs: 24 } : { flex: '90px' }"
-      :wrapper-col="
-        styleResponsive ? { md: 17, sm: 20, xs: 24 } : { flex: '1' }
-      "
-    >
-      <a-row :gutter="16">
-        <a-col
-          v-bind="styleResponsive ? { md: 12, sm: 24, xs: 24 } : { span: 12 }"
-        >
-          <a-form-item label="手机号" v-if="isUpdate" name="mobile">
-            <a-input
-              allow-clear
-              :maxlength="11"
-              placeholder="请输入手机号"
-              v-model:value="form.mobile"
-            />
-          </a-form-item>
-          <a-form-item label="昵称" name="nickname">
-            <a-input
-              allow-clear
-              :maxlength="20"
-              placeholder="请输入昵称"
-              v-model:value="form.nickname"
-            />
-          </a-form-item>
-          <a-form-item label="真实姓名" name="realName">
-            <a-input
-              allow-clear
-              :maxlength="20"
-              placeholder="请输入真实姓名"
-              v-model:value="form.realName"
-            />
-          </a-form-item>
-          <a-form-item label="性别" name="sex">
-            <span v-if="form.sex == 1">男</span>
-            <span v-else-if="form.sex == 2">女</span>
-            <span v-else>未知</span>
-          </a-form-item>
-        </a-col>
-        <a-col
-          v-bind="styleResponsive ? { md: 12, sm: 24, xs: 24 } : { span: 12 }"
-        >
-<!--          <a-form-item label="会员等级">-->
-<!--            <SelectGrade-->
-<!--              :placeholder="`请选择会员等级`"-->
-<!--              v-model:value="form.gradeName"-->
-<!--              :disabled="isUpdate"-->
-<!--              @done="chooseGradeId"-->
-<!--            />-->
-<!--          </a-form-item>-->
-          <a-form-item label="邮箱" name="email">
-            <a-input
-              allow-clear
-              :maxlength="100"
-              placeholder="请输入邮箱"
-              v-model:value="form.email"
-            />
-          </a-form-item>
-          <a-form-item label="出生日期">
-            <a-date-picker
-              class="ele-fluid"
-              value-format="YYYY-MM-DD"
-              placeholder="请选择出生日期"
-              v-model:value="form.birthday"
-            />
-          </a-form-item>
-          <a-form-item v-if="!isUpdate" label="登录密码" name="password">
-            <a-input-password
-              :maxlength="20"
-              v-model:value="form.password"
-              placeholder="请输入登录密码"
-            />
-          </a-form-item>
-          <a-form-item label="个人简介">
-            <a-textarea
-              :rows="4"
-              :maxlength="200"
-              placeholder="请输入个人简介"
-              v-model:value="form.introduction"
-            />
-          </a-form-item>
-        </a-col>
-      </a-row>
-    </a-form>
-  </ele-modal>
-</template>
-
-<script lang="ts" setup>
-  import { ref, reactive, watch } from 'vue';
-  import { message } from 'ant-design-vue/es';
-  import type { FormInstance, Rule } from 'ant-design-vue/es/form';
-  import { emailReg, phoneReg } from 'ele-admin-pro/es';
-  import { storeToRefs } from 'pinia';
-  import { useThemeStore } from '@/store/modules/theme';
-  import useFormData from '@/utils/use-form-data';
-  import RoleSelect from './role-select.vue';
-  import SexSelect from './sex-select.vue';
-  import { addUser, updateUser, checkExistence } from '@/api/system/user';
-  import type { User } from '@/api/system/user/model';
-  import OrgSelect from './org-select.vue';
-  // import { getDictionaryOptions } from '@/utils/common';
-  import { Organization } from '@/api/system/organization/model';
-  import { Grade } from '@/api/user/grade/model';
-
-  // 是否开启响应式布局
-  const themeStore = useThemeStore();
-  const { styleResponsive } = storeToRefs(themeStore);
-  // 获取字典数据
-  // const userTypeData = getDictionaryOptions('userType');
-  const emit = defineEmits<{
-    (e: 'done'): void;
-    (e: 'update:visible', visible: boolean): void;
-  }>();
-
-  const props = defineProps<{
-    // 弹窗是否打开
-    visible: boolean;
-    // 修改回显的数据
-    data?: User | null;
-    // 全部机构
-    organizationList: Organization[];
-  }>();
-
-  //
-  const formRef = ref<FormInstance | null>(null);
-
-  // 是否是修改
-  const isUpdate = ref(false);
-
-  // 提交状态
-  const loading = ref(false);
-
-  // 表单数据
-  const { form, resetFields, assignFields } = useFormData<User>({
-    type: undefined,
-    userId: undefined,
-    username: '',
-    nickname: '',
-    realName: '',
-    companyName: '',
-    sex: undefined,
-    roles: [],
-    email: '',
-    phone: '',
-    mobile: '',
-    password: '',
-    introduction: '',
-    organizationId: undefined,
-    birthday: '',
-    idCard: '',
-    comments: '',
-    gradeName: '',
-    gradeId: undefined
-  });
-
-  // 表单验证规则
-  const rules = reactive<Record<string, Rule[]>>({
-    username: [
-      {
-        required: true,
-        type: 'string',
-        validator: (_rule: Rule, value: string) => {
-          return new Promise<void>((resolve, reject) => {
-            if (!value) {
-              return reject('请输入用户账号');
-            }
-            checkExistence('username', value, props.data?.userId)
-              .then(() => {
-                reject('账号已经存在');
-              })
-              .catch(() => {
-                resolve();
-              });
-          });
-        },
-        trigger: 'blur'
-      }
-    ],
-    nickname: [
-      {
-        required: true,
-        message: '请输入昵称',
-        type: 'string',
-        trigger: 'blur'
-      }
-    ],
-    // realName: [
-    //   {
-    //     required: true,
-    //     message: '请输入真实姓名',
-    //     type: 'string',
-    //     trigger: 'blur'
-    //   }
-    // ],
-    // sex: [
-    //   {
-    //     required: true,
-    //     message: '请选择性别',
-    //     type: 'string',
-    //     trigger: 'blur'
-    //   }
-    // ],
-    roles: [
-      {
-        required: true,
-        message: '请选择角色',
-        type: 'array',
-        trigger: 'blur'
-      }
-    ],
-    email: [
-      {
-        pattern: emailReg,
-        message: '邮箱格式不正确',
-        type: 'string',
-        trigger: 'blur'
-      }
-    ],
-    password: [
-      {
-        required: true,
-        type: 'string',
-        validator: async (_rule: Rule, value: string) => {
-          if (isUpdate.value || /^[\S]{5,18}$/.test(value)) {
-            return Promise.resolve();
-          }
-          return Promise.reject('密码必须为5-18位非空白字符');
-        },
-        trigger: 'blur'
-      }
-    ],
-    phone: [
-      {
-        required: true,
-        pattern: phoneReg,
-        message: '手机号格式不正确',
-        type: 'string',
-        trigger: 'blur'
-      }
-    ]
-  });
-
-  const chooseGradeId = (data: Grade) => {
-    form.gradeName = data.name;
-    form.gradeId = data.gradeId;
-  };
-
-  /* 保存编辑 */
-  const save = () => {
-    if (!formRef.value) {
-      return;
-    }
-    formRef.value
-      .validate()
-      .then(() => {
-        loading.value = true;
-        const saveOrUpdate = isUpdate.value ? updateUser : addUser;
-        saveOrUpdate(form)
-          .then((msg) => {
-            loading.value = false;
-            message.success(msg);
-            updateVisible(false);
-            emit('done');
-          })
-          .catch((e) => {
-            loading.value = false;
-            message.error(e.message);
-          });
-      })
-      .catch(() => {});
-  };
-
-  /* 更新visible */
-  const updateVisible = (value: boolean) => {
-    emit('update:visible', value);
-  };
-
-  watch(
-    () => props.visible,
-    (visible) => {
-      if (visible) {
-        if (props.data) {
-          assignFields({
-            ...props.data,
-            password: ''
-          });
-          isUpdate.value = true;
-        } else {
-          isUpdate.value = false;
-        }
-      } else {
-        resetFields();
-        formRef.value?.clearValidate();
-      }
-    }
-  );
-</script>

src/views/booking/teacher3/components/user-import.vue

@@ -1,88 +0,0 @@
-<!-- 用户导入弹窗 -->
-<template>
-  <ele-modal
-    :width="520"
-    :footer="null"
-    title="导入用户"
-    :visible="visible"
-    @update:visible="updateVisible"
-  >
-    <a-spin :spinning="loading">
-      <a-upload-dragger
-        accept=".xls,.xlsx"
-        :show-upload-list="false"
-        :customRequest="doUpload"
-        style="padding: 24px 0; margin-bottom: 16px"
-      >
-        <p class="ant-upload-drag-icon">
-          <cloud-upload-outlined />
-        </p>
-        <p class="ant-upload-hint">将文件拖到此处，或点击上传</p>
-      </a-upload-dragger>
-    </a-spin>
-    <div class="ele-text-center">
-      <span>只能上传xls、xlsx文件，</span>
-      <a
-        href="https://cdn.eleadmin.com/20200610/用户导入模板.xlsx"
-        download="用户导入模板.xlsx"
-      >
-        下载模板
-      </a>
-    </div>
-  </ele-modal>
-</template>
-
-<script lang="ts" setup>
-  import { ref } from 'vue';
-  import { message } from 'ant-design-vue/es';
-  import { CloudUploadOutlined } from '@ant-design/icons-vue';
-  import { importUsers } from '@/api/system/user';
-
-  const emit = defineEmits<{
-    (e: 'done'): void;
-    (e: 'update:visible', visible: boolean): void;
-  }>();
-
-  defineProps<{
-    // 是否打开弹窗
-    visible: boolean;
-  }>();
-
-  // 导入请求状态
-  const loading = ref(false);
-
-  /* 上传 */
-  const doUpload = ({ file }) => {
-    if (
-      ![
-        'application/vnd.ms-excel',
-        'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
-      ].includes(file.type)
-    ) {
-      message.error('只能选择 excel 文件');
-      return false;
-    }
-    if (file.size / 1024 / 1024 > 10) {
-      message.error('大小不能超过 10MB');
-      return false;
-    }
-    loading.value = true;
-    importUsers(file)
-      .then((msg) => {
-        loading.value = false;
-        message.success(msg);
-        updateVisible(false);
-        emit('done');
-      })
-      .catch((e) => {
-        loading.value = false;
-        message.error(e.message);
-      });
-    return false;
-  };
-
-  /* 更新 visible */
-  const updateVisible = (value: boolean) => {
-    emit('update:visible', value);
-  };
-</script>

src/views/booking/teacher3/components/user-info.vue

@@ -1,143 +0,0 @@
-<!-- 用户编辑弹窗 -->
-<template>
-  <a-drawer
-    :width="680"
-    :visible="visible"
-    :confirm-loading="loading"
-    :title="'基本信息'"
-    :body-style="{ paddingBottom: '8px' }"
-    @update:visible="updateVisible"
-    :footer="null"
-  >
-    <a-form
-      :label-col="{ md: { span: 6 }, sm: { span: 24 } }"
-      :wrapper-col="{ md: { span: 19 }, sm: { span: 24 } }"
-    >
-      <a-row :gutter="16">
-        <a-col
-          v-bind="styleResponsive ? { md: 12, sm: 24, xs: 24 } : { span: 12 }"
-        >
-          <a-form-item label="账号">
-            <span class="ele-text">{{ user.username }}</span>
-          </a-form-item>
-          <a-form-item label="昵称">
-            <span class="ele-text">{{ user.nickname }}</span>
-          </a-form-item>
-          <a-form-item label="性别">
-            <span class="ele-text">{{ user.sexName }}</span>
-          </a-form-item>
-          <a-form-item label="手机号">
-            <span class="ele-text">{{ user.phone }}</span>
-          </a-form-item>
-          <a-form-item label="角色">
-            <a-tag v-for="item in user.roles" :key="item.roleId" color="blue">
-              {{ item.roleName }}
-            </a-tag>
-          </a-form-item>
-          <a-form-item label="状态">
-            <a-badge
-              v-if="typeof user.status === 'number'"
-              :status="(['processing', 'error'][user.status] as any)"
-              :text="['正常', '冻结'][user.status]"
-            />
-          </a-form-item>
-          <a-form-item label="地址">
-            <span class="ele-text">{{ user.address }}</span>
-          </a-form-item>
-        </a-col>
-        <a-col
-          v-bind="styleResponsive ? { md: 12, sm: 24, xs: 24 } : { span: 12 }"
-        >
-          <a-form-item label="可用余额">
-            <span class="ele-text-success">￥{{ formatNumber(user.balance) }}</span>
-          </a-form-item>
-          <a-form-item label="可用积分">
-            <span class="ele-text">{{ user.points }}</span>
-          </a-form-item>
-          <a-form-item label="实际消费">
-            <span class="ele-text">{{ user.payMoney }}</span>
-          </a-form-item>
-          <a-form-item label="机构/部门">
-            <span class="ele-text">{{ user.organizationName }}</span>
-          </a-form-item>
-          <a-form-item label="头像">
-            <a-image :src="user.avatar" :width="36" />
-          </a-form-item>
-          <a-form-item label="生日">
-            <span class="ele-text">{{ user.birthday }}</span>
-          </a-form-item>
-          <a-form-item label="创建时间">
-            <span class="ele-text">{{ user.createTime }}</span>
-          </a-form-item>
-        </a-col>
-      </a-row>
-    </a-form>
-  </a-drawer>
-</template>
-
-<script lang="ts" setup>
-  import { ref, reactive, watch } from 'vue';
-  import { Form } from 'ant-design-vue';
-  import { assignObject } from 'ele-admin-pro';
-  import type { User } from '@/api/system/user/model';
-  import { useThemeStore } from '@/store/modules/theme';
-  import { formatNumber } from 'ele-admin-pro/es';
-  import { storeToRefs } from 'pinia';
-
-  const useForm = Form.useForm;
-  // 是否开启响应式布局
-  const themeStore = useThemeStore();
-  const { styleResponsive } = storeToRefs(themeStore);
-  const props = defineProps<{
-    // 弹窗是否打开
-    visible: boolean;
-    // 修改回显的数据
-    data?: User | null;
-  }>();
-
-  const emit = defineEmits<{
-    (e: 'done'): void;
-    (e: 'update:visible', visible: boolean): void;
-  }>();
-
-  // 用户信息
-  const user = reactive<User>({
-    username: '',
-    nickname: '',
-    sexName: '',
-    phone: '',
-    avatar: '',
-    balance: undefined,
-    points: 0,
-    payMoney: 0,
-    birthday: '',
-    address: '',
-    roles: [],
-    createTime: undefined,
-    status: undefined
-  });
-
-  // 请求状态
-  const loading = ref(true);
-
-  const { resetFields } = useForm(user);
-
-  /* 更新visible */
-  const updateVisible = (value: boolean) => {
-    emit('update:visible', value);
-  };
-
-  watch(
-    () => props.visible,
-    (visible) => {
-      if (visible) {
-        if (props.data) {
-          loading.value = false;
-          assignObject(user, props.data);
-        }
-      } else {
-        resetFields();
-      }
-    }
-  );
-</script>

src/views/booking/teacher3/components/user-search.vue

@@ -1,111 +0,0 @@
-<!-- 搜索表单 -->
-<template>
-  <a-form
-    :label-col="
-      styleResponsive ? { xl: 7, lg: 5, md: 7, sm: 4 } : { flex: '90px' }
-    "
-    :wrapper-col="
-      styleResponsive ? { xl: 17, lg: 19, md: 17, sm: 20 } : { flex: '1' }
-    "
-  >
-    <a-row :gutter="8">
-      <a-col
-        v-bind="
-          styleResponsive
-            ? { xl: 6, lg: 12, md: 12, sm: 24, xs: 24 }
-            : { span: 6 }
-        "
-      >
-        <a-form-item label="用户账号">
-          <a-input
-            v-model:value.trim="form.username"
-            placeholder="请输入"
-            allow-clear
-          />
-        </a-form-item>
-      </a-col>
-      <a-col
-        v-bind="
-          styleResponsive
-            ? { xl: 6, lg: 12, md: 12, sm: 24, xs: 24 }
-            : { span: 6 }
-        "
-      >
-        <a-form-item label="昵称">
-          <a-input
-            v-model:value.trim="form.nickname"
-            placeholder="请输入"
-            allow-clear
-          />
-        </a-form-item>
-      </a-col>
-      <a-col
-        v-bind="
-          styleResponsive
-            ? { xl: 6, lg: 12, md: 12, sm: 24, xs: 24 }
-            : { span: 6 }
-        "
-      >
-        <a-form-item label="性别">
-          <a-select v-model:value="form.sex" placeholder="请选择" allow-clear>
-            <a-select-option value="1">男</a-select-option>
-            <a-select-option value="2">女</a-select-option>
-          </a-select>
-        </a-form-item>
-      </a-col>
-      <a-col
-        v-bind="
-          styleResponsive
-            ? { xl: 6, lg: 12, md: 12, sm: 24, xs: 24 }
-            : { span: 6 }
-        "
-      >
-        <a-form-item class="ele-text-right" :wrapper-col="{ span: 24 }">
-          <a-space>
-            <a-button type="primary" @click="search">查询</a-button>
-            <a-button @click="reset">重置</a-button>
-          </a-space>
-        </a-form-item>
-      </a-col>
-    </a-row>
-  </a-form>
-</template>
-
-<script lang="ts" setup>
-  import { storeToRefs } from 'pinia';
-  import { useThemeStore } from '@/store/modules/theme';
-  import useFormData from '@/utils/use-form-data';
-  import type { UserParam } from '@/api/system/user/model';
-
-  // 是否开启响应式布局
-  const themeStore = useThemeStore();
-  const { styleResponsive } = storeToRefs(themeStore);
-
-  const props = defineProps<{
-    // 默认搜索条件
-    where?: UserParam;
-  }>();
-
-  const emit = defineEmits<{
-    (e: 'search', where?: UserParam): void;
-  }>();
-
-  // 表单数据
-  const { form, resetFields } = useFormData<UserParam>({
-    username: '',
-    nickname: '',
-    sex: undefined,
-    ...props.where
-  });
-
-  /* 搜索 */
-  const search = () => {
-    emit('search', form);
-  };
-
-  /*  重置 */
-  const reset = () => {
-    resetFields();
-    search();
-  };
-</script>

src/views/booking/teacher3/details/index.vue

@@ -1,130 +0,0 @@
-<template>
-  <div class="ele-body">
-    <a-card title="基本信息" :bordered="false">
-      <a-form
-        class="ele-form-detail"
-        :label-col="
-          styleResponsive ? { md: 2, sm: 4, xs: 6 } : { flex: '90px' }
-        "
-        :wrapper-col="
-          styleResponsive ? { md: 22, sm: 20, xs: 18 } : { flex: '1' }
-        "
-      >
-        <a-form-item label="账号">
-          <div class="ele-text-secondary">{{ form.username }}</div>
-        </a-form-item>
-        <a-form-item label="昵称">
-          <div class="ele-text-secondary">{{ form.nickname }}</div>
-        </a-form-item>
-        <a-form-item label="性别">
-          <div class="ele-text-secondary">{{ form.sexName }}</div>
-        </a-form-item>
-        <a-form-item label="手机号">
-          <div class="ele-text-secondary">{{ form.phone }}</div>
-        </a-form-item>
-        <a-form-item label="真实姓名">
-          <div class="ele-text-secondary">{{ form.realName }}</div>
-        </a-form-item>
-        <a-form-item label="别名">
-          <div class="ele-text-secondary">{{ form.alias }}</div>
-        </a-form-item>
-        <a-form-item label="角色">
-          <a-tag v-for="item in form.roles" :key="item.roleId" color="blue">
-            {{ item.roleName }}
-          </a-tag>
-        </a-form-item>
-        <a-form-item label="创建时间">
-          <div class="ele-text-secondary">{{ form.createTime }}</div>
-        </a-form-item>
-        <a-form-item label="状态">
-          <a-badge
-            v-if="typeof form.status === 'number'"
-            :status="(['processing', 'error'][form.status] as any)"
-            :text="['正常', '冻结'][form.status]"
-          />
-        </a-form-item>
-      </a-form>
-    </a-card>
-  </div>
-</template>
-
-<script lang="ts" setup>
-  import { ref, watch, unref } from 'vue';
-  import { useRouter } from 'vue-router';
-  import { message } from 'ant-design-vue/es';
-  import { toDateString } from 'ele-admin-pro/es';
-  import { storeToRefs } from 'pinia';
-  import { useThemeStore } from '@/store/modules/theme';
-  import useFormData from '@/utils/use-form-data';
-  import { setPageTabTitle } from '@/utils/page-tab-util';
-  import { getUser } from '@/api/system/user';
-  import type { User } from '@/api/system/user/model';
-  const ROUTE_PATH = '/system/user/details';
-
-  // 是否开启响应式布局
-  const themeStore = useThemeStore();
-  const { styleResponsive } = storeToRefs(themeStore);
-
-  const { currentRoute } = useRouter();
-
-  // 用户信息
-  const { form, assignFields } = useFormData<User>({
-    userId: undefined,
-    alias: '',
-    realName: '',
-    username: '',
-    nickname: '',
-    sexName: '',
-    phone: '',
-    roles: [],
-    createTime: undefined,
-    status: undefined
-  });
-
-  // 请求状态
-  const loading = ref(true);
-
-  /*  */
-  const query = () => {
-    const { query } = unref(currentRoute);
-    const id = query.id;
-    if (!id || form.userId === Number(id)) {
-      return;
-    }
-    loading.value = true;
-    getUser(Number(id))
-      .then((data) => {
-        loading.value = false;
-        assignFields({
-          ...data,
-          createTime: toDateString(data.createTime)
-        });
-        // 修改页签标题
-        if (unref(currentRoute).path === ROUTE_PATH) {
-          setPageTabTitle(data.nickname + '的信息');
-        }
-      })
-      .catch((e) => {
-        loading.value = false;
-        message.error(e.message);
-      });
-  };
-
-  watch(
-    currentRoute,
-    (route) => {
-      const { path } = unref(route);
-      if (path !== ROUTE_PATH) {
-        return;
-      }
-      query();
-    },
-    { immediate: true }
-  );
-</script>
-
-<script lang="ts">
-  export default {
-    name: 'SystemUserDetails'
-  };
-</script>

src/views/booking/teacher3/index.vue

@@ -1,511 +0,0 @@
-<template>
-  <div class="ele-body">
-    <a-card :bordered="false">
-      <!-- 表格 -->
-      <ele-pro-table
-        ref="tableRef"
-        row-key="userId"
-        :columns="columns"
-        :datasource="datasource"
-        :scroll="{ x: 1300 }"
-        :where="defaultWhere"
-        :customRow="customRow"
-        cache-key="proSystemUserTable"
-      >
-        <template #toolbar>
-          <a-space>
-            <a-button type="primary" class="ele-btn-icon" @click="openEdit">
-              <template #icon>
-                <PlusOutlined />
-              </template>
-              <span>添加</span>
-            </a-button>
-            <a-input-search
-              allow-clear
-              v-model:value="searchText"
-              placeholder="请输入关键词"
-              @search="reload"
-              @pressEnter="reload"
-            />
-          </a-space>
-        </template>
-        <template #bodyCell="{ column, record }">
-          <template v-if="column.key === 'nickname'">
-            <div class="user-box">
-              <a-avatar
-                :size="30"
-                :src="`${record.avatar}`"
-                style="margin-right: 4px"
-              >
-                <template #icon>
-                  <UserOutlined />
-                </template>
-              </a-avatar>
-              <div class="user-info" @click="openEdit(record)">
-                <span>{{ record.nickname }}</span>
-                <!--                <span class="ele-text-placeholder">{{ record.nickname }}</span>-->
-              </div>
-            </div>
-          </template>
-          <template v-if="column.key === 'mobile'">
-            <span>{{ record.mobile }}</span>
-          </template>
-          <template v-else-if="column.key === 'roles'">
-            <a-tag v-for="item in record.roles" :key="item.roleId" color="blue">
-              {{ item.roleName }}
-            </a-tag>
-          </template>
-          <template v-if="column.key === 'balance'">
-            <span class="ele-text-success">
-              ￥{{ formatNumber(record.balance) }}
-            </span>
-          </template>
-          <template v-if="column.key === 'expendMoney'">
-            <span class="ele-text-warning">
-              ￥{{ formatNumber(record.expendMoney) }}
-            </span>
-          </template>
-          <template v-else-if="column.key === 'status'">
-            <a-switch
-              :checked="record.status === 0"
-              @change="(checked: boolean) => editStatus(checked, record)"
-            />
-          </template>
-          <template v-else-if="column.key === 'action'">
-            <a-space>
-              <a @click="openEdit(record)">修改</a>
-              <a-divider type="vertical" />
-              <!--              <a @click="resetPsw(record)">重置</a>-->
-              <!--              <a-divider type="vertical" />-->
-              <a-popconfirm
-                placement="topRight"
-                title="确定要删除此用户吗？"
-                @confirm="remove(record)"
-              >
-                <a class="ele-text-danger">删除</a>
-              </a-popconfirm>
-            </a-space>
-          </template>
-        </template>
-      </ele-pro-table>
-    </a-card>
-    <!-- 编辑弹窗 -->
-    <user-edit
-      v-model:visible="showEdit"
-      :data="current"
-      :organization-list="data"
-      @done="reload"
-    />
-    <!-- 用户详情 -->
-    <user-info v-model:visible="showInfo" :data="current" @done="reload" />
-  </div>
-</template>
-
-<script lang="ts" setup>
-  import { createVNode, ref, reactive } from 'vue';
-  import { message, Modal } from 'ant-design-vue/es';
-  import {
-    PlusOutlined,
-    DeleteOutlined,
-    UploadOutlined,
-    EditOutlined,
-    UserOutlined,
-    ExclamationCircleOutlined
-  } from '@ant-design/icons-vue';
-  import type { EleProTable } from 'ele-admin-pro/es';
-  import type {
-    DatasourceFunction,
-    ColumnItem
-  } from 'ele-admin-pro/es/ele-pro-table/types';
-  import { messageLoading, formatNumber } from 'ele-admin-pro/es';
-  import { timeAgo } from 'ele-admin-pro';
-  import UserEdit from './components/user-edit.vue';
-  import UserImport from './components/user-import.vue';
-  import UserInfo from './components/user-info.vue';
-  import {
-    pageUsers,
-    removeUser,
-    removeUsers,
-    updateUserStatus,
-    updateUserPassword
-  } from '@/api/system/user';
-  import type { User, UserParam } from '@/api/system/user/model';
-  import { toTreeData, uuid } from 'ele-admin-pro';
-  import { listRoles } from '@/api/system/role';
-  import { listOrganizations } from '@/api/system/organization';
-  import { Organization } from '@/api/system/organization/model';
-  import { hasRole } from '@/utils/permission';
-
-  // 加载状态
-  const loading = ref(true);
-  // 树形数据
-  const data = ref<Organization[]>([]);
-  // 树展开的key
-  const expandedRowKeys = ref<number[]>([]);
-  // 树选中的key
-  const selectedRowKeys = ref<number[]>([]);
-  // 表格选中数据
-  const selection = ref<User[]>([]);
-  // 当前编辑数据
-  const current = ref<User | null>(null);
-  // 是否显示编辑弹窗
-  const showEdit = ref(false);
-  // 是否显示用户详情
-  const showInfo = ref(false);
-  // 是否显示用户导入弹窗
-  const showImport = ref(false);
-  const userType = ref<number>();
-  const searchText = ref('');
-
-  // 加载角色
-  const roles = ref<any[]>([]);
-  const filters = () => {
-    listRoles().then((result) => {
-      result.map((d) => {
-        roles.value.push({
-          text: d.roleName,
-          value: d.roleId
-        });
-      });
-    });
-  };
-  filters();
-  // 加载机构
-  listOrganizations()
-    .then((list) => {
-      loading.value = false;
-      const eks: number[] = [];
-      list.forEach((d) => {
-        d.key = d.organizationId;
-        d.value = d.organizationId;
-        d.title = d.organizationName;
-        if (typeof d.key === 'number') {
-          eks.push(d.key);
-        }
-      });
-      expandedRowKeys.value = eks;
-      data.value = toTreeData({
-        data: list,
-        idField: 'organizationId',
-        parentIdField: 'parentId'
-      });
-      if (list.length) {
-        if (typeof list[0].key === 'number') {
-          selectedRowKeys.value = [list[0].key];
-        }
-        // current.value = list[0];
-      } else {
-        selectedRowKeys.value = [];
-        // current.value = null;
-      }
-    })
-    .catch((e) => {
-      loading.value = false;
-      message.error(e.message);
-    });
-
-  // 表格实例
-  const tableRef = ref<InstanceType<typeof EleProTable> | null>(null);
-  // 表格列配置
-  const columns = ref<ColumnItem[]>([
-    {
-      title: 'ID',
-      dataIndex: 'userId',
-      width: 80,
-      showSorterTooltip: false
-    },
-    {
-      title: '老师',
-      key: 'nickname',
-      dataIndex: 'nickname',
-      width: 240,
-      showSorterTooltip: false
-    },
-    {
-      title: '手机号码',
-      dataIndex: 'phone',
-      key: 'phone',
-      showSorterTooltip: false
-    },
-    // {
-    //   title: '客户分组',
-    //   dataIndex: 'type',
-    //   key: 'type',
-    //   align: 'center',
-    //   width: 120
-    // },
-    {
-      title: '性别',
-      dataIndex: 'sexName',
-      align: 'center',
-      width: 180,
-      showSorterTooltip: false
-    },
-    {
-      title: '邮箱',
-      dataIndex: 'email',
-      hideInTable: true,
-      width: 180,
-      showSorterTooltip: false
-    },
-    {
-      title: '可用余额',
-      dataIndex: 'balance',
-      key: 'balance',
-      align: 'center',
-      width: 180,
-      sorter: true,
-      showSorterTooltip: false
-    },
-    {
-      title: '实际消费金额',
-      dataIndex: 'expendMoney',
-      key: 'expendMoney',
-      sorter: true,
-      hideInTable: true,
-      showSorterTooltip: false
-    },
-    {
-      title: '可用积分',
-      dataIndex: 'points',
-      hideInTable: true,
-      sorter: true
-    },
-    {
-      title: '注册来源',
-      key: 'platform',
-      align: 'center',
-      dataIndex: 'platform',
-      hideInTable: true,
-      customRender: ({ text }) => ['未知', '网站', '小程序', 'APP'][text]
-    },
-    {
-      title: '证件号码',
-      dataIndex: 'idCard',
-      hideInTable: true
-    },
-    {
-      title: '出生日期',
-      dataIndex: 'birthday',
-      key: 'birthday',
-      hideInTable: true
-    },
-    {
-      title: '省份',
-      dataIndex: 'province',
-      key: 'province',
-      hideInTable: true
-    },
-    {
-      title: '城市',
-      dataIndex: 'city',
-      key: 'city',
-      hideInTable: true,
-      showSorterTooltip: false
-    },
-    {
-      title: '地区',
-      dataIndex: 'region',
-      key: 'region',
-      hideInTable: true,
-      showSorterTooltip: false
-    },
-    {
-      title: '个人简介',
-      dataIndex: 'introduction',
-      key: 'introduction',
-      hideInTable: true,
-      showSorterTooltip: false
-    },
-    {
-      title: '邮箱认证',
-      dataIndex: 'emailVerified',
-      hideInTable: true,
-      showSorterTooltip: false,
-      customRender: ({ text }) => ['未认证', '已认证'][text]
-    },
-    {
-      title: '实名认证',
-      dataIndex: 'certification',
-      sorter: true,
-      hideInTable: true,
-      customRender: ({ text }) => ['未认证', '已认证'][text]
-    },
-    {
-      title: '注册时间',
-      dataIndex: 'createTime',
-      sorter: true,
-      align: 'center',
-      width: 200,
-      showSorterTooltip: false,
-      ellipsis: true,
-      customRender: ({ text }) => timeAgo(text)
-    },
-    {
-      title: '操作',
-      key: 'action',
-      width: 120,
-      fixed: 'right',
-      align: 'center'
-    }
-  ]);
-
-  // 默认搜索条件
-  const defaultWhere = reactive({
-    username: '',
-    nickname: ''
-  });
-
-  // 表格数据源
-  const datasource: DatasourceFunction = ({
-    page,
-    limit,
-    where,
-    orders,
-    filters
-  }) => {
-    where = {};
-    where.roleId = filters.roles;
-    where.keywords = searchText.value;
-    where.groupId = 22;
-    return pageUsers({ page, limit, ...where, ...orders });
-  };
-
-  /* 搜索 */
-  const reload = (where?: UserParam) => {
-    selection.value = [];
-    tableRef?.value?.reload({ where });
-  };
-
-  /* 打开编辑弹窗 */
-  const openEdit = (row?: User) => {
-    current.value = row ?? null;
-    showEdit.value = true;
-  };
-
-  /* 打开用户详情弹窗 */
-  const openInfo = (row?: User) => {
-    current.value = row ?? null;
-    showInfo.value = true;
-  };
-
-  /* 打开编辑弹窗 */
-  const openImport = () => {
-    showImport.value = true;
-  };
-
-  const handleTabs = (e) => {
-    userType.value = Number(e.target.value);
-    reload();
-  };
-
-  /* 删除单个 */
-  const remove = (row: User) => {
-    const hide = messageLoading('请求中..', 0);
-    removeUser(row.userId)
-      .then((msg) => {
-        hide();
-        message.success(msg);
-        reload();
-      })
-      .catch((e) => {
-        hide();
-        message.error(e.message);
-      });
-  };
-
-  /* 批量删除 */
-  const removeBatch = () => {
-    if (!selection.value.length) {
-      message.error('请至少选择一条数据');
-      return;
-    }
-    Modal.confirm({
-      title: '提示',
-      content: '确定要删除选中的用户吗?',
-      icon: createVNode(ExclamationCircleOutlined),
-      maskClosable: true,
-      onOk: () => {
-        const hide = messageLoading('请求中..', 0);
-        removeUsers(selection.value.map((d) => d.userId))
-          .then((msg) => {
-            hide();
-            message.success(msg);
-            reload();
-          })
-          .catch((e) => {
-            hide();
-            message.error(e.message);
-          });
-      }
-    });
-  };
-
-  /* 重置用户密码 */
-  const resetPsw = (row: User) => {
-    Modal.confirm({
-      title: '提示',
-      content: '确定要重置此用户的密码吗?',
-      icon: createVNode(ExclamationCircleOutlined),
-      maskClosable: true,
-      onOk: () => {
-        const hide = message.loading('请求中..', 0);
-        const password = uuid(8);
-        updateUserPassword(row.userId, password)
-          .then((msg) => {
-            hide();
-            message.success(msg + '，新密码：' + password);
-          })
-          .catch((e) => {
-            hide();
-            message.error(e.message);
-          });
-      }
-    });
-  };
-
-  /* 修改用户状态 */
-  const editStatus = (checked: boolean, row: User) => {
-    const status = checked ? 0 : 1;
-    updateUserStatus(row.userId, status)
-      .then((msg) => {
-        row.status = status;
-        message.success(msg);
-      })
-      .catch((e) => {
-        message.error(e.message);
-      });
-  };
-
-  /* 自定义行属性 */
-  const customRow = (record: User) => {
-    return {
-      // 行点击事件
-      onClick: () => {
-        // console.log(record);
-      },
-      // 行双击事件
-      onDblclick: () => {
-        openEdit(record);
-      }
-    };
-  };
-</script>
-
-<script lang="ts">
-  export default {
-    name: 'SystemUser'
-  };
-</script>
-
-<style lang="less" scoped>
-  .user-box {
-    display: flex;
-    align-items: center;
-    .user-info {
-      display: flex;
-      flex-direction: column;
-      align-items: start;
-    }
-  }
-</style>

src/views/booking/users/components/search.vue

@@ -0,0 +1,53 @@
+<!-- 搜索表单 -->
+<template>
+  <a-space :size="10" style="flex-wrap: wrap">
+    <a-input-search
+      allow-clear
+      v-model:value="where.keywords"
+      placeholder="请输入关键词"
+      @search="search"
+      @pressEnter="search"
+    />
+  </a-space>
+</template>
+
+<script lang="ts" setup>
+  import { watch } from 'vue';
+  import useSearch from '@/utils/use-search';
+  import { UsersParam } from '@/api/booking/users/model';
+
+  const props = withDefaults(
+    defineProps<{
+      // 选中的角色
+      selection?: [];
+    }>(),
+    {}
+  );
+
+  const emit = defineEmits<{
+    (e: 'search', where?: UsersParam): void;
+    (e: 'add'): void;
+    (e: 'remove'): void;
+    (e: 'batchMove'): void;
+  }>();
+
+  // 表单数据
+  const { where } = useSearch<UsersParam>({
+    keywords: ''
+  });
+
+  /* 搜索 */
+  const search = () => {
+    emit('search', where);
+  };
+
+  // 新增
+  const add = () => {
+    emit('add');
+  };
+
+  watch(
+    () => props.selection,
+    () => {}
+  );
+</script>

src/views/booking/users/components/userEdit.vue

@@ -0,0 +1,347 @@
+<!-- 编辑弹窗 -->
+<template>
+  <ele-modal
+    :width="800"
+    :visible="visible"
+    :maskClosable="false"
+    :maxable="maxable"
+    :title="isUpdate ? '编辑用户' : '添加用户'"
+    :body-style="{ paddingBottom: '28px' }"
+    @update:visible="updateVisible"
+    @ok="save"
+  >
+    <a-form
+      ref="formRef"
+      :model="form"
+      :rules="rules"
+      :label-col="styleResponsive ? { md: 4, sm: 5, xs: 24 } : { flex: '90px' }"
+      :wrapper-col="
+        styleResponsive ? { md: 19, sm: 19, xs: 24 } : { flex: '1' }
+      "
+    >
+      <a-form-item label="用户唯一小程序id" name="openId">
+        <a-input
+          allow-clear
+          placeholder="请输入用户唯一小程序id"
+          v-model:value="form.openId"
+        />
+      </a-form-item>
+      <a-form-item label="小程序用户秘钥" name="sessionKey">
+        <a-input
+          allow-clear
+          placeholder="请输入小程序用户秘钥"
+          v-model:value="form.sessionKey"
+        />
+      </a-form-item>
+      <a-form-item label="用户名" name="username">
+        <a-input
+          allow-clear
+          placeholder="请输入用户名"
+          v-model:value="form.username"
+        />
+      </a-form-item>
+      <a-form-item label="头像地址" name="avatarUrl">
+        <a-input
+          allow-clear
+          placeholder="请输入头像地址"
+          v-model:value="form.avatarUrl"
+        />
+      </a-form-item>
+      <a-form-item label="1男，2女" name="gender">
+        <a-input
+          allow-clear
+          placeholder="请输入1男，2女"
+          v-model:value="form.gender"
+        />
+      </a-form-item>
+      <a-form-item label="国家" name="country">
+        <a-input
+          allow-clear
+          placeholder="请输入国家"
+          v-model:value="form.country"
+        />
+      </a-form-item>
+      <a-form-item label="省份" name="province">
+        <a-input
+          allow-clear
+          placeholder="请输入省份"
+          v-model:value="form.province"
+        />
+      </a-form-item>
+      <a-form-item label="城市" name="city">
+        <a-input
+          allow-clear
+          placeholder="请输入城市"
+          v-model:value="form.city"
+        />
+      </a-form-item>
+      <a-form-item label="所在辖区" name="region">
+        <a-input
+          allow-clear
+          placeholder="请输入所在辖区"
+          v-model:value="form.region"
+        />
+      </a-form-item>
+      <a-form-item label="手机号码" name="phone">
+        <a-input
+          allow-clear
+          placeholder="请输入手机号码"
+          v-model:value="form.phone"
+        />
+      </a-form-item>
+      <a-form-item label="邮箱" name="email">
+        <a-input
+          allow-clear
+          placeholder="请输入邮箱"
+          v-model:value="form.email"
+        />
+      </a-form-item>
+      <a-form-item label="邮箱是否验证, 0否, 1是" name="emailVerified">
+        <a-input
+          allow-clear
+          placeholder="请输入邮箱是否验证, 0否, 1是"
+          v-model:value="form.emailVerified"
+        />
+      </a-form-item>
+      <a-form-item label="积分" name="points">
+        <a-input
+          allow-clear
+          placeholder="请输入积分"
+          v-model:value="form.points"
+        />
+      </a-form-item>
+      <a-form-item label="余额" name="balance">
+        <a-input
+          allow-clear
+          placeholder="请输入余额"
+          v-model:value="form.balance"
+        />
+      </a-form-item>
+      <a-form-item label="注册时间" name="addTime">
+        <a-input
+          allow-clear
+          placeholder="请输入注册时间"
+          v-model:value="form.addTime"
+        />
+      </a-form-item>
+      <a-form-item label="" name="idcard">
+        <a-input allow-clear placeholder="请输入" v-model:value="form.idcard" />
+      </a-form-item>
+      <a-form-item label="" name="truename">
+        <a-input
+          allow-clear
+          placeholder="请输入"
+          v-model:value="form.truename"
+        />
+      </a-form-item>
+      <a-form-item label="是否管理员：1是；2否" name="isAdmin">
+        <a-input
+          allow-clear
+          placeholder="请输入是否管理员：1是；2否"
+          v-model:value="form.isAdmin"
+        />
+      </a-form-item>
+      <a-form-item label="客户端ID" name="clientId">
+        <a-input
+          allow-clear
+          placeholder="请输入客户端ID"
+          v-model:value="form.clientId"
+        />
+      </a-form-item>
+      <a-form-item label="注册来源客户端 (APP、H5、小程序等)" name="platform">
+        <a-input
+          allow-clear
+          placeholder="请输入注册来源客户端 (APP、H5、小程序等)"
+          v-model:value="form.platform"
+        />
+      </a-form-item>
+      <a-form-item label="排序" name="sortNumber">
+        <a-input-number
+          :min="0"
+          :max="9999"
+          class="ele-fluid"
+          placeholder="请输入排序号"
+          v-model:value="form.sortNumber"
+        />
+      </a-form-item>
+      <a-form-item label="备注" name="comments">
+        <a-textarea
+          :rows="4"
+          :maxlength="200"
+          placeholder="请输入描述"
+          v-model:value="form.comments"
+        />
+      </a-form-item>
+      <a-form-item label="状态" name="status">
+        <a-radio-group v-model:value="form.status">
+          <a-radio :value="0">显示</a-radio>
+          <a-radio :value="1">隐藏</a-radio>
+        </a-radio-group>
+      </a-form-item>
+      <a-form-item label="是否删除, 0否, 1是" name="deleted">
+        <a-input
+          allow-clear
+          placeholder="请输入是否删除, 0否, 1是"
+          v-model:value="form.deleted"
+        />
+      </a-form-item>
+    </a-form>
+  </ele-modal>
+</template>
+
+<script lang="ts" setup>
+  import { ref, reactive, watch } from 'vue';
+  import { Form, message } from 'ant-design-vue';
+  import { assignObject, uuid } from 'ele-admin-pro';
+  import { addUsers, updateUsers } from '@/api/booking/users';
+  import { Users } from '@/api/booking/users/model';
+  import { useThemeStore } from '@/store/modules/theme';
+  import { storeToRefs } from 'pinia';
+  import { ItemType } from 'ele-admin-pro/es/ele-image-upload/types';
+  import { FormInstance } from 'ant-design-vue/es/form';
+  import { FileRecord } from '@/api/system/file/model';
+
+  // 是否是修改
+  const isUpdate = ref(false);
+  const useForm = Form.useForm;
+  // 是否开启响应式布局
+  const themeStore = useThemeStore();
+  const { styleResponsive } = storeToRefs(themeStore);
+
+  const props = defineProps<{
+    // 弹窗是否打开
+    visible: boolean;
+    // 修改回显的数据
+    data?: Users | null;
+  }>();
+
+  const emit = defineEmits<{
+    (e: 'done'): void;
+    (e: 'update:visible', visible: boolean): void;
+  }>();
+
+  // 提交状态
+  const loading = ref(false);
+  // 是否显示最大化切换按钮
+  const maxable = ref(true);
+  // 表格选中数据
+  const formRef = ref<FormInstance | null>(null);
+  const images = ref<ItemType[]>([]);
+
+  // 用户信息
+  const form = reactive<Users>({
+    userId: undefined,
+    openid: undefined,
+    sessionKey: undefined,
+    username: undefined,
+    avatarUrl: undefined,
+    sex: undefined,
+    country: undefined,
+    province: undefined,
+    city: undefined,
+    region: undefined,
+    phone: undefined,
+    email: undefined,
+    emailVerified: undefined,
+    points: undefined,
+    balance: undefined,
+    addTime: undefined,
+    idCard: undefined,
+    realName: undefined,
+    isAdmin: undefined,
+    clientId: undefined,
+    platform: undefined,
+    sortNumber: undefined,
+    comments: undefined,
+    status: undefined,
+    deleted: undefined,
+    tenantId: undefined,
+    createTime: undefined
+  });
+
+  /* 更新visible */
+  const updateVisible = (value: boolean) => {
+    emit('update:visible', value);
+  };
+
+  // 表单验证规则
+  const rules = reactive({
+    userName: [
+      {
+        required: true,
+        type: 'string',
+        message: '请填写用户名称',
+        trigger: 'blur'
+      }
+    ]
+  });
+
+  const chooseImage = (data: FileRecord) => {
+    images.value.push({
+      uid: data.id,
+      url: data.path,
+      status: 'done'
+    });
+    form.avatarUrl = data.path;
+  };
+
+  const onDeleteItem = (index: number) => {
+    images.value.splice(index, 1);
+    form.avatarUrl = '';
+  };
+
+  const { resetFields } = useForm(form, rules);
+
+  /* 保存编辑 */
+  const save = () => {
+    if (!formRef.value) {
+      return;
+    }
+    formRef.value
+      .validate()
+      .then(() => {
+        loading.value = true;
+        const formData = {
+          ...form
+        };
+        const saveOrUpdate = isUpdate.value ? updateUsers : addUsers;
+        saveOrUpdate(formData)
+          .then((msg) => {
+            loading.value = false;
+            message.success(msg);
+            updateVisible(false);
+            emit('done');
+          })
+          .catch((e) => {
+            loading.value = false;
+            message.error(e.message);
+          });
+      })
+      .catch(() => {});
+  };
+
+  watch(
+    () => props.visible,
+    (visible) => {
+      if (visible) {
+        images.value = [];
+        if (props.data) {
+          assignObject(form, props.data);
+          if (props.data.avatarUrl) {
+            images.value.push({
+              uid: uuid(),
+              url: props.data.avatarUrl,
+              status: 'done'
+            });
+          }
+          isUpdate.value = true;
+        } else {
+          isUpdate.value = false;
+        }
+      } else {
+        resetFields();
+      }
+    },
+    { immediate: true }
+  );
+</script>

src/views/booking/users/index.vue

@@ -0,0 +1,305 @@
+<template>
+  <div class="page">
+    <div class="ele-body">
+      <a-card :bordered="false" :body-style="{ padding: '16px' }">
+        <ele-pro-table
+          ref="tableRef"
+          row-key="userId"
+          :columns="columns"
+          :datasource="datasource"
+          :customRow="customRow"
+          tool-class="ele-toolbar-form"
+          class="sys-org-table"
+        >
+          <template #toolbar>
+            <search
+              @search="reload"
+              :selection="selection"
+              @add="openEdit"
+              @remove="removeBatch"
+              @batchMove="openMove"
+            />
+          </template>
+          <template #bodyCell="{ column, record }">
+            <template v-if="column.key === 'avatarUrl'">
+              <a-avatar
+                :size="36"
+                :src="`${record.avatarUrl}`"
+                style="margin-right: 4px"
+              >
+                <template #icon>
+                  <UserOutlined />
+                </template>
+              </a-avatar>
+            </template>
+            <template v-if="column.key === 'status'">
+              <a-tag v-if="record.status === 1" color="green">启用</a-tag>
+              <a-tag v-if="record.status === 2" color="red">禁用</a-tag>
+            </template>
+            <template v-if="column.key === 'action'">
+              <a-space>
+                <a>积分充值</a>
+                <a-divider type="vertical" />
+                <a>分配特殊卡</a>
+                <!--                <a-popconfirm-->
+                <!--                  title="确定要删除此记录吗？"-->
+                <!--                  @confirm="remove(record)"-->
+                <!--                >-->
+                <!--                  <a class="ele-text-danger">删除</a>-->
+                <!--                </a-popconfirm>-->
+              </a-space>
+            </template>
+          </template>
+        </ele-pro-table>
+      </a-card>
+
+      <!-- 编辑弹窗 -->
+      <UserEdit v-model:visible="showEdit" :data="current" @done="reload" />
+    </div>
+  </div>
+</template>
+
+<script lang="ts" setup>
+  import { createVNode, ref } from 'vue';
+  import { message, Modal } from 'ant-design-vue';
+  import {
+    ExclamationCircleOutlined,
+    UserOutlined
+  } from '@ant-design/icons-vue';
+  import type { EleProTable } from 'ele-admin-pro';
+  import { toDateString } from 'ele-admin-pro';
+  import type {
+    DatasourceFunction,
+    ColumnItem
+  } from 'ele-admin-pro/es/ele-pro-table/types';
+  import Search from './components/search.vue';
+  import UserEdit from './components/userEdit.vue';
+  import {
+    pageUsers,
+    removeBatchUsers,
+    removeUsers
+  } from '@/api/booking/users';
+  import type { Users, UsersParam } from '@/api/booking/users/model';
+
+  // 表格实例
+  const tableRef = ref<InstanceType<typeof EleProTable> | null>(null);
+
+  // 表格选中数据
+  const selection = ref<Users[]>([]);
+  // 当前编辑数据
+  const current = ref<Users | null>(null);
+  // 是否显示编辑弹窗
+  const showEdit = ref(false);
+  // 是否显示批量移动弹窗
+  const showMove = ref(false);
+  // 加载状态
+  const loading = ref(true);
+
+  // 表格数据源
+  const datasource: DatasourceFunction = ({
+    page,
+    limit,
+    where,
+    orders,
+    filters
+  }) => {
+    if (filters) {
+      where.status = filters.status;
+    }
+    return pageUsers({
+      ...where,
+      ...orders,
+      page,
+      limit
+    });
+  };
+
+  // 表格列配置
+  const columns = ref<ColumnItem[]>([
+    {
+      title: 'ID',
+      dataIndex: 'userId',
+      key: 'userId',
+      width: 90
+    },
+    {
+      title: '头像',
+      dataIndex: 'avatarUrl',
+      key: 'avatarUrl',
+      align: 'center'
+    },
+    {
+      title: '用户名',
+      dataIndex: 'username',
+      key: 'username',
+      align: 'center'
+    },
+    {
+      title: '手机号码',
+      dataIndex: 'phone',
+      key: 'phone',
+      align: 'center'
+    },
+    {
+      title: '性别',
+      dataIndex: 'sexName',
+      key: 'sexName',
+      align: 'center'
+    },
+    {
+      title: '国家',
+      dataIndex: 'country',
+      key: 'country',
+      align: 'center',
+      hideInTable: true
+    },
+    {
+      title: '省份',
+      dataIndex: 'province',
+      key: 'province',
+      align: 'center'
+    },
+    {
+      title: '城市',
+      dataIndex: 'city',
+      key: 'city',
+      align: 'center'
+    },
+    {
+      title: '所在辖区',
+      dataIndex: 'region',
+      key: 'region',
+      align: 'center',
+      hideInTable: true
+    },
+    {
+      title: '邮箱是否验证, 0否, 1是',
+      dataIndex: 'emailVerified',
+      key: 'emailVerified',
+      align: 'center',
+      hideInTable: true
+    },
+    {
+      title: '积分',
+      dataIndex: 'points',
+      key: 'points',
+      align: 'center'
+    },
+    {
+      title: '余额',
+      dataIndex: 'balance',
+      key: 'balance',
+      align: 'center'
+    },
+    {
+      title: '状态',
+      dataIndex: 'status',
+      key: 'status',
+      align: 'center'
+    },
+    {
+      title: '注册时间',
+      dataIndex: 'addTime',
+      key: 'addTime',
+      align: 'center',
+      sorter: true,
+      ellipsis: true,
+      customRender: ({ text }) => toDateString(text, 'yyyy-MM-dd')
+    },
+    {
+      title: '操作',
+      key: 'action',
+      width: 180,
+      fixed: 'right',
+      align: 'center',
+      hideInSetting: true
+    }
+  ]);
+
+  /* 搜索 */
+  const reload = (where?: UsersParam) => {
+    selection.value = [];
+    tableRef?.value?.reload({ where: where });
+  };
+
+  /* 打开编辑弹窗 */
+  const openEdit = (row?: Users) => {
+    current.value = row ?? null;
+    showEdit.value = true;
+  };
+
+  /* 打开批量移动弹窗 */
+  const openMove = () => {
+    showMove.value = true;
+  };
+
+  /* 删除单个 */
+  const remove = (row: Users) => {
+    const hide = message.loading('请求中..', 0);
+    removeUsers(row.userId)
+      .then((msg) => {
+        hide();
+        message.success(msg);
+        reload();
+      })
+      .catch((e) => {
+        hide();
+        message.error(e.message);
+      });
+  };
+
+  /* 批量删除 */
+  const removeBatch = () => {
+    if (!selection.value.length) {
+      message.error('请至少选择一条数据');
+      return;
+    }
+    Modal.confirm({
+      title: '提示',
+      content: '确定要删除选中的记录吗?',
+      icon: createVNode(ExclamationCircleOutlined),
+      maskClosable: true,
+      onOk: () => {
+        const hide = message.loading('请求中..', 0);
+        removeBatchUsers(selection.value.map((d) => d.userId))
+          .then((msg) => {
+            hide();
+            message.success(msg);
+            reload();
+          })
+          .catch((e) => {
+            hide();
+            message.error(e.message);
+          });
+      }
+    });
+  };
+
+  /* 查询 */
+  const query = () => {
+    loading.value = true;
+  };
+
+  /* 自定义行属性 */
+  const customRow = (record: Users) => {
+    return {
+      // 行点击事件
+      onClick: () => {
+        // console.log(record);
+      },
+      // 行双击事件
+      onDblclick: () => {
+        openEdit(record);
+      }
+    };
+  };
+  query();
+</script>
+
+<script lang="ts">
+  export default {
+    name: 'Users'
+  };
+</script>
+
+<style lang="less" scoped></style>