zhl-methods 2.0.1 → 2.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,105 @@
1
+ <template>
2
+ <TableView
3
+ :loading="state.loading"
4
+ :dataSource="state.dataSource"
5
+ :pagination="paginationConfig"
6
+ height="calc(100vh - 371px)"
7
+ >
8
+ <template v-for="(_, slot) in Slots" v-slot:[slot]="scope">
9
+ <slot :name="slot" v-bind="scope" />
10
+ </template>
11
+ </TableView>
12
+ </template>
13
+ <script setup lang="ts">
14
+ import { computed, onMounted, reactive, useSlots } from "vue";
15
+ const Slots = useSlots();
16
+ import TableView from "./index.vue";
17
+ const props = defineProps({
18
+ //Promise 请求方法
19
+ api: { type: Function, default: () => false },
20
+ //请求参数
21
+ apiParams: { type: Object, default: () => ({}) },
22
+ //是否开启分页
23
+ isPage: { type: Boolean, default: () => true },
24
+ //是否进入页面自动请求
25
+ autoRequest: { type: Boolean, default: () => true },
26
+ //设置自定义参数
27
+ checkParams: { type: Function },
28
+ //设置自定义返回值
29
+ checkReturnValue: { type: Function },
30
+ });
31
+
32
+ const state = reactive({
33
+ loading: false,
34
+ pagination: {
35
+ current: 1,
36
+ pageSize: 15,
37
+ total: 0,
38
+ },
39
+ dataSource: [],
40
+ });
41
+ const paginationConfig = computed(() => {
42
+ if (props.isPage) {
43
+ return {
44
+ ...state.pagination,
45
+ onChange: (page: number, limit: number) => pageChange(page, limit),
46
+ };
47
+ }
48
+ return false;
49
+ });
50
+ const pageChange = (page: number, limit: number) => {
51
+ state.pagination.current = page;
52
+ state.pagination.pageSize = limit;
53
+ getData();
54
+ };
55
+ const getData = async () => {
56
+ let params = { ...props.apiParams };
57
+
58
+ if (props.isPage) {
59
+ params = { ...props.apiParams, ...state.pagination };
60
+ }
61
+ if (props.checkParams) {
62
+ params = props.checkParams(params);
63
+ }
64
+ try {
65
+ state.loading = true;
66
+ let res = await props.api(params);
67
+ state.loading = false;
68
+ if (res.code == 200) {
69
+ let resData = res.data;
70
+ console.log(resData);
71
+ if (props.checkReturnValue) {
72
+ resData = props.checkReturnValue(res.data);
73
+ }
74
+ if (props.isPage) {
75
+ state.dataSource = resData.data;
76
+ state.pagination.total = resData.total;
77
+ } else {
78
+ state.dataSource = resData;
79
+ }
80
+ }
81
+ } catch (error) {
82
+ state.loading = false;
83
+ console.log(error);
84
+ }
85
+ };
86
+ const refresh = () => {
87
+ pageChange(1, 15);
88
+ };
89
+ const clearData = () => {
90
+ state.dataSource = [];
91
+ state.pagination.current = 1;
92
+ state.pagination.pageSize = 15;
93
+ state.pagination.total = 0;
94
+ };
95
+ onMounted(() => {
96
+ if (props.autoRequest && props.api) {
97
+ getData();
98
+ }
99
+ });
100
+ defineExpose({
101
+ refresh,
102
+ clearData,
103
+ dataSource: computed(() => state.dataSource),
104
+ });
105
+ </script>
@@ -0,0 +1,48 @@
1
+ <template>
2
+ <a-table
3
+ :scroll="{
4
+ scrollToFirstRowOnChange: true,
5
+ y: tableHeight,
6
+ }"
7
+ :pagination="
8
+ props.pagination
9
+ ? {
10
+ ...pagination,
11
+ showTotal: (total: number) => `共 ${total} 条`,
12
+ pageSizeOptions: ['15', '30', '50', '100', '300', '500'],
13
+ }
14
+ : false
15
+ "
16
+ >
17
+ <template v-for="(_, slot) in Slots" v-slot:[slot]="scope">
18
+ <slot :name="slot" v-bind="scope" />
19
+ </template>
20
+ </a-table>
21
+ </template>
22
+ <script setup lang="ts">
23
+ import { computed, useSlots } from "vue";
24
+ const Slots = useSlots();
25
+ const props = defineProps({
26
+ //表格高度 只能为px vh calc()
27
+ height: {
28
+ type: String,
29
+ },
30
+ pagination: {
31
+ type: [Object, Boolean],
32
+ default: () => false,
33
+ },
34
+ });
35
+ // 如果传高度了,就用传的高度
36
+ // 如果没传高度,考虑带分页和不带分页两种情况
37
+ const tableHeight = computed(() => {
38
+ if (props.height) {
39
+ return props.height;
40
+ } else {
41
+ if (props.pagination) {
42
+ return "calc(100vh - 141px)";
43
+ } else {
44
+ return "calc(100vh - 77px)";
45
+ }
46
+ }
47
+ });
48
+ </script>
@@ -1,20 +1,17 @@
1
1
  <!--
2
2
  图片上传 单个 多个
3
3
  @author zhl
4
- @date 2026/01/28
4
+ @date 2026/03/11
5
5
  -->
6
6
  <template>
7
7
  <a-upload
8
8
  :disabled="props.disabled"
9
9
  list-type="picture-card"
10
10
  :file-list="showUploadList"
11
- :action="URL + '/admin.upload/upload'"
11
+ :action="requestUrl"
12
12
  :accept="props.fileType"
13
- :headers="headers"
14
- :data="{
15
- scene: props.scene,
16
- ...data,
17
- }"
13
+ :headers="props.headers"
14
+ :data="props.data"
18
15
  :before-upload="beforeUpload"
19
16
  :on-success="onSuccess"
20
17
  :on-error="onError"
@@ -42,10 +39,7 @@ import { message } from "ant-design-vue";
42
39
  import { PlusOutlined, LoadingOutlined } from "@ant-design/icons-vue";
43
40
  import { reactive, computed } from "vue";
44
41
  import { URL } from "@/utils/request";
45
- const headers = {
46
- Authorization: localStorage.getItem("TOKEN"),
47
- brand: "1",
48
- };
42
+
49
43
  const emits = defineEmits([
50
44
  "update:modelValue",
51
45
  "onSuccess",
@@ -54,11 +48,12 @@ const emits = defineEmits([
54
48
  ]);
55
49
  /**
56
50
  * 传递参数
57
- * @params scene 场景值 必穿 shop store
58
- * @params data 更多参数 对象格式
51
+ * @params modelValue 绑定值 单个 多个
52
+ * @params disabled 是否禁用
53
+ * @params requestUrl 请求地址
54
+ * @params headers 头部参数
55
+ * @params data 更多参数
59
56
  * @params fileType 选择图片类型 默认所有格式图片
60
- * @author zhl
61
- * @date 2023/12/06
62
57
  */
63
58
  const props = defineProps({
64
59
  modelValue: {},
@@ -69,10 +64,6 @@ const props = defineProps({
69
64
  type: Number,
70
65
  default: () => 1,
71
66
  },
72
- scene: {
73
- type: String,
74
- required: true,
75
- },
76
67
  data: {
77
68
  type: Object,
78
69
  },
@@ -80,6 +71,10 @@ const props = defineProps({
80
71
  type: String,
81
72
  default: () => "image/*",
82
73
  },
74
+ headers: { type: Object },
75
+ requestUrl: {
76
+ type: String,
77
+ },
83
78
  });
84
79
  const state = reactive({
85
80
  loading: false,
@@ -27,14 +27,15 @@
27
27
  <script setup lang="ts">
28
28
  import { VxeModal } from "vxe-pc-ui";
29
29
  import { reactive } from "vue";
30
+
30
31
  const emits = defineEmits(["confirm", "close"]);
31
32
  /**
32
- * title 弹窗显示标题
33
- * width 弹窗宽度 字符串 100px 100 100% 50vw calc(50vw - 50px)
34
- * height 弹窗宽度 字符串 100px 100 100% 50vh calc(50vh - 50px)
35
- * maskClosable 是否允许点击遮罩层关闭窗口
36
- * escClosable 是否允许按 Esc 键关闭窗口
37
- * showFooter 是否显示底部按钮 自定义footer会直接覆盖默认footer
33
+ * @params title 弹窗显示标题
34
+ * @params width 弹窗宽度 字符串 100px 100 100% 50vw calc(50vw - 50px)
35
+ * @params height 弹窗宽度 字符串 100px 100 100% 50vh calc(50vh - 50px)
36
+ * @params maskClosable 是否允许点击遮罩层关闭窗口
37
+ * @params escClosable 是否允许按 Esc 键关闭窗口
38
+ * @params showFooter 是否显示底部按钮 自定义footer会直接覆盖默认footer
38
39
  */
39
40
  const props = defineProps({
40
41
  title: { type: String },
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "zhl-methods",
3
- "version": "2.0.1",
3
+ "version": "2.0.2",
4
4
  "license": "ISC",
5
5
  "dependencies": {
6
6
  "dayjs": "^1.11.15"
@@ -1,3 +0,0 @@
1
- {
2
- "recommendations": ["Vue.volar"]
3
- }
package/antdv/README.md DELETED
@@ -1,5 +0,0 @@
1
- # Vue 3 + TypeScript + Vite
2
-
3
- This template should help get you started developing with Vue 3 and TypeScript in Vite. The template uses Vue 3 `<script setup>` SFCs, check out the [script setup docs](https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup) to learn more.
4
-
5
- Learn more about the recommended Project Setup and IDE Support in the [Vue Docs TypeScript Guide](https://vuejs.org/guide/typescript/overview.html#project-setup).
@@ -1,102 +0,0 @@
1
- <template>
2
- <vxe-column field="66" title="66" width="225">
3
- <div style="display: flex; align-items: center">
4
- <div :style="{ width: actionList.length > 4 ? '153px' : '100%' }">
5
- <div style="display: flex; margin-bottom: 10px">
6
- <vxe-button
7
- style="width: 74px"
8
- size="mini"
9
- mode="text"
10
- :status="actionList[0].status"
11
- v-if="actionList[0]"
12
- @click="
13
- actionList[0].callback ? actionList[0].callback() : () => {}
14
- "
15
- >
16
- {{ actionList[0].title }}
17
- </vxe-button>
18
- <vxe-button
19
- style="width: 74px"
20
- size="mini"
21
- mode="text"
22
- :status="actionList[1].status"
23
- v-if="actionList[1]"
24
- @click="
25
- actionList[1].callback ? actionList[1].callback() : () => {}
26
- "
27
- >
28
- {{ actionList[1].title }}
29
- </vxe-button>
30
- </div>
31
- <div style="display: flex">
32
- <vxe-button
33
- style="width: 74px"
34
- size="mini"
35
- mode="text"
36
- :status="actionList[2].status"
37
- v-if="actionList[2]"
38
- @click="
39
- actionList[2].callback ? actionList[2].callback() : () => {}
40
- "
41
- >
42
- {{ actionList[2].title }}
43
- </vxe-button>
44
- <vxe-button
45
- style="width: 74px"
46
- size="mini"
47
- mode="text"
48
- v-if="actionList[3]"
49
- :status="actionList[3].status"
50
- @click="
51
- actionList[3].callback ? actionList[3].callback() : () => {}
52
- "
53
- >
54
- {{ actionList[3].title }}
55
- </vxe-button>
56
- </div>
57
- </div>
58
- <vxe-button
59
- mode="text"
60
- v-if="menuList.length"
61
- :options="
62
- menuList.map((item) => ({
63
- ...item,
64
- content: item.title,
65
- }))
66
- "
67
- />
68
- </div>
69
- </vxe-column>
70
- </template>
71
- <script lang="ts" setup>
72
- import { reactive, computed } from "vue";
73
- // import { authMethod } from "@/directives/auth/authMethod.ts";
74
-
75
- const props = defineProps<{
76
- listData: {
77
- callback: Function;
78
- title: string;
79
- auth?: string;
80
- vIf?: Boolean;
81
- status?: "primary" | "success" | "warning" | "error";
82
- }[];
83
- }>();
84
- const actionList = computed(() => {
85
- return props.listData.filter((item) => {
86
- let type: Boolean | undefined = true;
87
- if (item.vIf != undefined) type = item.vIf;
88
- // if (item.auth) type = type && authMethod(item.auth);
89
- if (type) {
90
- return true;
91
- } else {
92
- return false;
93
- }
94
- });
95
- });
96
- const menuList = computed(() => {
97
- if (actionList.value.length > 4) {
98
- return actionList.value.slice(4, actionList.value.length);
99
- }
100
- return [];
101
- });
102
- </script>
@@ -1,36 +0,0 @@
1
- <template>
2
- <a-table :dataSource="dataSource" :columns="columns" />
3
- </template>
4
- <script setup>
5
- const dataSource = [
6
- {
7
- key: "1",
8
- name: "胡彦斌",
9
- age: 32,
10
- address: "西湖区湖底公园1号",
11
- },
12
- {
13
- key: "2",
14
- name: "胡彦祖",
15
- age: 42,
16
- address: "西湖区湖底公园1号",
17
- },
18
- ];
19
- const columns = [
20
- {
21
- title: "姓名",
22
- dataIndex: "name",
23
- key: "name",
24
- },
25
- {
26
- title: "年龄",
27
- dataIndex: "age",
28
- key: "age",
29
- },
30
- {
31
- title: "住址",
32
- dataIndex: "address",
33
- key: "address",
34
- },
35
- ];
36
- </script>
package/antdv/index.html DELETED
@@ -1,11 +0,0 @@
1
- <!doctype html>
2
- <html lang="en">
3
- <head>
4
- <meta charset="UTF-8" />
5
- <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6
- </head>
7
- <body>
8
- <div id="app"></div>
9
- <script type="module" src="/src/main.ts"></script>
10
- </body>
11
- </html>
@@ -1,31 +0,0 @@
1
- {
2
- "name": "jinglijing_wholesale_pc",
3
- "private": true,
4
- "version": "0.0.0",
5
- "type": "module",
6
- "scripts": {
7
- "dev": "vite",
8
- "build": "vue-tsc -b && vite build",
9
- "preview": "vite preview"
10
- },
11
- "dependencies": {
12
- "@vxe-ui/plugin-export-xlsx": "4.5.1",
13
- "ant-design-vue": "4.x",
14
- "consola": "^3.4.2",
15
- "exceljs": "4.4.0",
16
- "vite-plugin-lazy-import": "^1.0.7",
17
- "vite-plugin-style-import": "^2.0.0",
18
- "vue": "^3.5.24",
19
- "vxe-pc-ui": "4.12.16",
20
- "vxe-table": "4.17.46",
21
- "xe-utils": "3.9.1"
22
- },
23
- "devDependencies": {
24
- "@types/node": "^24.10.1",
25
- "@vitejs/plugin-vue": "^6.0.1",
26
- "@vue/tsconfig": "^0.8.1",
27
- "typescript": "~5.9.3",
28
- "vite": "^7.2.4",
29
- "vue-tsc": "^3.1.4"
30
- }
31
- }
package/antdv/src/App.vue DELETED
@@ -1,12 +0,0 @@
1
- <template>
2
- <button @click="clickOpen">弹窗</button>
3
- <ModalView ref="ModalViewRef">555</ModalView>
4
- </template>
5
- <script setup lang="ts">
6
- import { ref } from "vue";
7
- import ModalView from "../components/modalView/index.vue";
8
- const ModalViewRef = ref();
9
- const clickOpen = () => {
10
- ModalViewRef.value.open();
11
- };
12
- </script>
package/antdv/src/main.ts DELETED
@@ -1,12 +0,0 @@
1
- import { createApp } from "vue";
2
- import App from "./App.vue";
3
- import "../components/index.css";
4
- // import VxeUIBase, { VxeUI } from "vxe-pc-ui";
5
- import "vxe-pc-ui/es/style.css";
6
- // import VxeUITable from "vxe-table";
7
- import "vxe-table/es/style.css";
8
- // import VxeUIPluginExportXLSX from "@vxe-ui/plugin-export-xlsx";
9
- // import ExcelJS from "exceljs";
10
- // VxeUI.use(VxeUIPluginExportXLSX, { ExcelJS });
11
- createApp(App).mount("#app");
12
- // createApp(App).use(VxeUIBase).use(VxeUITable).mount("#app");
package/antdv/src/qwe.vue DELETED
@@ -1,7 +0,0 @@
1
- <template>
2
- <vxe-column field="name" title="Name">
3
- <template #default="{ row }">
4
- {{ row }}
5
- </template>
6
- </vxe-column>
7
- </template>
@@ -1,17 +0,0 @@
1
- {
2
- "extends": "@vue/tsconfig/tsconfig.dom.json",
3
- "compilerOptions": {
4
- "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
5
- "types": ["vite/client"],
6
- "baseUrl": "./",
7
- "paths": { "@/*": ["src/*"] },
8
- /* Linting */
9
- "strict": true,
10
- "noUnusedLocals": true,
11
- "noUnusedParameters": true,
12
- "erasableSyntaxOnly": true,
13
- "noFallthroughCasesInSwitch": true,
14
- "noUncheckedSideEffectImports": true
15
- },
16
- "include": ["src/**/*.ts", "src/**/*.js", "src/**/*.vue"]
17
- }
@@ -1,7 +0,0 @@
1
- {
2
- "files": [],
3
- "references": [
4
- { "path": "./tsconfig.app.json" },
5
- { "path": "./tsconfig.node.json" }
6
- ]
7
- }
@@ -1,26 +0,0 @@
1
- {
2
- "compilerOptions": {
3
- "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
4
- "target": "ES2023",
5
- "lib": ["ES2023"],
6
- "module": "ESNext",
7
- "types": ["node"],
8
- "skipLibCheck": true,
9
-
10
- /* Bundler mode */
11
- "moduleResolution": "bundler",
12
- "allowImportingTsExtensions": true,
13
- "verbatimModuleSyntax": true,
14
- "moduleDetection": "force",
15
- "noEmit": true,
16
-
17
- /* Linting */
18
- "strict": true,
19
- "noUnusedLocals": true,
20
- "noUnusedParameters": true,
21
- "erasableSyntaxOnly": true,
22
- "noFallthroughCasesInSwitch": true,
23
- "noUncheckedSideEffectImports": true
24
- },
25
- "include": ["vite.config.ts"]
26
- }
@@ -1,24 +0,0 @@
1
- import { defineConfig } from "vite";
2
- import path from "path";
3
- import vue from "@vitejs/plugin-vue";
4
- import { createStyleImportPlugin } from "vite-plugin-style-import";
5
- export default defineConfig({
6
- base: "./",
7
- plugins: [
8
- vue(),
9
- createStyleImportPlugin({
10
- libs: [
11
- {
12
- libraryName: "vxe-table",
13
- esModule: true,
14
- resolveStyle: (name) => {
15
- // 自动转换样式导入路径
16
- return `vxe-table/es/${name}/style.css`;
17
- },
18
- },
19
- ],
20
- }),
21
- ],
22
- server: { port: 5000 },
23
- resolve: { alias: { "@": path.resolve(__dirname, "./src") } },
24
- });
File without changes