Skip to content

Commit e53291b

Browse files
lljj-xlljj-x
committed
feat(lib): 优化样式
1 parent a159c78 commit e53291b

File tree

13 files changed

+100
-73
lines changed

13 files changed

+100
-73
lines changed

‎packages/demo/demo-common/components/Menu.vue‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -96,8 +96,8 @@ export default {
9696
padding-left: 14px;
9797
padding-right: 0;
9898
margin: 0 20px;
99-
height: 80px;
100-
line-height: 80px;
99+
height: 54px;
100+
line-height: 54px;
101101
}
102102
}
103103
.menuLink {

‎packages/demo/demo-v2/src/pages/index/views/Demo/index.vue‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -9,20 +9,20 @@
99
<el-slider
1010
v-model="formProps.labelWidth"
1111
style="width: 70px; margin-right: 6px;"
12-
size="mini"
12+
size="small"
1313
:format-tooltip="sliderFormat"
1414
></el-slider>
1515
<el-checkbox
1616
v-model="formProps.inline"
1717
style="margin-right: 6px;"
18-
size="mini"
18+
size="small"
1919
>
2020
Inline
2121
</el-checkbox>
2222
<el-checkbox
2323
v-model="formFooter.show"
2424
style="margin-right: 6px;"
25-
size="mini"
25+
size="small"
2626
>
2727
底部
2828
</el-checkbox>
@@ -155,7 +155,7 @@
155155
<el-select
156156
v-model="curVueForm"
157157
placeholder="ui"
158-
size="mini"
158+
size="small"
159159
style="margin-left: 10px;width: 130px;"
160160
@change="handleUiChange"
161161
>

‎packages/demo/demo-v3/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@
1414
"@lljj/vue3-form-element": "1.11.0",
1515
"ajv-i18n": "^3.5.0",
1616
"ant-design-vue": "^2.0.1",
17-
"naive-ui": "^2.25.2",
17+
"naive-ui": "^2.26.1",
1818
"demo-common": "1.2.0",
1919
"vue": "^3.0.0",
2020
"vuedraggable": "2.23.2"

‎packages/demo/demo-v3/src/pages/index/index.html‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -11,15 +11,15 @@
1111
<title>Vue JSON Schema form editor - VJSF</title>
1212
<meta name="description" content="vue-json-schema-form - 基于JSON Schema动态创建表单在线演示编辑器" />
1313
<link rel="icon" href="https://vue-json-schema-form.lljj.me/icons/ico.png">
14-
<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/element-plus@1.0.2-beta.65/lib/theme-chalk/index.css">
14+
<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/element-plus/dist/index.css">
1515
<link rel="apple-touch-icon" href="https://vue-json-schema-form.lljj.me/icons/ico.png">
1616
</head>
1717
<body>
1818
<div id="app"></div>
1919
<script src="//cdn.jsdelivr.net/npm/@lljj/polyfill@0.1.1/dist/polyfill.umd.min.js"></script>
20-
<script src="//cdn.jsdelivr.net/npm/vue@3.0.5/dist/vue.global.js"></script>
20+
<script src="https://cdn.jsdelivr.net/npm/vue@next"></script>
2121
<script src="//cdn.jsdelivr.net/npm/vue-router@4"></script>
22-
<script src="https://cdn.bootcdn.net/ajax/libs/element-plus/1.0.2-beta.65/index.full.js"></script>
22+
<script src="https://cdn.jsdelivr.net/npm/element-plus"></script>
2323

2424
<script src="//cdn.jsdelivr.net/npm/monaco-editor@0.20.0/min/vs/loader.js"></script>
2525
<script>

‎packages/demo/demo-v3/src/pages/index/index.js‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -31,4 +31,6 @@ app.use(ElementPlus);
3131
// mount
3232
app.mount('#app');
3333

34+
app.config.unwrapInjectedRef = true;
35+
3436
window.app1 = app;

‎packages/demo/demo-v3/src/pages/index/views/Demo/index.vue‎

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@
1111
<el-slider
1212
v-model="formProps.labelWidth"
1313
style="width: 70px; margin-right: 6px;"
14-
size="mini"
14+
size="small"
1515
:format-tooltip="sliderFormat"
1616
></el-slider>
1717
</template>
@@ -23,29 +23,29 @@
2323
:min="3"
2424
:max="15"
2525
style="width: 70px; margin-right: 6px;"
26-
size="mini"
26+
size="small"
2727
></el-slider>
2828
<span style="font-size: 13px;">wrapperCol：</span>
2929
<el-slider
3030
v-model="formProps.wrapperColSpan"
3131
:min="5"
3232
:max="24"
3333
style="width: 70px; margin-right: 6px;"
34-
size="mini"
34+
size="small"
3535
></el-slider>
3636
</template>
3737

3838
<el-checkbox
3939
v-model="formProps.inline"
4040
style="margin-right: 6px;"
41-
size="mini"
41+
size="small"
4242
>
4343
Inline
4444
</el-checkbox>
4545
<el-checkbox
4646
v-model="formFooter.show"
4747
style="margin-right: 6px;"
48-
size="mini"
48+
size="small"
4949
>
5050
底部
5151
</el-checkbox>
@@ -178,7 +178,7 @@
178178
<el-select
179179
v-model="curVueForm"
180180
placeholder="ui"
181-
size="mini"
181+
size="small"
182182
style="margin-left: 10px;width: 130px;"
183183
@change="handleUiChange"
184184
>
@@ -225,14 +225,14 @@ import EditorHeader from 'demo-common/components/EditorHeader.vue';
225225
import CodeEditor from 'demo-common/components/CodeEditor';
226226
import schemaTypes from 'demo-common/schemaTypes';
227227
228-
const VueElementForm = defineAsyncComponent(() => import('@lljj/vue3-form-element'));
228+
const VueElementForm = defineAsyncComponent(() => import('@lljj/vue3-form-element/src/index'));
229229
230230
let installedAntdv = false;
231231
const VueAntForm = defineAsyncComponent(async () => {
232232
// eslint-disable-next-line no-unused-vars
233233
const [antdv, antForm] = await Promise.all([
234234
import('demo-common/components/Antdv/index.js'),
235-
import('@lljj/vue3-form-ant')
235+
import('@lljj/vue3-form-ant/src/index')
236236
]);
237237
238238
return {
@@ -339,16 +339,16 @@ export default {
339339
};
340340
},
341341
trueFormFooter() {
342-
const {
343-
labelColSpan,
344-
wrapperColSpan
345-
} = this.formProps;
342+
// const {
343+
// labelColSpan,
344+
// wrapperColSpan
345+
// } = this.formProps;
346346
347347
return this.isUseLabelWidth ? (this.formFooter || {}) : {
348348
formItemAttrs: {
349349
wrapperCol: {
350-
span: wrapperColSpan,
351-
offset: labelColSpan
350+
span: 24,
351+
offset: 0
352352
}
353353
}
354354
};
@@ -435,7 +435,7 @@ export default {
435435
labelPosition: 'top',
436436
inlineFooter: false,
437437
labelColSpan: 10,
438-
wrapperColSpan: 12,
438+
wrapperColSpan: 24,
439439
layoutColumn: 1
440440
},
441441
};

‎packages/lib/utils/style/baseForm.css‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -81,6 +81,8 @@
8181
line-height: 20px;
8282
color: #999;
8383
text-align: left;
84+
width: 100%;
85+
flex-shrink: 0;
8486
}
8587
.formItemErrorBox {
8688
margin: 0 auto;
@@ -265,6 +267,11 @@
265267
}
266268
}
267269

270+
/*popover 弹出可能appendtobody*/
271+
.genFromWidget_des_mini {
272+
font-size: 14px;
273+
line-height: 1.5715;
274+
}
268275

269276
/* 适配多列布局 */
270277
:root {

‎packages/lib/vue2/vue2-core/src/components/Widget.js‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -187,7 +187,8 @@ export default {
187187
innerHTML: self.description
188188
},
189189
class: {
190-
genFromWidget_des: true
190+
genFromWidget_des: true,
191+
genFromWidget_des_mini: miniDesModel
191192
}
192193
},
193194
) : null;

‎packages/lib/vue3/vue3-core/src/components/Widget.js‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -185,7 +185,8 @@ export default {
185185
{
186186
innerHTML: props.description,
187187
class: {
188-
genFromWidget_des: true
188+
genFromWidget_des: true,
189+
genFromWidget_des_mini: miniDesModel
189190
}
190191
},
191192
) : null;

‎packages/lib/vue3/vue3-form-ant/src/config/widgets/index.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ const widgetComponents = {
2121
DateTimePickerWidget,
2222
UploadWidget,
2323
InputWidget: modelValueComponent('a-input'),
24+
TextAreaWidget: modelValueComponent('a-textarea'),
2425
InputNumberWidget: modelValueComponent('a-input-number'),
2526
AutoCompleteWidget: modelValueComponent('a-auto-complete'),
2627
SliderWidget: modelValueComponent('a-slider'),

0 commit comments

Comments
 (0)