@ditari/bsui 1.1.24 → 1.1.26
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.
- package/CHANGELOG.md +12 -0
- package/dist/cjs/form/DQueryForm.cjs +15 -0
- package/dist/cjs/form/DQueryForm.cjs.map +1 -1
- package/dist/esm/form/DQueryForm.mjs +15 -0
- package/dist/esm/form/DQueryForm.mjs.map +1 -1
- package/example/src/components/AppMain.vue +90 -0
- package/example/src/main.ts +1 -1
- package/example/src/router/form/index.route.ts +31 -0
- package/example/src/router/index.ts +55 -25
- package/example/src/router/table/index.route.ts +39 -0
- package/example/src/views/Demo.vue +47 -8
- package/example/src/views/DemoBk.vue +34 -0
- package/example/src/views/Login.vue +39 -0
- package/example/src/views/form/List.vue +9 -0
- package/example/src/views/form/List2.vue +74 -0
- package/example/src/views/form/dyn/List.vue +121 -0
- package/example/src/views/table/Add.vue +205 -0
- package/example/src/views/table/Demo.vue +15 -0
- package/example/src/views/table/Demo2.vue +12 -0
- package/example/src/views/table/Edit.vue +10 -0
- package/example/src/views/table/List.vue +346 -7
- package/example/src/views/table/Test.tsx +42 -0
- package/example/src/views/table/TestModal.vue +64 -0
- package/example/src/views/table/WorkStatusRound.vue +31 -0
- package/example/src/views/table/hooks.ts +3 -9
- package/example/src/views/task/Todo.vue +6 -0
- package/package.json +1 -1
- package/src/form/DQueryForm.tsx +33 -2
|
@@ -0,0 +1,74 @@
|
|
|
1
|
+
<script setup lang="ts">
|
|
2
|
+
import { ref } from "vue";
|
|
3
|
+
import { useRequestList } from "../../../src/hooks";
|
|
4
|
+
const formState = ref({
|
|
5
|
+
userInfo: [
|
|
6
|
+
{
|
|
7
|
+
name: ""
|
|
8
|
+
},
|
|
9
|
+
{
|
|
10
|
+
name: ""
|
|
11
|
+
}
|
|
12
|
+
]
|
|
13
|
+
});
|
|
14
|
+
|
|
15
|
+
const onFinish = () => {};
|
|
16
|
+
</script>
|
|
17
|
+
<template>
|
|
18
|
+
<div class="demo">
|
|
19
|
+
<a-form :model="formState" @finish="onFinish">
|
|
20
|
+
<div class="grid-demo1">
|
|
21
|
+
<a-form-item
|
|
22
|
+
class="item"
|
|
23
|
+
v-for="(user, index) in formState.userInfo"
|
|
24
|
+
:key="index"
|
|
25
|
+
label="标题"
|
|
26
|
+
:name="['userInfo', index, 'name']"
|
|
27
|
+
:rules="[{ required: true, message: 'Please input your password!' }]"
|
|
28
|
+
>
|
|
29
|
+
<a-input v-model:value="user.name" />
|
|
30
|
+
</a-form-item>
|
|
31
|
+
</div>
|
|
32
|
+
<a-form-item>
|
|
33
|
+
<a-button type="primary" html-type="submit">Submit</a-button>
|
|
34
|
+
</a-form-item>
|
|
35
|
+
</a-form>
|
|
36
|
+
{{ formState }}
|
|
37
|
+
</div>
|
|
38
|
+
</template>
|
|
39
|
+
<style lang="scss">
|
|
40
|
+
.demo {
|
|
41
|
+
margin: 20px;
|
|
42
|
+
padding: 20px;
|
|
43
|
+
background-color: #fff;
|
|
44
|
+
.item {
|
|
45
|
+
display: grid;
|
|
46
|
+
grid-template-columns: 120px auto;
|
|
47
|
+
margin-bottom: 0;
|
|
48
|
+
.ant-col {
|
|
49
|
+
border: 1px solid #d9d9d9;
|
|
50
|
+
margin-left: -1px;
|
|
51
|
+
margin-top: -1px;
|
|
52
|
+
.ant-input {
|
|
53
|
+
border: 0;
|
|
54
|
+
}
|
|
55
|
+
&:last-child {
|
|
56
|
+
border-left: 0;
|
|
57
|
+
}
|
|
58
|
+
}
|
|
59
|
+
}
|
|
60
|
+
//.grid-demo1 {
|
|
61
|
+
// display: grid;
|
|
62
|
+
// grid-template-columns: repeat(10);
|
|
63
|
+
// grid-template-rows: auto auto;
|
|
64
|
+
// .item {
|
|
65
|
+
// border: 1px solid #d9d9d9;
|
|
66
|
+
// margin-left: -1px;
|
|
67
|
+
// margin-top: -1px;
|
|
68
|
+
// .ant-input {
|
|
69
|
+
// border: 0;
|
|
70
|
+
// }
|
|
71
|
+
// }
|
|
72
|
+
//}
|
|
73
|
+
}
|
|
74
|
+
</style>
|
|
@@ -0,0 +1,121 @@
|
|
|
1
|
+
<script setup lang="ts">
|
|
2
|
+
import { ref } from "vue";
|
|
3
|
+
|
|
4
|
+
import DyCom from "../../../components/DyCom";
|
|
5
|
+
|
|
6
|
+
const formState = ref({
|
|
7
|
+
name: "4324",
|
|
8
|
+
age: "4324324",
|
|
9
|
+
age: ""
|
|
10
|
+
});
|
|
11
|
+
|
|
12
|
+
const layoutJson = {
|
|
13
|
+
type: "a-card",
|
|
14
|
+
props: {
|
|
15
|
+
title: "基本信息"
|
|
16
|
+
},
|
|
17
|
+
body: {
|
|
18
|
+
type: "a-form",
|
|
19
|
+
model: formState,
|
|
20
|
+
body: [
|
|
21
|
+
{
|
|
22
|
+
type: "a-form-item",
|
|
23
|
+
props: {
|
|
24
|
+
name: "name",
|
|
25
|
+
label: "姓名",
|
|
26
|
+
rules: [{ required: true, message: "Please input your username!" }]
|
|
27
|
+
},
|
|
28
|
+
body: {
|
|
29
|
+
type: "a-input",
|
|
30
|
+
model: formState,
|
|
31
|
+
props: {
|
|
32
|
+
name: "name",
|
|
33
|
+
placeholder: "请输入姓名"
|
|
34
|
+
}
|
|
35
|
+
}
|
|
36
|
+
},
|
|
37
|
+
{
|
|
38
|
+
type: "a-form-item",
|
|
39
|
+
props: {
|
|
40
|
+
name: "age",
|
|
41
|
+
label: "年龄",
|
|
42
|
+
rules: [{ required: true, message: "Please input your username!" }]
|
|
43
|
+
},
|
|
44
|
+
body: {
|
|
45
|
+
type: "a-input",
|
|
46
|
+
model: formState,
|
|
47
|
+
props: {
|
|
48
|
+
name: "age",
|
|
49
|
+
placeholder: "请输入年龄"
|
|
50
|
+
}
|
|
51
|
+
}
|
|
52
|
+
},
|
|
53
|
+
{
|
|
54
|
+
type: "a-form-item",
|
|
55
|
+
props: {
|
|
56
|
+
name: "sex",
|
|
57
|
+
label: "性别"
|
|
58
|
+
},
|
|
59
|
+
body: {
|
|
60
|
+
type: "a-radio",
|
|
61
|
+
model: formState,
|
|
62
|
+
props: {
|
|
63
|
+
name: "sex"
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
}
|
|
67
|
+
]
|
|
68
|
+
}
|
|
69
|
+
};
|
|
70
|
+
|
|
71
|
+
const span = ref(6);
|
|
72
|
+
|
|
73
|
+
setTimeout(() => {
|
|
74
|
+
span.value = 4;
|
|
75
|
+
console.log("aaa");
|
|
76
|
+
}, 3000);
|
|
77
|
+
const queryLayoutForm = ref({
|
|
78
|
+
type: "a-form",
|
|
79
|
+
props: {
|
|
80
|
+
labelCol: { style: { width: "80px" } }
|
|
81
|
+
},
|
|
82
|
+
body: {
|
|
83
|
+
type: "a-row",
|
|
84
|
+
body: [
|
|
85
|
+
{
|
|
86
|
+
type: "a-col",
|
|
87
|
+
props: {
|
|
88
|
+
span: span
|
|
89
|
+
},
|
|
90
|
+
body: {
|
|
91
|
+
type: "a-form-item",
|
|
92
|
+
props: {
|
|
93
|
+
name: "age",
|
|
94
|
+
label: "年龄"
|
|
95
|
+
},
|
|
96
|
+
body: {
|
|
97
|
+
type: "a-input",
|
|
98
|
+
props: {
|
|
99
|
+
name: "age",
|
|
100
|
+
placeholder: "请输入年龄"
|
|
101
|
+
}
|
|
102
|
+
}
|
|
103
|
+
}
|
|
104
|
+
}
|
|
105
|
+
]
|
|
106
|
+
}
|
|
107
|
+
});
|
|
108
|
+
</script>
|
|
109
|
+
<script lang="ts">
|
|
110
|
+
export default {
|
|
111
|
+
name: "List"
|
|
112
|
+
};
|
|
113
|
+
</script>
|
|
114
|
+
<template>
|
|
115
|
+
<div>
|
|
116
|
+
{{ formState }}
|
|
117
|
+
<!-- <dy-com :layout="layoutJson" />-->
|
|
118
|
+
<dy-com :layout="queryLayoutForm" />
|
|
119
|
+
</div>
|
|
120
|
+
</template>
|
|
121
|
+
<style scoped></style>
|
|
@@ -0,0 +1,205 @@
|
|
|
1
|
+
<script setup lang="ts">
|
|
2
|
+
import { onActivated, ref } from "vue";
|
|
3
|
+
import { useRoute } from "vue-router";
|
|
4
|
+
|
|
5
|
+
import { useDeclareData } from "../../store";
|
|
6
|
+
|
|
7
|
+
const columns = [
|
|
8
|
+
{
|
|
9
|
+
title: "商品编码"
|
|
10
|
+
},
|
|
11
|
+
{
|
|
12
|
+
title: "商品名称"
|
|
13
|
+
},
|
|
14
|
+
{
|
|
15
|
+
title: "第一计量单位"
|
|
16
|
+
},
|
|
17
|
+
{
|
|
18
|
+
title: "申报总价"
|
|
19
|
+
},
|
|
20
|
+
{
|
|
21
|
+
title: "毛重"
|
|
22
|
+
}
|
|
23
|
+
];
|
|
24
|
+
const route = useRoute();
|
|
25
|
+
const store = useDeclareData();
|
|
26
|
+
const loading = ref(false);
|
|
27
|
+
|
|
28
|
+
onActivated(() => {
|
|
29
|
+
if (route.path.includes("form")) {
|
|
30
|
+
store.data = store.exportDeclarationData;
|
|
31
|
+
} else {
|
|
32
|
+
store.data = store.importDeclarationData;
|
|
33
|
+
}
|
|
34
|
+
});
|
|
35
|
+
|
|
36
|
+
const formState = ref({
|
|
37
|
+
originCountry: ""
|
|
38
|
+
});
|
|
39
|
+
</script>
|
|
40
|
+
<script lang="ts">
|
|
41
|
+
export default {
|
|
42
|
+
name: "Add"
|
|
43
|
+
};
|
|
44
|
+
</script>
|
|
45
|
+
<template>
|
|
46
|
+
<d-show-layout :loading="loading">
|
|
47
|
+
|
|
48
|
+
<a-card>
|
|
49
|
+
<template #title>
|
|
50
|
+
<span class="title">申报人信息</span>
|
|
51
|
+
</template>
|
|
52
|
+
<a-form :colon="false" :label-col="{ style: { width: '120px' } }">
|
|
53
|
+
<d-grid class-name="ditari-bsui-grid-form" :fill="true" grid="repeat(2, 50%)">
|
|
54
|
+
<d-grid-item>
|
|
55
|
+
<a-form-item label="申报人姓名">
|
|
56
|
+
<a-input />
|
|
57
|
+
</a-form-item>
|
|
58
|
+
</d-grid-item>
|
|
59
|
+
<d-grid-item>
|
|
60
|
+
<a-form-item label="申报人证件号">
|
|
61
|
+
{{ formState.originCountry }}
|
|
62
|
+
<a-input v-model:value="formState.originCountry" v-trim />
|
|
63
|
+
</a-form-item>
|
|
64
|
+
</d-grid-item>
|
|
65
|
+
<d-grid-item>
|
|
66
|
+
<a-button type="primary" block>选择申报人</a-button>
|
|
67
|
+
</d-grid-item>
|
|
68
|
+
</d-grid>
|
|
69
|
+
</a-form>
|
|
70
|
+
</a-card>
|
|
71
|
+
<a-card>
|
|
72
|
+
<template #title>
|
|
73
|
+
<span class="title">基本信息</span>
|
|
74
|
+
</template>
|
|
75
|
+
<a-form :colon="false" :label-col="{ style: { width: '150px' } }">
|
|
76
|
+
<d-grid class-name="ditari-bsui-grid-form">
|
|
77
|
+
<d-grid-item>
|
|
78
|
+
<a-form-item label="进出口标志"> </a-form-item>
|
|
79
|
+
</d-grid-item>
|
|
80
|
+
<d-grid-item>
|
|
81
|
+
<a-form-item label="业务模式"> </a-form-item>
|
|
82
|
+
</d-grid-item>
|
|
83
|
+
<d-grid-item>
|
|
84
|
+
<a-form-item label="运输方式"> </a-form-item>
|
|
85
|
+
</d-grid-item>
|
|
86
|
+
<d-grid-item>
|
|
87
|
+
<a-form-item label="总金额(元)"> </a-form-item>
|
|
88
|
+
</d-grid-item>
|
|
89
|
+
<d-grid-item>
|
|
90
|
+
<a-form-item label="总毛重(KG)"> </a-form-item>
|
|
91
|
+
</d-grid-item>
|
|
92
|
+
<d-grid-item>
|
|
93
|
+
<a-form-item label="总净重(KG)"> </a-form-item>
|
|
94
|
+
</d-grid-item>
|
|
95
|
+
<d-grid-item>
|
|
96
|
+
<a-form-item label="币制"> </a-form-item>
|
|
97
|
+
</d-grid-item>
|
|
98
|
+
<d-grid-item>
|
|
99
|
+
<a-form-item label="件数"> </a-form-item>
|
|
100
|
+
</d-grid-item>
|
|
101
|
+
<d-grid-item>
|
|
102
|
+
<a-form-item label="贸易国别"> </a-form-item>
|
|
103
|
+
</d-grid-item>
|
|
104
|
+
<d-grid-item>
|
|
105
|
+
<a-form-item label="运输工具航次(班)号"> </a-form-item>
|
|
106
|
+
</d-grid-item>
|
|
107
|
+
<d-grid-item>
|
|
108
|
+
<a-form-item label="运输工具号"> </a-form-item>
|
|
109
|
+
</d-grid-item>
|
|
110
|
+
<d-grid-item>
|
|
111
|
+
<a-form-item label="提运单号"> </a-form-item>
|
|
112
|
+
</d-grid-item>
|
|
113
|
+
<d-grid-item>
|
|
114
|
+
<a-form-item label="是否涉及证书预备案"> </a-form-item>
|
|
115
|
+
</d-grid-item>
|
|
116
|
+
<d-grid-item>
|
|
117
|
+
<a-form-item label="证书类型"> </a-form-item>
|
|
118
|
+
</d-grid-item>
|
|
119
|
+
<d-grid-item>
|
|
120
|
+
<a-form-item label="证书预备案编号"> </a-form-item>
|
|
121
|
+
</d-grid-item>
|
|
122
|
+
</d-grid>
|
|
123
|
+
</a-form>
|
|
124
|
+
</a-card>
|
|
125
|
+
<!-- <a-card v-for="item in 3">-->
|
|
126
|
+
<!-- <template #title>-->
|
|
127
|
+
<!-- <span class="title">商品信息</span>-->
|
|
128
|
+
<!-- </template>-->
|
|
129
|
+
<!-- <d-table-->
|
|
130
|
+
<!-- row-key="id"-->
|
|
131
|
+
<!-- bordered-->
|
|
132
|
+
<!-- :height="150"-->
|
|
133
|
+
<!-- :columns="columns"-->
|
|
134
|
+
<!-- :data="[{}]"-->
|
|
135
|
+
<!-- ></d-table>-->
|
|
136
|
+
<!-- <a-form :colon="false" :label-col="{ style: { width: '150px' } }">-->
|
|
137
|
+
<!-- <d-grid class-name="ditari-bsui-grid-form">-->
|
|
138
|
+
<!-- <d-grid-item>-->
|
|
139
|
+
<!-- <a-form-item label="商品编码"> </a-form-item>-->
|
|
140
|
+
<!-- </d-grid-item>-->
|
|
141
|
+
<!-- <d-grid-item>-->
|
|
142
|
+
<!-- <a-form-item label="商品名称"> </a-form-item>-->
|
|
143
|
+
<!-- </d-grid-item>-->
|
|
144
|
+
<!-- <d-grid-item>-->
|
|
145
|
+
<!-- <a-form-item label="规格型号"> </a-form-item>-->
|
|
146
|
+
<!-- </d-grid-item>-->
|
|
147
|
+
<!-- <d-grid-item>-->
|
|
148
|
+
<!-- <a-form-item label="申报计量单位"> </a-form-item>-->
|
|
149
|
+
<!-- </d-grid-item>-->
|
|
150
|
+
<!-- <d-grid-item>-->
|
|
151
|
+
<!-- <a-form-item label="第一计量单位"> </a-form-item>-->
|
|
152
|
+
<!-- </d-grid-item>-->
|
|
153
|
+
<!-- <d-grid-item>-->
|
|
154
|
+
<!-- <a-form-item label="第二计量单位"> </a-form-item>-->
|
|
155
|
+
<!-- </d-grid-item>-->
|
|
156
|
+
<!-- <d-grid-item>-->
|
|
157
|
+
<!-- <a-form-item label="申报数量(千克)"> </a-form-item>-->
|
|
158
|
+
<!-- </d-grid-item>-->
|
|
159
|
+
<!-- <d-grid-item>-->
|
|
160
|
+
<!-- <a-form-item label="第一数量"> </a-form-item>-->
|
|
161
|
+
<!-- </d-grid-item>-->
|
|
162
|
+
<!-- <d-grid-item>-->
|
|
163
|
+
<!-- <a-form-item label="第二数量"> </a-form-item>-->
|
|
164
|
+
<!-- </d-grid-item>-->
|
|
165
|
+
<!-- <d-grid-item>-->
|
|
166
|
+
<!-- <a-form-item label="毛重(KG)"> </a-form-item>-->
|
|
167
|
+
<!-- </d-grid-item>-->
|
|
168
|
+
<!-- <d-grid-item>-->
|
|
169
|
+
<!-- <a-form-item label="净重(KG)"> </a-form-item>-->
|
|
170
|
+
<!-- </d-grid-item>-->
|
|
171
|
+
<!-- <d-grid-item>-->
|
|
172
|
+
<!-- <a-form-item label="产销国"> </a-form-item>-->
|
|
173
|
+
<!-- </d-grid-item>-->
|
|
174
|
+
<!-- <d-grid-item>-->
|
|
175
|
+
<!-- <a-form-item label="申报单价(元)"> </a-form-item>-->
|
|
176
|
+
<!-- </d-grid-item>-->
|
|
177
|
+
<!-- <d-grid-item>-->
|
|
178
|
+
<!-- <a-form-item label="申报总价(元)"> </a-form-item>-->
|
|
179
|
+
<!-- </d-grid-item>-->
|
|
180
|
+
<!-- <d-grid-item>-->
|
|
181
|
+
<!-- <a-form-item label="存储条件"> </a-form-item>-->
|
|
182
|
+
<!-- </d-grid-item>-->
|
|
183
|
+
<!-- <d-grid-item>-->
|
|
184
|
+
<!-- <a-form-item label="用途"> </a-form-item>-->
|
|
185
|
+
<!-- </d-grid-item>-->
|
|
186
|
+
<!-- </d-grid>-->
|
|
187
|
+
<!-- </a-form>-->
|
|
188
|
+
<!-- </a-card>-->
|
|
189
|
+
<template #footer>
|
|
190
|
+
<a-space>
|
|
191
|
+
<a-button type="primary" @click="loading = true">暂存</a-button>
|
|
192
|
+
{{ loading }}
|
|
193
|
+
<a-button type="primary">申报</a-button>
|
|
194
|
+
</a-space>
|
|
195
|
+
</template>
|
|
196
|
+
</d-show-layout>
|
|
197
|
+
</template>
|
|
198
|
+
<style scoped>
|
|
199
|
+
.title {
|
|
200
|
+
font-size: 18px;
|
|
201
|
+
font-weight: bold;
|
|
202
|
+
color: #2589ff;
|
|
203
|
+
}
|
|
204
|
+
|
|
205
|
+
</style>
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
<script setup lang="ts"></script>
|
|
2
|
+
<script lang="ts">
|
|
3
|
+
export default {
|
|
4
|
+
name: "Demo"
|
|
5
|
+
};
|
|
6
|
+
</script>
|
|
7
|
+
<template>
|
|
8
|
+
<d-show-layout>
|
|
9
|
+
<div style="height: 10000px"></div>
|
|
10
|
+
<template #footer>
|
|
11
|
+
<a-button>ok</a-button>
|
|
12
|
+
</template>
|
|
13
|
+
</d-show-layout>
|
|
14
|
+
</template>
|
|
15
|
+
<style scoped></style>
|