Hooke / data-table

Go to a project
Toggle navigation Toggle navigation pinning
hookehuyr
dfe958be 1 parent a931b520

表单样式统一修改,详情页表单的border去掉

Inline Side-by-side
Showing 23 changed files with 60 additions and 78 deletions
<!--
* @Date: 2023-03-28 15:38:09
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2023-03-28 16:10:58
* @LastEditTime: 2024-08-03 20:34:02
* @FilePath: /data-table/src/components/AppointmentField/MyComponent.vue
* @Description: 自定义组件
-->
......@@ -81,7 +81,7 @@ useCustomFieldValue(() => picker_value.value);
<style lang="less" scoped>
:deep(.van-cell--clickable) {
border: 1px solid #eaeaea;
border: var(--border-style);
border-radius: 0.25rem;
padding: 0.25rem 0.5rem;
margin-top: 0.5rem;
......
<!--
* @Date: 2022-08-29 14:31:20
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2023-03-29 13:10:16
* @LastEditTime: 2024-08-03 20:34:12
* @FilePath: /data-table/src/components/AppointmentField/index.vue
* @Description: 预约时间控件
-->
......@@ -72,10 +72,4 @@ const rules = [{ validator, message: validatorMessage }];
}
}
}
// :deep(.van-field__body) {
// border: 1px solid #eaeaea;
// border-radius: 0.25rem;
// padding: 0.25rem 0.5rem;
// }
</style>
......
<!--
* @Date: 2022-08-30 11:34:19
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-07-19 16:55:56
* @LastEditTime: 2024-08-03 20:34:28
* @FilePath: /data-table/src/components/CheckboxField/index.vue
* @Description: 多项选择控件
-->
......@@ -169,23 +169,17 @@ onMounted(() => {
}
.checkbox-wrapper {
border: 1px solid #eaeaea;
border: var(--border-style);
border-radius: 0.25rem;
padding: 0.25rem 0.5rem;
margin-bottom: 0.25rem;
}
.affix-input {
border: 1px solid #eaeaea;
border: var(--border-style);
border-radius: 0.25rem;
padding: 0.25rem 0.5rem;
margin-top: 0.5rem;
margin-bottom: 0.25rem;
}
}
:deep(.van-checkbox) {
// border: 1px solid #eaeaea;
// border-radius: 0.25rem;
// padding: 0.25rem 0.5rem;
}
</style>
......
<!--
* @Date: 2022-08-31 11:45:30
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-06-13 17:52:57
* @LastEditTime: 2024-08-03 20:34:51
* @FilePath: /data-table/src/components/DatePickerField/index.vue
* @Description: 日期选择组件
-->
......@@ -160,7 +160,7 @@ const rules = [{ validator, message: validatorMessage }];
}
:deep(.van-cell--clickable) {
border: 1px solid #eaeaea;
border: var(--border-style);
border-radius: 0.25rem;
padding: 0.25rem 0.5rem;
margin-top: 0.5rem;
......
<!--
* @Date: 2022-09-08 15:02:45
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-06-13 18:22:45
* @LastEditTime: 2024-08-03 20:34:57
* @FilePath: /data-table/src/components/DateTimePickerField/index.vue
* @Description: 日期时间选择器
-->
......@@ -207,7 +207,7 @@ const rules = [{ validator, message: validatorMessage }];
}
:deep(.van-cell--clickable) {
border: 1px solid #eaeaea;
border: var(--border-style);
border-radius: 0.25rem;
padding: 0.25rem 0.5rem;
margin-top: 0.5rem;
......
<!--
* @Date: 2022-08-29 14:31:20
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2023-01-18 15:58:11
* @LastEditTime: 2024-08-03 20:35:02
* @FilePath: /data-table/src/components/EmailField/index.vue
* @Description: 邮箱输入框
-->
......@@ -73,7 +73,7 @@ const rules = [{ validator, message: validatorMessage }];
}
:deep(.van-field__body) {
border: 1px solid #eaeaea;
border: var(--border-style);
border-radius: 0.25rem;
padding: 0.25rem 0.5rem;
}
......
<!--
* @Date: 2022-08-30 11:34:19
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-07-31 10:42:04
* @LastEditTime: 2024-08-03 20:35:08
* @FilePath: /data-table/src/components/GenderField/index.vue
* @Description: 性别选择控件
-->
......@@ -88,7 +88,7 @@ const onChange = (item) => {
white-space: pre-wrap;
}
.radio-wrapper {
border: 1px solid #eaeaea;
border: var(--border-style);
border-radius: 0.25rem;
padding: 0.25rem 0.5rem;
margin-bottom: 0.25rem;
......
<!--
* @Date: 2024-05-27 14:28:57
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-06-03 17:22:17
* @LastEditTime: 2024-08-03 20:35:14
* @FilePath: /data-table/src/components/GroupField/index.vue
* @Description: 组集合输入控件
-->
......@@ -155,7 +155,7 @@ const onActive = (item) => {
white-space: pre-wrap;
}
.radio-wrapper {
border: 1px solid #eaeaea;
border: var(--border-style);
border-radius: 0.25rem;
padding: 0.25rem 0.5rem;
margin-bottom: 0.25rem;
......
<!--
* @Date: 2022-09-14 14:44:30
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-07-26 22:37:11
* @LastEditTime: 2024-08-03 20:35:18
* @FilePath: /data-table/src/components/IdentityField/index.vue
* @Description: 身份证输入控件
-->
......@@ -221,7 +221,7 @@ const getGenderByIdNumber = (idNumber) => {
}
:deep(.van-field__body) {
border: 1px solid #eaeaea;
border: var(--border-style);
border-radius: 0.25rem;
padding: 0.25rem 0.5rem;
}
......
<!--
* @Date: 2022-08-30 11:34:19
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-06-17 13:29:52
* @LastEditTime: 2024-08-03 20:35:26
* @FilePath: /data-table/src/components/MultiRuleField/index.vue
* @Description: 多选规则确认控件
-->
......@@ -167,7 +167,7 @@ const rules = [{ validator, message: validatorMessage }];
}
}
.multi-rule-field-box {
border: 1px solid #eaeaea;
border: var(--border-style);
border-radius: 0.25rem;
padding: 1rem 0.5rem 0 0.5rem;
// width: 100vw;
......
<!--
* @Date: 2022-08-29 14:31:20
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-05-27 17:47:52
* @LastEditTime: 2024-08-03 20:27:38
* @FilePath: /data-table/src/components/NameField/index.vue
* @Description: 姓名输入框
-->
......@@ -21,6 +21,7 @@
:readonly="item.component_props.readonly"
:disabled="item.component_props.disabled"
:input-align="item.component_props.align"
:border="false"
/>
</div>
</template>
......@@ -76,7 +77,7 @@ onMounted(() => {
}
:deep(.van-field__body) {
border: 1px solid #eaeaea;
border: var(--border-style);
border-radius: 0.25rem;
padding: 0.25rem 0.5rem;
}
......
<!--
* @Date: 2022-09-14 14:44:30
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-07-31 14:36:50
* @LastEditTime: 2024-08-03 20:35:32
* @FilePath: /data-table/src/components/NumberField/index.vue
* @Description: 数字输入框
-->
......@@ -193,7 +193,7 @@ const onDelete = () => {};
}
:deep(.van-field__body) {
border: 1px solid #eaeaea;
border: var(--border-style);
border-radius: 0.25rem;
padding: 0.25rem 0.5rem;
input {
......
<!--
* @Date: 2022-08-29 14:31:20
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-07-30 16:51:42
* @LastEditTime: 2024-08-03 20:35:36
* @FilePath: /data-table/src/components/OrgPickerField/MyComponent.vue
* @Description: 树形组件
-->
......@@ -709,7 +709,7 @@ useCustomFieldValue(() => tree_select_value.value);
}
:deep(.van-field__body) {
border: 1px solid #eaeaea;
border: var(--border-style);
border-radius: 0.25rem;
padding: 0.25rem 0.5rem;
}
......
<!--
* @Date: 2022-09-02 10:46:03
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-06-06 16:58:14
* @LastEditTime: 2024-08-03 20:35:41
* @FilePath: /data-table/src/components/PhoneField/index.vue
* @Description: 手机输入框
-->
......@@ -167,7 +167,7 @@ const blurKeyboard = () => {
}
:deep(.van-field__body) {
border: 1px solid #eaeaea;
border: var(--border-style);
border-radius: 0.25rem;
padding: 0.25rem 0.5rem;
input {
......
<!--
* @Date: 2022-08-30 13:46:51
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-07-26 22:16:14
* @LastEditTime: 2024-08-03 20:35:47
* @FilePath: /data-table/src/components/PickerField/index.vue
* @Description: 单列选择器组件
-->
......@@ -61,7 +61,7 @@ const onActive = (val) => {
}
:deep(.van-cell--clickable) {
border: 1px solid #eaeaea;
border: var(--border-style);
border-radius: 0.25rem;
padding: 0.25rem 0.5rem;
margin-top: 0.5rem;
......
<!--
* @Date: 2022-08-30 11:34:19
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-07-31 10:41:40
* @LastEditTime: 2024-08-03 20:35:59
* @FilePath: /data-table/src/components/RadioField/index.vue
* @Description: 单项选择控件
-->
......@@ -190,13 +190,13 @@ const rule_content = ref("");
}
.radio-wrapper {
border: 1px solid #eaeaea;
border: var(--border-style);
border-radius: 0.25rem;
padding: 0.25rem 0.5rem;
margin-bottom: 0.25rem;
}
.affix-input {
border: 1px solid #eaeaea;
border: var(--border-style);
border-radius: 0.25rem;
padding: 0.25rem 0.5rem;
margin-top: 0.5rem;
......@@ -237,16 +237,10 @@ const rule_content = ref("");
}
}
.multi-rule-field-box {
border: 1px solid #eaeaea;
border: var(--border-style);
border-radius: 0.25rem;
padding: 1rem 0.5rem 0 0.5rem;
// width: 100vw;
margin-bottom: 0.5rem;
}
:deep(.van-radio) {
// border: 1px solid #eaeaea;
// border-radius: 0.25rem;
// padding: 0.25rem 0.5rem;
}
</style>
......
<!--
* @Date: 2023-03-29 17:44:24
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-06-17 16:46:50
* @LastEditTime: 2024-08-03 20:36:11
* @FilePath: /data-table/src/components/SignField/MyComponent.vue
* @Description: 文件描述
-->
......@@ -254,7 +254,7 @@ defineExpose({ handleReset, show_control });
box-sizing: border-box;
.sign-wrapper {
border: 1px solid #eaeaea;
border: var(--border-style);
border-radius: 5px;
background: #fcfcfc !important;
}
......
<!--
* @Date: 2024-07-12 13:28:27
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-08-01 17:54:41
* @LastEditTime: 2024-08-02 13:51:12
* @FilePath: /data-table/src/components/TEditor/index.vue
* @Description: 文件描述
-->
......@@ -206,7 +206,6 @@ const tinymceOptions = {
// plugins: 'searchreplace autoresize link image code',
plugins: 'searchreplace autoresize link image code table',
autoresize_bottom_margin: 100,
image_title: true,
menubar: 'edit view insert format tools',
// fontselect fontsizeselect
toolbar: 'table', // 工具栏显示
......
<!--
* @Date: 2022-08-29 14:31:20
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-08-01 11:50:02
* @LastEditTime: 2024-08-03 20:36:31
* @FilePath: /data-table/src/components/TextField/index.vue
* @Description: 单行文本输入框(微信扫描功能)
-->
......@@ -126,7 +126,7 @@ const clickRightIcon = async () => {
}
:deep(.van-field__body) {
border: 1px solid #eaeaea;
border: var(--border-style);
border-radius: 0.25rem;
padding: 0.25rem 0.5rem;
}
......
<!--
* @Date: 2022-08-29 14:31:20
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-07-26 22:13:05
* @LastEditTime: 2024-08-03 20:36:23
* @FilePath: /data-table/src/components/TextareaField/index.vue
* @Description: 多行文本输入框
-->
......@@ -65,13 +65,8 @@ onMounted(() => {
}
}
// :deep(.van-field__body) {
// border: 1px solid #eaeaea;
// border-radius: 0.25rem;
// padding: 0.25rem 0.5rem;
// }
:deep(.van-cell__value) {
border: 1px solid #eaeaea;
border: var(--border-style);
border-radius: 0.25rem;
padding: 0.25rem 0.5rem;
}
......
<!--
* @Date: 2022-08-31 11:45:30
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-06-13 15:54:33
* @LastEditTime: 2024-08-03 20:36:39
* @FilePath: /data-table/src/components/TimePickerField/index.vue
* @Description: 时间选择组件
-->
......@@ -139,7 +139,7 @@ const rules = [{ validator, message: validatorMessage }];
}
:deep(.van-cell--clickable) {
border: 1px solid #eaeaea;
border: var(--border-style);
border-radius: 0.25rem;
padding: 0.25rem 0.5rem;
margin-top: 0.5rem;
......
<!--
* @Date: 2022-08-30 11:34:19
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-07-31 10:42:16
* @LastEditTime: 2024-08-03 20:36:47
* @FilePath: /data-table/src/components/VolunteerGroupField/index.vue
* @Description: 义工组别选择控件
-->
......@@ -165,13 +165,13 @@ const rule_content = ref("");
}
.radio-wrapper {
border: 1px solid #eaeaea;
border:var(--border-style);
border-radius: 0.25rem;
padding: 0.25rem 0.5rem;
margin-bottom: 0.25rem;
}
.affix-input {
border: 1px solid #eaeaea;
border: var(--border-style);
border-radius: 0.25rem;
padding: 0.25rem 0.5rem;
margin-top: 0.5rem;
......@@ -212,16 +212,10 @@ const rule_content = ref("");
}
}
.multi-rule-field-box {
border: 1px solid #eaeaea;
border: var(--border-style);
border-radius: 0.25rem;
padding: 1rem 0.5rem 0 0.5rem;
// width: 100vw;
margin-bottom: 0.5rem;
}
:deep(.van-radio) {
// border: 1px solid #eaeaea;
// border-radius: 0.25rem;
// padding: 0.25rem 0.5rem;
}
</style>
......
<!--
* @Date: 2022-07-18 10:22:22
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-08-03 19:23:20
* @LastEditTime: 2024-08-03 20:33:17
* @FilePath: /data-table/src/views/index.vue
* @Description: 首页
-->
......@@ -801,6 +801,13 @@ onMounted(async () => {
const width = $('body').width();
// 固定表单宽度
$('.table-box').css('width', (width - 30) + 'px');
// TAG：表单样式统一修改
// 详情页表单的border去掉
if (page_type === 'info') {
nextTick(() => {
document.documentElement.style.setProperty('--border-style', '0');
})
}
});
// 打开轮询用户是否关注
......@@ -1277,6 +1284,10 @@ const onSubmit = async (values) => {
--van-floating-bubble-background: #C2915F;
}
:root {
--border-style: 1px solid #eaeaea;
}
.table-title {
padding: 1rem;
font-size: 1.15rem;
......