Skip to content

Commit 6c17980

Browse files
YunaiVYunaiV
committed
2 parents 8454d1d + 760bab7 commit 6c17980

File tree

33 files changed

+688
-157
lines changed

33 files changed

+688
-157
lines changed

‎src/api/erp/product/category/index.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,8 +13,8 @@ export interface ProductCategoryVO {
1313
// ERP 产品分类 API
1414
export const ProductCategoryApi = {
1515
// 查询产品分类列表
16-
getProductCategoryList: async (params) => {
17-
return await request.get({ url: `/erp/product-category/list`, params })
16+
getProductCategoryList: async () => {
17+
return await request.get({ url: `/erp/product-category/list` })
1818
},
1919

2020
// 查询产品分类精简列表

‎src/api/infra/demo/demo02/index.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,8 @@ export interface Demo02CategoryVO {
77
}
88

99
// 查询示例分类列表
10-
export const getDemo02CategoryList = async (params) => {
11-
return await request.get({ url: `/infra/demo02-category/list`, params })
10+
export const getDemo02CategoryList = async () => {
11+
return await request.get({ url: `/infra/demo02-category/list` })
1212
}
1313

1414
// 查询示例分类详情

‎src/api/mall/trade/order/index.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -141,7 +141,7 @@ export const getExpressTrackList = async (id: number | null) => {
141141
}
142142

143143
export interface DeliveryVO {
144-
id: number // 订单编号
144+
id?: number // 订单编号
145145
logisticsId: number | null // 物流公司编号
146146
logisticsNo: string // 物流编号
147147
}

‎src/components/DictSelect/index.ts

Lines changed: 0 additions & 3 deletions
This file was deleted.

‎src/components/DictSelect/src/DictSelect.vue

Lines changed: 0 additions & 46 deletions
This file was deleted.

‎src/components/FormCreate/index.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
11
import { useFormCreateDesigner } from './src/useFormCreateDesigner'
2+
import { useApiSelect } from './src/components/useApiSelect'
23

3-
export { useFormCreateDesigner }
4+
export { useFormCreateDesigner, useApiSelect }

‎src/components/FormCreate/src/components/DictSelect.vue

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
<!-- 数据字典 Select 选择器 -->
2+
<template>
3+
<el-select v-if="selectType === 'select'" class="w-1/1" v-bind="attrs">
4+
<el-option
5+
v-for="(dict, index) in getDictOptions"
6+
:key="index"
7+
:label="dict.label"
8+
:value="dict.value"
9+
/>
10+
</el-select>
11+
<el-radio-group v-if="selectType === 'radio'" class="w-1/1" v-bind="attrs">
12+
<el-radio v-for="(dict, index) in getDictOptions" :key="index" :value="dict.value">
13+
{{ dict.label }}
14+
</el-radio>
15+
</el-radio-group>
16+
<el-checkbox-group v-if="selectType === 'checkbox'" class="w-1/1" v-bind="attrs">
17+
<el-checkbox
18+
v-for="(dict, index) in getDictOptions"
19+
:key="index"
20+
:label="dict.label"
21+
:value="dict.value"
22+
/>
23+
</el-checkbox-group>
24+
</template>
25+
26+
<script lang="ts" setup>
27+
import { getBoolDictOptions, getIntDictOptions, getStrDictOptions } from '@/utils/dict'
28+
29+
defineOptions({ name: 'DictSelect' })
30+
31+
const attrs = useAttrs()
32+
33+
// 接受父组件参数
34+
interface Props {
35+
dictType: string // 字典类型
36+
valueType?: 'str' | 'int' | 'bool' // 字典值类型
37+
selectType?: 'select' | 'radio' | 'checkbox' // 选择器类型，下拉框 select、多选框 checkbox、单选框 radio
38+
formCreateInject?: any
39+
}
40+
41+
const props = withDefaults(defineProps<Props>(), {
42+
valueType: 'str',
43+
selectType: 'select'
44+
})
45+
46+
// 获得字典配置
47+
const getDictOptions = computed(() => {
48+
switch (props.valueType) {
49+
case 'str':
50+
return getStrDictOptions(props.dictType)
51+
case 'int':
52+
return getIntDictOptions(props.dictType)
53+
case 'bool':
54+
return getBoolDictOptions(props.dictType)
55+
default:
56+
return []
57+
}
58+
})
59+
</script>

‎src/components/FormCreate/src/components/useApiSelect.tsx

Lines changed: 143 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,143 @@
1+
import request from '@/config/axios'
2+
import { isEmpty } from '@/utils/is'
3+
import { ApiSelectProps } from '@/components/FormCreate/src/type'
4+
import { jsonParse } from '@/utils'
5+
6+
export const useApiSelect = (option: ApiSelectProps) => {
7+
return defineComponent({
8+
name: option.name,
9+
props: {
10+
// 选项标签
11+
labelField: {
12+
type: String,
13+
default: () => option.labelField ?? 'label'
14+
},
15+
// 选项的值
16+
valueField: {
17+
type: String,
18+
default: () => option.valueField ?? 'value'
19+
},
20+
// api 接口
21+
url: {
22+
type: String,
23+
default: () => option.url ?? ''
24+
},
25+
// 请求类型
26+
method: {
27+
type: String,
28+
default: 'GET'
29+
},
30+
// 请求参数
31+
data: {
32+
type: String,
33+
default: ''
34+
},
35+
// 选择器类型，下拉框 select、多选框 checkbox、单选框 radio
36+
selectType: {
37+
type: String,
38+
default: 'select'
39+
},
40+
// 是否多选
41+
multiple: {
42+
type: Boolean,
43+
default: false
44+
}
45+
},
46+
setup(props) {
47+
const attrs = useAttrs()
48+
const options = ref<any[]>([]) // 下拉数据
49+
const getOptions = async () => {
50+
options.value = []
51+
// 接口选择器
52+
if (isEmpty(props.url)) {
53+
return
54+
}
55+
let data = []
56+
switch (props.method) {
57+
case 'GET':
58+
data = await request.get({ url: props.url })
59+
break
60+
case 'POST':
61+
data = await request.post({ url: props.url, data: jsonParse(props.data) })
62+
break
63+
}
64+
65+
if (Array.isArray(data)) {
66+
options.value = data.map((item: any) => ({
67+
label: item[props.labelField],
68+
value: item[props.valueField]
69+
}))
70+
return
71+
}
72+
console.error(`接口[${props.url}] 返回结果不是一个数组`)
73+
}
74+
75+
onMounted(async () => {
76+
await getOptions()
77+
})
78+
79+
const buildSelect = () => {
80+
if (props.multiple) {
81+
// fix：多写此步是为了解决 multiple 属性问题
82+
return (
83+
<el-select class="w-1/1" {...attrs} multiple>
84+
{options.value.map((item, index) => (
85+
<el-option key={index} label={item.label} value={item.value} />
86+
))}
87+
</el-select>
88+
)
89+
}
90+
return (
91+
<el-select class="w-1/1" {...attrs}>
92+
{options.value.map((item, index) => (
93+
<el-option key={index} label={item.label} value={item.value} />
94+
))}
95+
</el-select>
96+
)
97+
}
98+
const buildCheckbox = () => {
99+
if (isEmpty(options.value)) {
100+
options.value = [
101+
{ label: '选项1', value: '选项1' },
102+
{ label: '选项2', value: '选项2' }
103+
]
104+
}
105+
return (
106+
<el-checkbox-group class="w-1/1" {...attrs}>
107+
{options.value.map((item, index) => (
108+
<el-checkbox key={index} label={item.label} value={item.value} />
109+
))}
110+
</el-checkbox-group>
111+
)
112+
}
113+
const buildRadio = () => {
114+
if (isEmpty(options.value)) {
115+
options.value = [
116+
{ label: '选项1', value: '选项1' },
117+
{ label: '选项2', value: '选项2' }
118+
]
119+
}
120+
return (
121+
<el-radio-group class="w-1/1" {...attrs}>
122+
{options.value.map((item, index) => (
123+
<el-radio key={index} value={item.value}>
124+
{item.label}
125+
</el-radio>
126+
))}
127+
</el-radio-group>
128+
)
129+
}
130+
return () => (
131+
<>
132+
{props.selectType === 'select'
133+
? buildSelect()
134+
: props.selectType === 'radio'
135+
? buildRadio()
136+
: props.selectType === 'checkbox'
137+
? buildCheckbox()
138+
: buildSelect()}
139+
</>
140+
)
141+
}
142+
})
143+
}

‎src/components/FormCreate/src/config/index.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,14 +2,14 @@ import { useUploadFileRule } from './useUploadFileRule'
22
import { useUploadImgRule } from './useUploadImgRule'
33
import { useUploadImgsRule } from './useUploadImgsRule'
44
import { useDictSelectRule } from './useDictSelectRule'
5-
import { useUserSelectRule } from './useUserSelectRule'
65
import { useEditorRule } from './useEditorRule'
6+
import { useSelectRule } from './useSelectRule'
77

88
export {
99
useUploadFileRule,
1010
useUploadImgRule,
1111
useUploadImgsRule,
1212
useDictSelectRule,
13-
useUserSelectRule,
14-
useEditorRule
13+
useEditorRule,
14+
useSelectRule
1515
}

‎src/components/FormCreate/src/config/selectRule.ts

Lines changed: 77 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,24 @@
11
const selectRule = [
2+
{
3+
type: 'select',
4+
field: 'selectType',
5+
title: '选择器类型',
6+
value: 'select',
7+
options: [
8+
{ label: '下拉框', value: 'select' },
9+
{ label: '单选框', value: 'radio' },
10+
{ label: '多选框', value: 'checkbox' }
11+
],
12+
// 参考 https://www.form-create.com/v3/guide/control 组件联动，单选框和多选框不需要多选属性
13+
control: [
14+
{
15+
value: 'select',
16+
condition: '=',
17+
method: 'hidden',
18+
rule: ['multiple']
19+
}
20+
]
21+
},
222
{ type: 'switch', field: 'multiple', title: '是否多选' },
323
{
424
type: 'switch',
@@ -68,4 +88,60 @@ const selectRule = [
6888
}
6989
]
7090

71-
export default selectRule
91+
const apiSelectRule = [
92+
{
93+
type: 'input',
94+
field: 'url',
95+
title: 'url 地址',
96+
props: {
97+
placeholder: '/system/user/simple-list'
98+
}
99+
},
100+
{
101+
type: 'select',
102+
field: 'method',
103+
title: '请求类型',
104+
value: 'GET',
105+
options: [
106+
{ label: 'GET', value: 'GET' },
107+
{ label: 'POST', value: 'POST' }
108+
],
109+
control: [
110+
{
111+
value: 'GET',
112+
condition: '!=',
113+
method: 'hidden',
114+
rule: [
115+
{
116+
type: 'input',
117+
field: 'data',
118+
title: '请求参数 JSON 格式',
119+
props: {
120+
autosize: true,
121+
type: 'textarea',
122+
placeholder: '{"type": 1}'
123+
}
124+
}
125+
]
126+
}
127+
]
128+
},
129+
{
130+
type: 'input',
131+
field: 'labelField',
132+
title: 'label 属性',
133+
props: {
134+
placeholder: 'nickname'
135+
}
136+
},
137+
{
138+
type: 'input',
139+
field: 'valueField',
140+
title: 'value 属性',
141+
props: {
142+
placeholder: 'id'
143+
}
144+
}
145+
]
146+
147+
export { selectRule, apiSelectRule }

0 commit comments

Comments
 (0)