Hooke / data-table

Go to a project
Toggle navigation Toggle navigation pinning
hookehuyr
18990c9d 1 parent 9e7806de

fix 日期相关控件边框显示调整

Inline Side-by-side
Showing 3 changed files with 32 additions and 5 deletions
1 <!-- 1 <!--
2 * @Date: 2022-08-31 11:45:30 2 * @Date: 2022-08-31 11:45:30
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2022-12-22 18:43:29 4 + * @LastEditTime: 2022-12-22 18:52:22
5 * @FilePath: /data-table/src/components/DatePickerField/index.vue 5 * @FilePath: /data-table/src/components/DatePickerField/index.vue
6 * @Description: 日期选择组件 6 * @Description: 日期选择组件
7 --> 7 -->
...@@ -20,6 +20,7 @@ ...@@ -20,6 +20,7 @@
20 :placeholder="item.component_props.placeholder ? item.component_props.placeholder : '请选择日期'" 20 :placeholder="item.component_props.placeholder ? item.component_props.placeholder : '请选择日期'"
21 :rules="rules" 21 :rules="rules"
22 @click="showPicker = true" 22 @click="showPicker = true"
23 + :border="false"
23 /> 24 />
24 <van-popup v-model:show="showPicker" position="bottom"> 25 <van-popup v-model:show="showPicker" position="bottom">
25 <van-date-picker 26 <van-date-picker
...@@ -91,8 +92,9 @@ const rules = [{ validator, message: validatorMessage }]; ...@@ -91,8 +92,9 @@ const rules = [{ validator, message: validatorMessage }];
91 92
92 <style lang="less" scoped> 93 <style lang="less" scoped>
93 .date-picker-field { 94 .date-picker-field {
95 + margin: 1rem;
94 .label { 96 .label {
95 - padding: 1rem 1rem 0 1rem; 97 + // padding: 1rem 1rem 0 1rem;
96 font-size: 0.9rem; 98 font-size: 0.9rem;
97 font-weight: bold; 99 font-weight: bold;
98 100
...@@ -101,4 +103,11 @@ const rules = [{ validator, message: validatorMessage }]; ...@@ -101,4 +103,11 @@ const rules = [{ validator, message: validatorMessage }];
101 } 103 }
102 } 104 }
103 } 105 }
106 +
107 +:deep(.van-cell--clickable) {
108 + border: 1px solid #eaeaea;
109 + border-radius: 0.25rem;
110 + padding: 0.25rem 0.5rem;
111 + margin-top: 0.5rem;
112 +}
104 </style> 113 </style>
......
1 <!-- 1 <!--
2 * @Date: 2022-09-08 15:02:45 2 * @Date: 2022-09-08 15:02:45
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2022-12-22 18:36:44 4 + * @LastEditTime: 2022-12-22 18:52:28
5 * @FilePath: /data-table/src/components/DateTimePickerField/index.vue 5 * @FilePath: /data-table/src/components/DateTimePickerField/index.vue
6 * @Description: 日期时间选择器 6 * @Description: 日期时间选择器
7 --> 7 -->
...@@ -20,6 +20,7 @@ ...@@ -20,6 +20,7 @@
20 :placeholder="item.component_props.placeholder ? item.component_props.placeholder : '请选择日期时间'" 20 :placeholder="item.component_props.placeholder ? item.component_props.placeholder : '请选择日期时间'"
21 :rules="rules" 21 :rules="rules"
22 @click="showPicker = true" 22 @click="showPicker = true"
23 + :border="false"
23 /> 24 />
24 <van-popup v-model:show="showPicker" position="bottom"> 25 <van-popup v-model:show="showPicker" position="bottom">
25 <van-picker-group 26 <van-picker-group
...@@ -118,8 +119,9 @@ const rules = [{ validator, message: validatorMessage }]; ...@@ -118,8 +119,9 @@ const rules = [{ validator, message: validatorMessage }];
118 119
119 <style lang="less" scoped> 120 <style lang="less" scoped>
120 .datetime-picker { 121 .datetime-picker {
122 + margin: 1rem;
121 .label { 123 .label {
122 - padding: 1rem 1rem 0 1rem; 124 + // padding: 1rem 1rem 0 1rem;
123 font-size: 0.9rem; 125 font-size: 0.9rem;
124 font-weight: bold; 126 font-weight: bold;
125 127
...@@ -128,4 +130,11 @@ const rules = [{ validator, message: validatorMessage }]; ...@@ -128,4 +130,11 @@ const rules = [{ validator, message: validatorMessage }];
128 } 130 }
129 } 131 }
130 } 132 }
133 +
134 +:deep(.van-cell--clickable) {
135 + border: 1px solid #eaeaea;
136 + border-radius: 0.25rem;
137 + padding: 0.25rem 0.5rem;
138 + margin-top: 0.5rem;
139 +}
131 </style> 140 </style>
......
...@@ -20,6 +20,7 @@ ...@@ -20,6 +20,7 @@
20 :placeholder="item.component_props.placeholder ? item.component_props.placeholder : '请选择时间'" 20 :placeholder="item.component_props.placeholder ? item.component_props.placeholder : '请选择时间'"
21 :rules="rules" 21 :rules="rules"
22 @click="showPicker = true" 22 @click="showPicker = true"
23 + :border="false"
23 /> 24 />
24 <van-popup v-model:show="showPicker" position="bottom"> 25 <van-popup v-model:show="showPicker" position="bottom">
25 <van-time-picker 26 <van-time-picker
...@@ -91,8 +92,9 @@ const rules = [{ validator, message: validatorMessage }]; ...@@ -91,8 +92,9 @@ const rules = [{ validator, message: validatorMessage }];
91 92
92 <style lang="less" scoped> 93 <style lang="less" scoped>
93 .time-picker-field { 94 .time-picker-field {
95 + margin: 1rem;
94 .label { 96 .label {
95 - padding: 1rem 1rem 0 1rem; 97 + // padding: 1rem 1rem 0 1rem;
96 font-size: 0.9rem; 98 font-size: 0.9rem;
97 font-weight: bold; 99 font-weight: bold;
98 100
...@@ -101,4 +103,11 @@ const rules = [{ validator, message: validatorMessage }]; ...@@ -101,4 +103,11 @@ const rules = [{ validator, message: validatorMessage }];
101 } 103 }
102 } 104 }
103 } 105 }
106 +
107 +:deep(.van-cell--clickable) {
108 + border: 1px solid #eaeaea;
109 + border-radius: 0.25rem;
110 + padding: 0.25rem 0.5rem;
111 + margin-top: 0.5rem;
112 +}
104 </style> 113 </style>
......