@ditari/bsui 1.1.25 → 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 +6 -0
- package/dist/cjs/form/DQueryForm.cjs +6 -1
- package/dist/cjs/form/DQueryForm.cjs.map +1 -1
- package/dist/esm/form/DQueryForm.mjs +6 -1
- package/dist/esm/form/DQueryForm.mjs.map +1 -1
- package/example/src/components/AppMain.vue +5 -2
- 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 +19 -2
package/CHANGELOG.md
CHANGED
|
@@ -6,6 +6,8 @@ var vue = require('vue');
|
|
|
6
6
|
var core = require('@vueuse/core');
|
|
7
7
|
var antDesignVue = require('ant-design-vue');
|
|
8
8
|
var iconsVue = require('@ant-design/icons-vue');
|
|
9
|
+
var store = require('@ditari/store');
|
|
10
|
+
var vueRouter = require('vue-router');
|
|
9
11
|
var JsonSchemeRender = require('../json-scheme-render/JsonSchemeRender.cjs');
|
|
10
12
|
|
|
11
13
|
var QueryForm = /* @__PURE__ */ vue.defineComponent({
|
|
@@ -33,6 +35,8 @@ var QueryForm = /* @__PURE__ */ vue.defineComponent({
|
|
|
33
35
|
slots,
|
|
34
36
|
emit
|
|
35
37
|
}) {
|
|
38
|
+
const keepStore = store.useKeepAliveStore();
|
|
39
|
+
const route = vueRouter.useRoute();
|
|
36
40
|
const {
|
|
37
41
|
loading,
|
|
38
42
|
modelValue,
|
|
@@ -64,7 +68,8 @@ var QueryForm = /* @__PURE__ */ vue.defineComponent({
|
|
|
64
68
|
});
|
|
65
69
|
vue.watch(enterKey, (v) => {
|
|
66
70
|
if (v) {
|
|
67
|
-
|
|
71
|
+
const isActive = keepStore.list.some((name) => name === route.name);
|
|
72
|
+
if (!loading2.value && isActive) {
|
|
68
73
|
emit("query", modelValue2.value);
|
|
69
74
|
}
|
|
70
75
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DQueryForm.cjs","sources":["../../../src/form/DQueryForm.tsx"],"sourcesContent":["import { defineComponent, onMounted, ref, watch, watchEffect } from \"vue\";\nimport { useMagicKeys } from \"@vueuse/core\";\n\nimport { Form, FormItem, Row, Col, Button, Space } from \"ant-design-vue\";\nimport {\n SearchOutlined,\n ReloadOutlined,\n DoubleRightOutlined\n} from \"@ant-design/icons-vue\";\n\nimport DJsonSchemeRender from \"../json-scheme-render/JsonSchemeRender\";\n\n/**\n * 查询表单渲染\n * 展开,隐藏功能\n */\nexport default defineComponent({\n name: \"DQueryForm\",\n props: {\n scheme: {\n type: [Array, Object] as unknown as () => any[] | Record<string, any>,\n default: () => []\n },\n model: {\n type: Object as () => Record<string, unknown>,\n default: () => ({})\n },\n labelWidth: {\n type: String,\n default: \"90px\"\n },\n loading: {\n type: Boolean,\n default: false\n }\n },\n emits: [\"reset\", \"query\"],\n setup(props, { slots, emit }) {\n // 表单\n const { loading, modelValue, formRef, onQuery, onReset } = useForm();\n // 展开\n const { rowRef, actionSpan, onExpend, expendBtnVisible, isExpend } =\n useExpand();\n //渲染操作列\n const { renderAction } = useRender();\n\n function useForm() {\n const loading = ref(false);\n const formRef = ref<any>(null);\n const modelValue = ref<any>({});\n\n const keys = useMagicKeys();\n const enterKey = keys[\"enter\"];\n\n watchEffect(() => {\n modelValue.value = props.model;\n });\n\n watch(\n () => props.loading,\n (val) => {\n loading.value = val;\n }\n );\n\n /// 监听回车事件\n watch(enterKey, (v) => {\n if (v) {\n if (!loading.value) {\n emit(\"query\", modelValue.value);\n }\n }\n });\n\n const onQuery = () => {\n emit(\"query\", modelValue.value);\n };\n\n const onReset = () => {\n formRef.value?.resetFields();\n emit(\"reset\");\n };\n return {\n loading,\n modelValue,\n formRef,\n onQuery,\n onReset\n };\n }\n\n function useRender() {\n /**\n * 操作按钮渲染\n */\n function renderAction() {\n return (\n <Space>\n <Button\n loading={loading.value}\n type={\"primary\"}\n shape={\"round\"}\n onClick={onQuery}\n >\n {{\n default: () => \"查询\",\n icon: () => <SearchOutlined />\n }}\n </Button>\n <Button disabled={loading.value} shape={\"round\"} onClick={onReset}>\n {{\n default: () => \"重置\",\n icon: () => <ReloadOutlined />\n }}\n </Button>\n {expendBtnVisible.value ? (\n <Button onClick={onExpend} shape={\"round\"}>\n {{\n default: () => (isExpend.value ? \"收起\" : \"展开\"),\n icon: () => (\n <DoubleRightOutlined rotate={isExpend.value ? -90 : 90} />\n )\n }}\n </Button>\n ) : null}\n </Space>\n );\n }\n return {\n renderAction\n };\n }\n\n function useExpand() {\n // 为24网格布局\n const gridCount = 24;\n // 每列占6个格子\n const colSpan = 6;\n // 每行显示4列\n const colsPerRow = 4;\n // 操作按钮span\n const actionSpan = ref(6);\n // 控制展开或隐藏按钮文本\n const isExpend = ref(false);\n // 控制展开按按钮是否显示\n const expendBtnVisible = ref(false);\n // 行对象\n const rowRef = ref<any>(null);\n\n onMounted(() => {\n handleShowOrHidden();\n });\n\n function onExpend() {\n isExpend.value = !isExpend.value;\n handleShowOrHidden();\n }\n\n /**\n * 处理隐藏或显示\n */\n function handleShowOrHidden() {\n const colEl = Array.from(rowRef.value?.$el?.children);\n // col总条数 减掉操作栏按钮的div个数为1\n const colElLen = colEl.length - 1;\n // 已占用的网格数 = col总条数 * 每列占用的网格数\n const occupiedCols = colElLen * colSpan;\n // 总行数 = 总div数 / 每行显示的列数\n const fullRows = Math.ceil(colElLen / colsPerRow);\n // 最后一行的网格数 = 已占用的网格数 % 24\n const lastRowCols = occupiedCols % gridCount;\n // 最后一行剩余的网格数\n const remainingCols = gridCount - lastRowCols;\n\n // 网格行大于2才显示展开或隐藏按钮\n if (fullRows > 2) {\n expendBtnVisible.value = true;\n } else {\n // 如果没有大于两行,操作栏占用剩余的宽度\n actionSpan.value = remainingCols;\n }\n // 最后一行的起始索引\n const lastRowStartIndex = colsPerRow * (fullRows - 1) - 1;\n // 只有展开按钮显示时才处理\n if (expendBtnVisible.value) {\n colEl.forEach((col: any, index) => {\n if (index >= lastRowStartIndex) {\n // 最后一个元素不隐藏 是操作按钮的div\n index !== colElLen\n ? (col.style.display = !isExpend.value ? \"none\" : \"block\")\n : null; // 隐藏元素\n }\n });\n }\n\n if (expendBtnVisible.value) {\n // 如果是展开状态 则操作按钮占用剩余的网格数 否则占用6个网格\n isExpend.value\n ? (actionSpan.value = remainingCols)\n : (actionSpan.value = colSpan);\n }\n }\n\n return {\n rowRef,\n actionSpan,\n onExpend,\n expendBtnVisible,\n isExpend\n };\n }\n\n return () => (\n <>\n <Form\n ref={formRef}\n colon={false}\n labelCol={{ style: { width: props.labelWidth } }}\n model={modelValue.value}\n >\n <Row ref={rowRef}>\n {slots.default ? (\n slots.default()\n ) : (\n <DJsonSchemeRender\n layout={props.scheme}\n value={modelValue.value}\n />\n )}\n <Col span={actionSpan.value} style={{ textAlign: \"right\" }}>\n <FormItem>\n {slots.action ? slots.action() : renderAction()}\n </FormItem>\n </Col>\n </Row>\n </Form>\n </>\n );\n }\n});\n"],"names":["defineComponent","name","props","scheme","type","Array","Object","default","model","labelWidth","String","loading","Boolean","emits","setup","slots","emit","modelValue","formRef","onQuery","onReset","useForm","rowRef","actionSpan","onExpend","expendBtnVisible","isExpend","useExpand","renderAction","useRender","ref","keys","useMagicKeys","enterKey","watchEffect","value","watch","val","v","resetFields","_createVNode","Space","Button","icon","SearchOutlined","ReloadOutlined","DoubleRightOutlined","gridCount","colSpan","colsPerRow","onMounted","handleShowOrHidden","colEl","from","$el","children","colElLen","length","occupiedCols","fullRows","Math","ceil","lastRowCols","remainingCols","lastRowStartIndex","forEach","col","index","style","display","_Fragment","Form","width","Row","DJsonSchemeRender","Col","textAlign","FormItem","action"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"DQueryForm.cjs","sources":["../../../src/form/DQueryForm.tsx"],"sourcesContent":["import { defineComponent, onMounted, ref, watch, watchEffect } from \"vue\";\nimport { useMagicKeys } from \"@vueuse/core\";\n\nimport { Form, FormItem, Row, Col, Button, Space } from \"ant-design-vue\";\nimport {\n SearchOutlined,\n ReloadOutlined,\n DoubleRightOutlined\n} from \"@ant-design/icons-vue\";\nimport { useKeepAliveStore } from \"@ditari/store\";\nimport { useRoute } from \"vue-router\";\nimport DJsonSchemeRender from \"../json-scheme-render/JsonSchemeRender\";\n\n/**\n * 查询表单渲染\n * 展开,隐藏功能\n */\nexport default defineComponent({\n name: \"DQueryForm\",\n props: {\n scheme: {\n type: [Array, Object] as unknown as () => any[] | Record<string, any>,\n default: () => []\n },\n model: {\n type: Object as () => Record<string, unknown>,\n default: () => ({})\n },\n labelWidth: {\n type: String,\n default: \"90px\"\n },\n loading: {\n type: Boolean,\n default: false\n }\n },\n emits: [\"reset\", \"query\"],\n setup(props, { slots, emit }) {\n const keepStore = useKeepAliveStore();\n const route = useRoute();\n\n // 表单\n const { loading, modelValue, formRef, onQuery, onReset } = useForm();\n // 展开\n const { rowRef, actionSpan, onExpend, expendBtnVisible, isExpend } =\n useExpand();\n //渲染操作列\n const { renderAction } = useRender();\n\n function useForm() {\n const loading = ref(false);\n const formRef = ref<any>(null);\n const modelValue = ref<any>({});\n\n const keys = useMagicKeys();\n const enterKey = keys[\"enter\"];\n\n watchEffect(() => {\n modelValue.value = props.model;\n });\n\n watch(\n () => props.loading,\n (val) => {\n loading.value = val;\n }\n );\n\n /// 监听回车事件\n watch(enterKey, (v) => {\n if (v) {\n // 有路由名字会被keepalive进行缓存\n // 用于判断当前页面是否被激活 因为页面被缓存的时候,页面切换后,回车事件依然会触发\n const isActive = keepStore.list.some((name) => name === route.name);\n if (!loading.value && isActive) {\n emit(\"query\", modelValue.value);\n }\n // TODO 逻辑有问题\n // if (!route.name) {\n // // 没有路由名字,不会被缓存\n // if (!loading.value) {\n // emit(\"query\", modelValue.value);\n // }\n // } else {\n //\n // }\n }\n });\n\n const onQuery = () => {\n emit(\"query\", modelValue.value);\n };\n\n const onReset = () => {\n formRef.value?.resetFields();\n emit(\"reset\");\n };\n return {\n loading,\n modelValue,\n formRef,\n onQuery,\n onReset\n };\n }\n\n function useRender() {\n /**\n * 操作按钮渲染\n */\n function renderAction() {\n return (\n <Space>\n <Button\n loading={loading.value}\n type={\"primary\"}\n shape={\"round\"}\n onClick={onQuery}\n >\n {{\n default: () => \"查询\",\n icon: () => <SearchOutlined />\n }}\n </Button>\n <Button disabled={loading.value} shape={\"round\"} onClick={onReset}>\n {{\n default: () => \"重置\",\n icon: () => <ReloadOutlined />\n }}\n </Button>\n {expendBtnVisible.value ? (\n <Button onClick={onExpend} shape={\"round\"}>\n {{\n default: () => (isExpend.value ? \"收起\" : \"展开\"),\n icon: () => (\n <DoubleRightOutlined rotate={isExpend.value ? -90 : 90} />\n )\n }}\n </Button>\n ) : null}\n </Space>\n );\n }\n\n return {\n renderAction\n };\n }\n\n function useExpand() {\n // 为24网格布局\n const gridCount = 24;\n // 每列占6个格子\n const colSpan = 6;\n // 每行显示4列\n const colsPerRow = 4;\n // 操作按钮span\n const actionSpan = ref(6);\n // 控制展开或隐藏按钮文本\n const isExpend = ref(false);\n // 控制展开按按钮是否显示\n const expendBtnVisible = ref(false);\n // 行对象\n const rowRef = ref<any>(null);\n\n onMounted(() => {\n handleShowOrHidden();\n });\n\n function onExpend() {\n isExpend.value = !isExpend.value;\n handleShowOrHidden();\n }\n\n /**\n * 处理隐藏或显示\n */\n function handleShowOrHidden() {\n const colEl = Array.from(rowRef.value?.$el?.children);\n // col总条数 减掉操作栏按钮的div个数为1\n const colElLen = colEl.length - 1;\n // 已占用的网格数 = col总条数 * 每列占用的网格数\n const occupiedCols = colElLen * colSpan;\n // 总行数 = 总div数 / 每行显示的列数\n const fullRows = Math.ceil(colElLen / colsPerRow);\n // 最后一行的网格数 = 已占用的网格数 % 24\n const lastRowCols = occupiedCols % gridCount;\n // 最后一行剩余的网格数\n const remainingCols = gridCount - lastRowCols;\n\n // 网格行大于2才显示展开或隐藏按钮\n if (fullRows > 2) {\n expendBtnVisible.value = true;\n } else {\n // 如果没有大于两行,操作栏占用剩余的宽度\n actionSpan.value = remainingCols;\n }\n // 最后一行的起始索引\n const lastRowStartIndex = colsPerRow * (fullRows - 1) - 1;\n // 只有展开按钮显示时才处理\n if (expendBtnVisible.value) {\n colEl.forEach((col: any, index) => {\n if (index >= lastRowStartIndex) {\n // 最后一个元素不隐藏 是操作按钮的div\n index !== colElLen\n ? (col.style.display = !isExpend.value ? \"none\" : \"block\")\n : null; // 隐藏元素\n }\n });\n }\n\n if (expendBtnVisible.value) {\n // 如果是展开状态 则操作按钮占用剩余的网格数 否则占用6个网格\n isExpend.value\n ? (actionSpan.value = remainingCols)\n : (actionSpan.value = colSpan);\n }\n }\n\n return {\n rowRef,\n actionSpan,\n onExpend,\n expendBtnVisible,\n isExpend\n };\n }\n\n return () => (\n <>\n <Form\n ref={formRef}\n colon={false}\n labelCol={{ style: { width: props.labelWidth } }}\n model={modelValue.value}\n >\n <Row ref={rowRef}>\n {slots.default ? (\n slots.default()\n ) : (\n <DJsonSchemeRender\n layout={props.scheme}\n value={modelValue.value}\n />\n )}\n <Col span={actionSpan.value} style={{ textAlign: \"right\" }}>\n <FormItem>\n {slots.action ? slots.action() : renderAction()}\n </FormItem>\n </Col>\n </Row>\n </Form>\n </>\n );\n }\n});\n"],"names":["defineComponent","name","props","scheme","type","Array","Object","default","model","labelWidth","String","loading","Boolean","emits","setup","slots","emit","keepStore","useKeepAliveStore","route","useRoute","modelValue","formRef","onQuery","onReset","useForm","rowRef","actionSpan","onExpend","expendBtnVisible","isExpend","useExpand","renderAction","useRender","ref","keys","useMagicKeys","enterKey","watchEffect","value","watch","val","v","isActive","list","some","resetFields","_createVNode","Space","Button","icon","SearchOutlined","ReloadOutlined","DoubleRightOutlined","gridCount","colSpan","colsPerRow","onMounted","handleShowOrHidden","colEl","from","$el","children","colElLen","length","occupiedCols","fullRows","Math","ceil","lastRowCols","remainingCols","lastRowStartIndex","forEach","col","index","style","display","_Fragment","Form","width","Row","DJsonSchemeRender","Col","textAlign","FormItem","action"],"mappings":"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"}
|
|
@@ -2,6 +2,8 @@ import { defineComponent, ref, watchEffect, watch, createVNode, onMounted, Fragm
|
|
|
2
2
|
import { useMagicKeys } from '@vueuse/core';
|
|
3
3
|
import { Space, Button, Form, Row, Col, FormItem } from 'ant-design-vue';
|
|
4
4
|
import { SearchOutlined, ReloadOutlined, DoubleRightOutlined } from '@ant-design/icons-vue';
|
|
5
|
+
import { useKeepAliveStore } from '@ditari/store';
|
|
6
|
+
import { useRoute } from 'vue-router';
|
|
5
7
|
import JsonSchemeRender from '../json-scheme-render/JsonSchemeRender.mjs';
|
|
6
8
|
|
|
7
9
|
var QueryForm = /* @__PURE__ */ defineComponent({
|
|
@@ -29,6 +31,8 @@ var QueryForm = /* @__PURE__ */ defineComponent({
|
|
|
29
31
|
slots,
|
|
30
32
|
emit
|
|
31
33
|
}) {
|
|
34
|
+
const keepStore = useKeepAliveStore();
|
|
35
|
+
const route = useRoute();
|
|
32
36
|
const {
|
|
33
37
|
loading,
|
|
34
38
|
modelValue,
|
|
@@ -60,7 +64,8 @@ var QueryForm = /* @__PURE__ */ defineComponent({
|
|
|
60
64
|
});
|
|
61
65
|
watch(enterKey, (v) => {
|
|
62
66
|
if (v) {
|
|
63
|
-
|
|
67
|
+
const isActive = keepStore.list.some((name) => name === route.name);
|
|
68
|
+
if (!loading2.value && isActive) {
|
|
64
69
|
emit("query", modelValue2.value);
|
|
65
70
|
}
|
|
66
71
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DQueryForm.mjs","sources":["../../../src/form/DQueryForm.tsx"],"sourcesContent":["import { defineComponent, onMounted, ref, watch, watchEffect } from \"vue\";\nimport { useMagicKeys } from \"@vueuse/core\";\n\nimport { Form, FormItem, Row, Col, Button, Space } from \"ant-design-vue\";\nimport {\n SearchOutlined,\n ReloadOutlined,\n DoubleRightOutlined\n} from \"@ant-design/icons-vue\";\n\nimport DJsonSchemeRender from \"../json-scheme-render/JsonSchemeRender\";\n\n/**\n * 查询表单渲染\n * 展开,隐藏功能\n */\nexport default defineComponent({\n name: \"DQueryForm\",\n props: {\n scheme: {\n type: [Array, Object] as unknown as () => any[] | Record<string, any>,\n default: () => []\n },\n model: {\n type: Object as () => Record<string, unknown>,\n default: () => ({})\n },\n labelWidth: {\n type: String,\n default: \"90px\"\n },\n loading: {\n type: Boolean,\n default: false\n }\n },\n emits: [\"reset\", \"query\"],\n setup(props, { slots, emit }) {\n // 表单\n const { loading, modelValue, formRef, onQuery, onReset } = useForm();\n // 展开\n const { rowRef, actionSpan, onExpend, expendBtnVisible, isExpend } =\n useExpand();\n //渲染操作列\n const { renderAction } = useRender();\n\n function useForm() {\n const loading = ref(false);\n const formRef = ref<any>(null);\n const modelValue = ref<any>({});\n\n const keys = useMagicKeys();\n const enterKey = keys[\"enter\"];\n\n watchEffect(() => {\n modelValue.value = props.model;\n });\n\n watch(\n () => props.loading,\n (val) => {\n loading.value = val;\n }\n );\n\n /// 监听回车事件\n watch(enterKey, (v) => {\n if (v) {\n if (!loading.value) {\n emit(\"query\", modelValue.value);\n }\n }\n });\n\n const onQuery = () => {\n emit(\"query\", modelValue.value);\n };\n\n const onReset = () => {\n formRef.value?.resetFields();\n emit(\"reset\");\n };\n return {\n loading,\n modelValue,\n formRef,\n onQuery,\n onReset\n };\n }\n\n function useRender() {\n /**\n * 操作按钮渲染\n */\n function renderAction() {\n return (\n <Space>\n <Button\n loading={loading.value}\n type={\"primary\"}\n shape={\"round\"}\n onClick={onQuery}\n >\n {{\n default: () => \"查询\",\n icon: () => <SearchOutlined />\n }}\n </Button>\n <Button disabled={loading.value} shape={\"round\"} onClick={onReset}>\n {{\n default: () => \"重置\",\n icon: () => <ReloadOutlined />\n }}\n </Button>\n {expendBtnVisible.value ? (\n <Button onClick={onExpend} shape={\"round\"}>\n {{\n default: () => (isExpend.value ? \"收起\" : \"展开\"),\n icon: () => (\n <DoubleRightOutlined rotate={isExpend.value ? -90 : 90} />\n )\n }}\n </Button>\n ) : null}\n </Space>\n );\n }\n return {\n renderAction\n };\n }\n\n function useExpand() {\n // 为24网格布局\n const gridCount = 24;\n // 每列占6个格子\n const colSpan = 6;\n // 每行显示4列\n const colsPerRow = 4;\n // 操作按钮span\n const actionSpan = ref(6);\n // 控制展开或隐藏按钮文本\n const isExpend = ref(false);\n // 控制展开按按钮是否显示\n const expendBtnVisible = ref(false);\n // 行对象\n const rowRef = ref<any>(null);\n\n onMounted(() => {\n handleShowOrHidden();\n });\n\n function onExpend() {\n isExpend.value = !isExpend.value;\n handleShowOrHidden();\n }\n\n /**\n * 处理隐藏或显示\n */\n function handleShowOrHidden() {\n const colEl = Array.from(rowRef.value?.$el?.children);\n // col总条数 减掉操作栏按钮的div个数为1\n const colElLen = colEl.length - 1;\n // 已占用的网格数 = col总条数 * 每列占用的网格数\n const occupiedCols = colElLen * colSpan;\n // 总行数 = 总div数 / 每行显示的列数\n const fullRows = Math.ceil(colElLen / colsPerRow);\n // 最后一行的网格数 = 已占用的网格数 % 24\n const lastRowCols = occupiedCols % gridCount;\n // 最后一行剩余的网格数\n const remainingCols = gridCount - lastRowCols;\n\n // 网格行大于2才显示展开或隐藏按钮\n if (fullRows > 2) {\n expendBtnVisible.value = true;\n } else {\n // 如果没有大于两行,操作栏占用剩余的宽度\n actionSpan.value = remainingCols;\n }\n // 最后一行的起始索引\n const lastRowStartIndex = colsPerRow * (fullRows - 1) - 1;\n // 只有展开按钮显示时才处理\n if (expendBtnVisible.value) {\n colEl.forEach((col: any, index) => {\n if (index >= lastRowStartIndex) {\n // 最后一个元素不隐藏 是操作按钮的div\n index !== colElLen\n ? (col.style.display = !isExpend.value ? \"none\" : \"block\")\n : null; // 隐藏元素\n }\n });\n }\n\n if (expendBtnVisible.value) {\n // 如果是展开状态 则操作按钮占用剩余的网格数 否则占用6个网格\n isExpend.value\n ? (actionSpan.value = remainingCols)\n : (actionSpan.value = colSpan);\n }\n }\n\n return {\n rowRef,\n actionSpan,\n onExpend,\n expendBtnVisible,\n isExpend\n };\n }\n\n return () => (\n <>\n <Form\n ref={formRef}\n colon={false}\n labelCol={{ style: { width: props.labelWidth } }}\n model={modelValue.value}\n >\n <Row ref={rowRef}>\n {slots.default ? (\n slots.default()\n ) : (\n <DJsonSchemeRender\n layout={props.scheme}\n value={modelValue.value}\n />\n )}\n <Col span={actionSpan.value} style={{ textAlign: \"right\" }}>\n <FormItem>\n {slots.action ? slots.action() : renderAction()}\n </FormItem>\n </Col>\n </Row>\n </Form>\n </>\n );\n }\n});\n"],"names":["name","props","scheme","type","Array","Object","default","model","labelWidth","String","loading","Boolean","emits","setup","slots","emit","modelValue","formRef","onQuery","onReset","useForm","rowRef","actionSpan","onExpend","expendBtnVisible","isExpend","useExpand","renderAction","useRender","ref","keys","useMagicKeys","enterKey","watchEffect","value","watch","val","v","resetFields","_createVNode","Space","Button","icon","SearchOutlined","ReloadOutlined","DoubleRightOutlined","gridCount","colSpan","colsPerRow","onMounted","handleShowOrHidden","colEl","from","$el","children","colElLen","length","occupiedCols","fullRows","Math","ceil","lastRowCols","remainingCols","lastRowStartIndex","forEach","col","index","style","display","_Fragment","Form","width","Row","DJsonSchemeRender","Col","textAlign","FormItem","action"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"DQueryForm.mjs","sources":["../../../src/form/DQueryForm.tsx"],"sourcesContent":["import { defineComponent, onMounted, ref, watch, watchEffect } from \"vue\";\nimport { useMagicKeys } from \"@vueuse/core\";\n\nimport { Form, FormItem, Row, Col, Button, Space } from \"ant-design-vue\";\nimport {\n SearchOutlined,\n ReloadOutlined,\n DoubleRightOutlined\n} from \"@ant-design/icons-vue\";\nimport { useKeepAliveStore } from \"@ditari/store\";\nimport { useRoute } from \"vue-router\";\nimport DJsonSchemeRender from \"../json-scheme-render/JsonSchemeRender\";\n\n/**\n * 查询表单渲染\n * 展开,隐藏功能\n */\nexport default defineComponent({\n name: \"DQueryForm\",\n props: {\n scheme: {\n type: [Array, Object] as unknown as () => any[] | Record<string, any>,\n default: () => []\n },\n model: {\n type: Object as () => Record<string, unknown>,\n default: () => ({})\n },\n labelWidth: {\n type: String,\n default: \"90px\"\n },\n loading: {\n type: Boolean,\n default: false\n }\n },\n emits: [\"reset\", \"query\"],\n setup(props, { slots, emit }) {\n const keepStore = useKeepAliveStore();\n const route = useRoute();\n\n // 表单\n const { loading, modelValue, formRef, onQuery, onReset } = useForm();\n // 展开\n const { rowRef, actionSpan, onExpend, expendBtnVisible, isExpend } =\n useExpand();\n //渲染操作列\n const { renderAction } = useRender();\n\n function useForm() {\n const loading = ref(false);\n const formRef = ref<any>(null);\n const modelValue = ref<any>({});\n\n const keys = useMagicKeys();\n const enterKey = keys[\"enter\"];\n\n watchEffect(() => {\n modelValue.value = props.model;\n });\n\n watch(\n () => props.loading,\n (val) => {\n loading.value = val;\n }\n );\n\n /// 监听回车事件\n watch(enterKey, (v) => {\n if (v) {\n // 有路由名字会被keepalive进行缓存\n // 用于判断当前页面是否被激活 因为页面被缓存的时候,页面切换后,回车事件依然会触发\n const isActive = keepStore.list.some((name) => name === route.name);\n if (!loading.value && isActive) {\n emit(\"query\", modelValue.value);\n }\n // TODO 逻辑有问题\n // if (!route.name) {\n // // 没有路由名字,不会被缓存\n // if (!loading.value) {\n // emit(\"query\", modelValue.value);\n // }\n // } else {\n //\n // }\n }\n });\n\n const onQuery = () => {\n emit(\"query\", modelValue.value);\n };\n\n const onReset = () => {\n formRef.value?.resetFields();\n emit(\"reset\");\n };\n return {\n loading,\n modelValue,\n formRef,\n onQuery,\n onReset\n };\n }\n\n function useRender() {\n /**\n * 操作按钮渲染\n */\n function renderAction() {\n return (\n <Space>\n <Button\n loading={loading.value}\n type={\"primary\"}\n shape={\"round\"}\n onClick={onQuery}\n >\n {{\n default: () => \"查询\",\n icon: () => <SearchOutlined />\n }}\n </Button>\n <Button disabled={loading.value} shape={\"round\"} onClick={onReset}>\n {{\n default: () => \"重置\",\n icon: () => <ReloadOutlined />\n }}\n </Button>\n {expendBtnVisible.value ? (\n <Button onClick={onExpend} shape={\"round\"}>\n {{\n default: () => (isExpend.value ? \"收起\" : \"展开\"),\n icon: () => (\n <DoubleRightOutlined rotate={isExpend.value ? -90 : 90} />\n )\n }}\n </Button>\n ) : null}\n </Space>\n );\n }\n\n return {\n renderAction\n };\n }\n\n function useExpand() {\n // 为24网格布局\n const gridCount = 24;\n // 每列占6个格子\n const colSpan = 6;\n // 每行显示4列\n const colsPerRow = 4;\n // 操作按钮span\n const actionSpan = ref(6);\n // 控制展开或隐藏按钮文本\n const isExpend = ref(false);\n // 控制展开按按钮是否显示\n const expendBtnVisible = ref(false);\n // 行对象\n const rowRef = ref<any>(null);\n\n onMounted(() => {\n handleShowOrHidden();\n });\n\n function onExpend() {\n isExpend.value = !isExpend.value;\n handleShowOrHidden();\n }\n\n /**\n * 处理隐藏或显示\n */\n function handleShowOrHidden() {\n const colEl = Array.from(rowRef.value?.$el?.children);\n // col总条数 减掉操作栏按钮的div个数为1\n const colElLen = colEl.length - 1;\n // 已占用的网格数 = col总条数 * 每列占用的网格数\n const occupiedCols = colElLen * colSpan;\n // 总行数 = 总div数 / 每行显示的列数\n const fullRows = Math.ceil(colElLen / colsPerRow);\n // 最后一行的网格数 = 已占用的网格数 % 24\n const lastRowCols = occupiedCols % gridCount;\n // 最后一行剩余的网格数\n const remainingCols = gridCount - lastRowCols;\n\n // 网格行大于2才显示展开或隐藏按钮\n if (fullRows > 2) {\n expendBtnVisible.value = true;\n } else {\n // 如果没有大于两行,操作栏占用剩余的宽度\n actionSpan.value = remainingCols;\n }\n // 最后一行的起始索引\n const lastRowStartIndex = colsPerRow * (fullRows - 1) - 1;\n // 只有展开按钮显示时才处理\n if (expendBtnVisible.value) {\n colEl.forEach((col: any, index) => {\n if (index >= lastRowStartIndex) {\n // 最后一个元素不隐藏 是操作按钮的div\n index !== colElLen\n ? (col.style.display = !isExpend.value ? \"none\" : \"block\")\n : null; // 隐藏元素\n }\n });\n }\n\n if (expendBtnVisible.value) {\n // 如果是展开状态 则操作按钮占用剩余的网格数 否则占用6个网格\n isExpend.value\n ? (actionSpan.value = remainingCols)\n : (actionSpan.value = colSpan);\n }\n }\n\n return {\n rowRef,\n actionSpan,\n onExpend,\n expendBtnVisible,\n isExpend\n };\n }\n\n return () => (\n <>\n <Form\n ref={formRef}\n colon={false}\n labelCol={{ style: { width: props.labelWidth } }}\n model={modelValue.value}\n >\n <Row ref={rowRef}>\n {slots.default ? (\n slots.default()\n ) : (\n <DJsonSchemeRender\n layout={props.scheme}\n value={modelValue.value}\n />\n )}\n <Col span={actionSpan.value} style={{ textAlign: \"right\" }}>\n <FormItem>\n {slots.action ? slots.action() : renderAction()}\n </FormItem>\n </Col>\n </Row>\n </Form>\n </>\n );\n }\n});\n"],"names":["name","props","scheme","type","Array","Object","default","model","labelWidth","String","loading","Boolean","emits","setup","slots","emit","keepStore","useKeepAliveStore","route","useRoute","modelValue","formRef","onQuery","onReset","useForm","rowRef","actionSpan","onExpend","expendBtnVisible","isExpend","useExpand","renderAction","useRender","ref","keys","useMagicKeys","enterKey","watchEffect","value","watch","val","v","isActive","list","some","resetFields","_createVNode","Space","Button","icon","SearchOutlined","ReloadOutlined","DoubleRightOutlined","gridCount","colSpan","colsPerRow","onMounted","handleShowOrHidden","colEl","from","$el","children","colElLen","length","occupiedCols","fullRows","Math","ceil","lastRowCols","remainingCols","lastRowStartIndex","forEach","col","index","style","display","_Fragment","Form","width","Row","DJsonSchemeRender","Col","textAlign","FormItem","action"],"mappings":"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"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
<script setup lang="ts">
|
|
2
2
|
import { UserOutlined } from "@ant-design/icons-vue";
|
|
3
|
-
import { DMainLayout } from "../../../src";
|
|
3
|
+
import { Main as DMainLayout } from "../../../src/components";
|
|
4
4
|
import { useMenuStore } from "../../../../store";
|
|
5
5
|
|
|
6
6
|
const MenuList = [
|
|
@@ -39,12 +39,15 @@ const MenuList = [
|
|
|
39
39
|
{
|
|
40
40
|
title: "Form",
|
|
41
41
|
url: "/form",
|
|
42
|
-
icon: "icon-a-icon-documentsattached"
|
|
42
|
+
icon: "icon-a-icon-documentsattached",
|
|
43
43
|
}
|
|
44
44
|
];
|
|
45
45
|
const store = useMenuStore();
|
|
46
46
|
store.save(MenuList);
|
|
47
47
|
|
|
48
|
+
const showConfig = {
|
|
49
|
+
backBtn: "BackBtn"
|
|
50
|
+
};
|
|
48
51
|
</script>
|
|
49
52
|
<script lang="ts">
|
|
50
53
|
export default {
|
package/example/src/main.ts
CHANGED
|
@@ -10,6 +10,6 @@ const app = createApp(App);
|
|
|
10
10
|
// 注册共用组件
|
|
11
11
|
app.use(Antd);
|
|
12
12
|
app.use(router);
|
|
13
|
-
app.use(ui, { menuIcon: { componentName: "
|
|
13
|
+
app.use(ui, { menuIcon: { componentName: "nativeHtml", prop: "type" } } as any);
|
|
14
14
|
|
|
15
15
|
app.mount("#app");
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import { RouteRecordRaw } from "vue-router";
|
|
2
|
+
|
|
3
|
+
const route: RouteRecordRaw[] = [
|
|
4
|
+
{
|
|
5
|
+
path: "/form",
|
|
6
|
+
redirect: "/form",
|
|
7
|
+
meta: {
|
|
8
|
+
title: "表单"
|
|
9
|
+
},
|
|
10
|
+
children: [
|
|
11
|
+
{
|
|
12
|
+
path: "",
|
|
13
|
+
component: () => import("../../views/form/List.vue"),
|
|
14
|
+
meta: {
|
|
15
|
+
title: "表单",
|
|
16
|
+
keepOpen: true
|
|
17
|
+
}
|
|
18
|
+
},
|
|
19
|
+
{
|
|
20
|
+
path: "dyn/demo",
|
|
21
|
+
component: () => import("../../views/form/dyn/List.vue"),
|
|
22
|
+
meta: {
|
|
23
|
+
title: "动态表单",
|
|
24
|
+
keepOpen: true
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
]
|
|
28
|
+
}
|
|
29
|
+
];
|
|
30
|
+
|
|
31
|
+
export default route;
|
|
@@ -1,31 +1,61 @@
|
|
|
1
|
-
import { createRouter, createWebHistory } from "vue-router";
|
|
1
|
+
import { createRouter, createWebHistory, RouteRecordRaw } from "vue-router";
|
|
2
|
+
import AppMain from "../components/AppMain.vue";
|
|
3
|
+
import { useDitariRoute } from "../../../../hooks";
|
|
4
|
+
import { useUserStore } from "../../../../store";
|
|
2
5
|
|
|
6
|
+
const STATIC_ROUTE: RouteRecordRaw[] = [
|
|
7
|
+
{
|
|
8
|
+
path: "/login",
|
|
9
|
+
component: () => import("../views/Login.vue")
|
|
10
|
+
},
|
|
11
|
+
{
|
|
12
|
+
path: "/demo",
|
|
13
|
+
component: () => import("../views/Demo.vue")
|
|
14
|
+
}
|
|
15
|
+
];
|
|
3
16
|
const router = createRouter({
|
|
4
|
-
history: createWebHistory(),
|
|
5
|
-
routes: [
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
17
|
+
history: createWebHistory(import.meta.env.VITE_APP_BASE_URL || ""),
|
|
18
|
+
routes: [...STATIC_ROUTE]
|
|
19
|
+
});
|
|
20
|
+
|
|
21
|
+
// 面包屑匹配方法
|
|
22
|
+
let setMatchedFn: any = null;
|
|
23
|
+
|
|
24
|
+
// 路由守卫
|
|
25
|
+
// eslint-disable-next-line complexity
|
|
26
|
+
router.beforeEach(async (to, from) => {
|
|
27
|
+
const { getToken } = useUserStore();
|
|
28
|
+
if (router.getRoutes().length <= 2) {
|
|
29
|
+
// 路由长度小于2的时候,需要动态注册路由,说明资源文件被强制加载了
|
|
30
|
+
const { getRoutes, setMatched } = useDitariRoute();
|
|
31
|
+
const routes = await getRoutes(import.meta.glob("./**/*.route.{ts,js}"));
|
|
32
|
+
router.addRoute({
|
|
33
|
+
path: "/",
|
|
34
|
+
component: AppMain,
|
|
35
|
+
children: routes
|
|
36
|
+
});
|
|
37
|
+
setMatchedFn = setMatched;
|
|
38
|
+
// 必须传query和param 否则,强制刷新的时候会丢失参数
|
|
39
|
+
return { replace: true, path: to.path, query: to.query, params: to.params };
|
|
40
|
+
}
|
|
41
|
+
const isLoginPage = to.path.indexOf("login") === -1;
|
|
42
|
+
// 没有token
|
|
43
|
+
if (!getToken) {
|
|
44
|
+
//访问的不是登录页面
|
|
45
|
+
// if (isLoginPage) {
|
|
46
|
+
// return {
|
|
47
|
+
// path: "/login",
|
|
48
|
+
// replace: true,
|
|
49
|
+
// query: { redirect: from.fullPath }
|
|
50
|
+
// };
|
|
51
|
+
// }
|
|
52
|
+
} else {
|
|
53
|
+
if (!isLoginPage) {
|
|
54
|
+
// 如果登录了且访问的是登录页则跳转到首页
|
|
55
|
+
return "/";
|
|
27
56
|
}
|
|
28
|
-
|
|
57
|
+
}
|
|
58
|
+
setMatchedFn && setMatchedFn(to, from);
|
|
29
59
|
});
|
|
30
60
|
|
|
31
61
|
export default router;
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import { RouteRecordRaw } from "vue-router";
|
|
2
|
+
|
|
3
|
+
const route: RouteRecordRaw[] = [
|
|
4
|
+
{
|
|
5
|
+
path: "/table",
|
|
6
|
+
redirect: "/table",
|
|
7
|
+
meta: {
|
|
8
|
+
title: "列表2(层级模式)"
|
|
9
|
+
},
|
|
10
|
+
children: [
|
|
11
|
+
{
|
|
12
|
+
path: "",
|
|
13
|
+
name: "TableList",
|
|
14
|
+
component: () => import("../../views/table/List.vue"),
|
|
15
|
+
meta: {
|
|
16
|
+
title: "列表2(层级模式)"
|
|
17
|
+
}
|
|
18
|
+
},
|
|
19
|
+
{
|
|
20
|
+
path: "add",
|
|
21
|
+
name: "Add",
|
|
22
|
+
component: () => import("../../views/table/Add.vue"),
|
|
23
|
+
meta: {
|
|
24
|
+
title: "新增"
|
|
25
|
+
}
|
|
26
|
+
},
|
|
27
|
+
{
|
|
28
|
+
path: "edit",
|
|
29
|
+
name: "Edit",
|
|
30
|
+
component: () => import("../../views/table/Edit.vue"),
|
|
31
|
+
meta: {
|
|
32
|
+
title: "编辑"
|
|
33
|
+
}
|
|
34
|
+
}
|
|
35
|
+
]
|
|
36
|
+
}
|
|
37
|
+
];
|
|
38
|
+
|
|
39
|
+
export default route;
|
|
@@ -1,10 +1,49 @@
|
|
|
1
|
-
<script setup lang="ts"></script>
|
|
2
|
-
<script lang="ts">
|
|
3
|
-
export default {
|
|
4
|
-
name: "Demo"
|
|
5
|
-
};
|
|
6
|
-
</script>
|
|
7
1
|
<template>
|
|
8
|
-
<
|
|
2
|
+
<a-row>
|
|
3
|
+
<a-col
|
|
4
|
+
v-for="(item, index) in cols"
|
|
5
|
+
:key="index"
|
|
6
|
+
:span="6"
|
|
7
|
+
:class="{ hidden: shouldHide(index) }"
|
|
8
|
+
>
|
|
9
|
+
{{ item }}
|
|
10
|
+
</a-col>
|
|
11
|
+
<a-col :span="buttonColSpan">
|
|
12
|
+
<a-button @click="toggleVisibility">{{ buttonText }}</a-button>
|
|
13
|
+
</a-col>
|
|
14
|
+
</a-row>
|
|
9
15
|
</template>
|
|
10
|
-
|
|
16
|
+
|
|
17
|
+
<script setup>
|
|
18
|
+
import { ref, computed } from "vue";
|
|
19
|
+
|
|
20
|
+
const cols = ref(Array.from({ length: 20 }).map((_, index) => index + 1));
|
|
21
|
+
const maxVisibleRows = 2;
|
|
22
|
+
const colsPerRow = 4;
|
|
23
|
+
const buttonColSpan = computed(
|
|
24
|
+
() => colsPerRow - (cols.value.length % colsPerRow)
|
|
25
|
+
);
|
|
26
|
+
|
|
27
|
+
function shouldHide(index) {
|
|
28
|
+
const totalVisibleCols = maxVisibleRows * colsPerRow;
|
|
29
|
+
return cols.value.length > totalVisibleCols && index >= totalVisibleCols;
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
function toggleVisibility() {
|
|
33
|
+
if (cols.value.length > maxVisibleRows * colsPerRow) {
|
|
34
|
+
cols.value = cols.value.slice(0, maxVisibleRows * colsPerRow);
|
|
35
|
+
} else {
|
|
36
|
+
cols.value = cols.value.concat(Array.from({ length: colsPerRow }));
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
const buttonText = computed(() =>
|
|
41
|
+
cols.value.length > maxVisibleRows * colsPerRow ? "显示" : "隐藏"
|
|
42
|
+
);
|
|
43
|
+
</script>
|
|
44
|
+
|
|
45
|
+
<style>
|
|
46
|
+
.hidden {
|
|
47
|
+
display: none;
|
|
48
|
+
}
|
|
49
|
+
</style>
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
<script setup lang="ts">
|
|
2
|
+
import { ref, h } from "vue";
|
|
3
|
+
|
|
4
|
+
import { confirm } from "../utils/confirm/confirm";
|
|
5
|
+
|
|
6
|
+
import DModal from "../components/Modal.vue";
|
|
7
|
+
import AddForm from "../components/AddForm.vue";
|
|
8
|
+
|
|
9
|
+
const formRef = ref();
|
|
10
|
+
|
|
11
|
+
confirm({
|
|
12
|
+
wrapper: DModal,
|
|
13
|
+
content: () => h(AddForm, { ref: formRef }),
|
|
14
|
+
async onOk() {
|
|
15
|
+
formRef.value?.validate();
|
|
16
|
+
try {
|
|
17
|
+
return await new Promise((resolve, reject) => {
|
|
18
|
+
setTimeout(Math.random() > 0.5 ? resolve : reject, 3000);
|
|
19
|
+
});
|
|
20
|
+
} catch {
|
|
21
|
+
return console.log("Oops errors!");
|
|
22
|
+
}
|
|
23
|
+
}
|
|
24
|
+
});
|
|
25
|
+
</script>
|
|
26
|
+
<script lang="ts">
|
|
27
|
+
export default {
|
|
28
|
+
name: "Demo"
|
|
29
|
+
};
|
|
30
|
+
</script>
|
|
31
|
+
<template>
|
|
32
|
+
<div></div>
|
|
33
|
+
</template>
|
|
34
|
+
<style scoped></style>
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
<script setup lang="ts">
|
|
2
|
+
/**
|
|
3
|
+
* 登录
|
|
4
|
+
*/
|
|
5
|
+
</script>
|
|
6
|
+
<template>
|
|
7
|
+
<div class="login-main">
|
|
8
|
+
<div class="login-box">
|
|
9
|
+
<a-form>
|
|
10
|
+
<a-form-item>
|
|
11
|
+
<a-input placeholder="请输入账号" />
|
|
12
|
+
</a-form-item>
|
|
13
|
+
<a-form-item>
|
|
14
|
+
<a-input type="password" placeholder="请输入密码" />
|
|
15
|
+
</a-form-item>
|
|
16
|
+
<a-form-item>
|
|
17
|
+
<a-button type="primary" block>登录</a-button>
|
|
18
|
+
</a-form-item>
|
|
19
|
+
</a-form>
|
|
20
|
+
</div>
|
|
21
|
+
</div>
|
|
22
|
+
</template>
|
|
23
|
+
<style lang="scss">
|
|
24
|
+
.login-main {
|
|
25
|
+
display: flex;
|
|
26
|
+
align-items: center;
|
|
27
|
+
justify-content: center;
|
|
28
|
+
height: 100vh;
|
|
29
|
+
.login-box {
|
|
30
|
+
width: 400px;
|
|
31
|
+
height: 400px;
|
|
32
|
+
padding: 20px;
|
|
33
|
+
background-color: #fff;
|
|
34
|
+
&:after {
|
|
35
|
+
content: "";
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
</style>
|
|
@@ -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>
|