订单列表页面接入，修改crud搜索支持radio-button类型

src/views/order/index/index.vue

@@ -0,0 +1,150 @@
+<template>
+  <div class="app-container">
+    <!-- 列表 -->
+    <template v-if="isA">
+      <!-- 搜索 -->
+      <page-search
+        ref="searchRef"
+        :search-config="searchConfig"
+        @query-click="handleQueryClick"
+        @reset-click="handleResetClick"
+      />
+      <!-- 列表 -->
+      <page-content
+        ref="contentRef"
+        :content-config="contentConfig"
+        @add-click="handleAddClick"
+        @edit-click="handleEditClick"
+        @export-click="handleExportClick"
+        @search-click="handleSearchClick"
+        @toolbar-click="handleToolbarClick"
+        @operat-click="handleOperatClick"
+        @filter-change="handleFilterChange"
+      >
+        <template #status="scope">
+          <el-tag :type="scope.row[scope.prop] == 1 ? 'success' : 'info'">
+            {{ scope.row[scope.prop] == 1 ? "启用" : "禁用" }}
+          </el-tag>
+        </template>
+        <template #options="scope">
+          {{ returnOptionsLabel(scope.prop, scope.row[scope.prop]) }}
+        </template>
+        <template #gender="scope">
+          <DictLabel v-model="scope.row[scope.prop]" code="gender" />
+        </template>
+        <template #mobile="scope">
+          <el-text>{{ scope.row[scope.prop] }}</el-text>
+          <copy-button
+            v-if="scope.row[scope.prop]"
+            :text="scope.row[scope.prop]"
+            style="margin-left: 2px"
+          />
+        </template>
+      </page-content>
+
+      <!-- 新增 -->
+      <page-modal
+        ref="addModalRef"
+        :modal-config="addModalConfig"
+        @submit-click="handleSubmitClick"
+      >
+        <template #url="scope">
+          <FileUpload v-model="scope.formData[scope.prop]" :limit="1" v-bind="scope.attrs" />
+          <!-- <Dict v-model="scope.formData[scope.prop]" code="gender" v-bind="scope.attrs" /> -->
+        </template>
+      </page-modal>
+
+      <!-- 编辑 -->
+      <page-modal
+        ref="editModalRef"
+        :modal-config="editModalConfig"
+        @submit-click="handleSubmitClick"
+      >
+        <template #url="scope">
+          <FileUpload v-model="scope.formData[scope.prop]" :limit="1" v-bind="scope.attrs" />
+          <!-- <Dict v-model="scope.formData[scope.prop]" code="gender" v-bind="scope.attrs" /> -->
+        </template>
+      </page-modal>
+    </template>
+    <template v-else>
+      <page-content
+        ref="contentRef"
+        :content-config="contentConfig2"
+        @operat-click="handleOperatClick"
+      >
+        <template #status="scope">
+          <el-tag :type="scope.row[scope.prop] == 1 ? 'success' : 'info'">
+            {{ scope.row[scope.prop] == 1 ? "启用" : "禁用" }}
+          </el-tag>
+        </template>
+      </page-content>
+    </template>
+  </div>
+</template>
+
+<script setup lang="ts">
+import VersionApi from "@/api/system/version";
+import DeptAPI from "@/api/system/dept";
+import RoleAPI from "@/api/system/role";
+import type { IObject, IOperatData } from "@/components/CURD/types";
+import usePage from "@/components/CURD/usePage";
+import addModalConfig from "./config/add";
+import contentConfig from "./config/content";
+import contentConfig2 from "./config/content2";
+import editModalConfig from "./config/edit";
+import searchConfig from "./config/search";
+import { returnOptionsLabel } from "./config/config";
+
+const {
+  searchRef,
+  contentRef,
+  addModalRef,
+  editModalRef,
+  handleQueryClick,
+  handleResetClick,
+  // handleAddClick,
+  // handleEditClick,
+  handleSubmitClick,
+  handleExportClick,
+  handleSearchClick,
+  handleFilterChange,
+} = usePage();
+
+// 新增
+async function handleAddClick() {
+  addModalRef.value?.setModalVisible();
+  // 加载部门下拉数据源
+  // addModalConfig.formItems[2]!.attrs!.data = await DeptAPI.getOptions();
+  // 加载角色下拉数据源
+  // addModalConfig.formItems[4]!.options = await RoleAPI.getOptions();
+}
+// 编辑
+async function handleEditClick(row: IObject) {
+  editModalRef.value?.handleDisabled(false);
+  editModalRef.value?.setModalVisible();
+  // 根据id获取数据进行填充
+  // const data = await VersionApi.getFormData(row.id);
+  console.log({ ...row, url: [row.url] });
+  editModalRef.value?.setFormData({ ...row, url: [row.url] });
+}
+1;
+// 其他工具栏
+function handleToolbarClick(name: string) {
+  console.log(name);
+  if (name === "custom1") {
+    ElMessage.success("点击了自定义1按钮");
+  }
+}
+// 其他操作列
+async function handleOperatClick(data: IOperatData) {
+  console.log(data);
+  if (data.name === "detail") {
+    return;
+  }
+  if (data.name === "printer") {
+  }
+}
+
+// 切换示例
+const isA = ref(true);
+</script>