[update 表单] 必填边框颜色冲突、关闭表单自动填充

This commit is contained in:
danshihao
2024-04-26 18:01:27 +08:00
parent d16d224c36
commit b8ef2648b3
8 changed files with 45 additions and 37 deletions
-7
View File
@@ -19,13 +19,6 @@
font-style: normal;
}
@font-face {
font-family: 'DingTalk JinBuTi';
src: url('~@assets/font/Alibaba-PuHuiTi-Regular.ttf');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'UnidreamLED';
src: url('~@assets/font/UnidreamLED.ttf');
+33 -18
View File
@@ -92,6 +92,7 @@
.ant-table.ant-table-fixed-header > .ant-table-content > .ant-table-scroll > .ant-table-body,
.ant-table .ant-table-tbody {
background: #001125;
font-family: Rubik, Rubik, sans-serif;
}
.ant-table .ant-table-header,
.ant-table .ant-table-thead,
@@ -222,14 +223,19 @@ input.ant-input,
textarea.ant-input {
background-color: transparent;
transition: all .3s;
&:hover:not([disabled]) {
border-color: rgba(143,199,255,0.65);
box-shadow: 0 0 0 1px rgba(143,199,255,0.65) inset;
}
&:focus:not([disabled]) {
border-color: @primary-color;
box-shadow: 0 0 0 1px @primary-color inset;
}
// 没有提示必填的才会有样式
.ant-form-item-control:not(.has-error) {
input.ant-input,
textarea.ant-input {
&:hover:not([disabled]) {
border-color: rgba(143,199,255,0.65);
box-shadow: 0 0 0 1px rgba(143,199,255,0.65) inset;
}
&:focus:not([disabled]) {
border-color: @primary-color;
box-shadow: 0 0 0 1px @primary-color inset;
}
}
}
.ant-input-affix-wrapper:hover input.ant-input:not(.ant-input-disabled),
@@ -278,21 +284,30 @@ textarea.ant-input {
background-color: transparent;
transition: all .3s;
}
.ant-select-selection:hover {
border-color: rgba(143,199,255,0.65);
box-shadow: 0 0 0 1px rgba(143,199,255,0.65) inset;
}
.ant-select-focused .ant-select-selection,
.ant-select-selection:focus,
.ant-select-selection:active {
border-color: @primary-color;
box-shadow: 0 0 0 1px @primary-color inset;
}
&.ant-select-open .ant-select-selection {
border-color: @primary-color;
box-shadow: 0 0 0 1px @primary-color inset;
}
}
// 没有提示必填的才会有样式
.ant-form-item-control:not(.has-error) {
.ant-select {
.ant-select-selection:hover {
border-color: rgba(143,199,255,0.65);
box-shadow: 0 0 0 1px rgba(143,199,255,0.65) inset;
}
.ant-select-focused .ant-select-selection,
.ant-select-selection:focus,
.ant-select-selection:active {
border-color: @primary-color;
box-shadow: 0 0 0 1px @primary-color inset;
}
&.ant-select-open .ant-select-selection {
border-color: @primary-color;
box-shadow: 0 0 0 1px @primary-color inset;
}
}
}
/* 下拉框end */
/* 表单禁用样式begin */
+2 -2
View File
@@ -74,7 +74,7 @@
</div>
<div class="mb-12">
<common-card title="添加设备">
<a-form :form="deviceForm" class="custom-vertical-form manage-page-form">
<a-form :form="deviceForm" class="custom-vertical-form manage-page-form" autocomplete="off">
<div class="mb-12">
<a-form-item label="设备名称">
<a-input placeholder="请输入设备名称" :max-length="50"
@@ -118,7 +118,7 @@
</div>
<div class="mb-12">
<common-card title="添加井口">
<a-form :form="wellheadForm" class="custom-vertical-form manage-page-form">
<a-form :form="wellheadForm" class="custom-vertical-form manage-page-form" autocomplete="off">
<div class="mb-12">
<a-form-item label="所属作业区">
<a-input placeholder="请输入所属作业区" :max-length="50"
+1 -1
View File
@@ -1,7 +1,7 @@
<template>
<a-spin :spinning="loading">
<div>
<a-form :form="form" class="custom-vertical-form">
<a-form :form="form" class="custom-vertical-form" autocomplete="off">
<a-form-item style="margin-bottom: 0;">
<div class="upload-avatar-box">
<!-- <j-image-upload v-decorator="['avatar', validatorRules.avatar]"-->
@@ -93,7 +93,7 @@
<a-row type="flex">
<a-col flex="1" style="margin-right: 20px">
<common-card title="添加设备">
<a-form :form="deviceForm" class="custom-vertical-form">
<a-form :form="deviceForm" class="custom-vertical-form" autocomplete="off">
<div class="mb-20">
<a-form-item label="设备名称">
<a-input placeholder="请输入设备名称" :max-length="50"
@@ -140,7 +140,7 @@
</a-col>
<a-col flex="1">
<common-card title="添加井口">
<a-form :form="wellheadForm" class="custom-vertical-form">
<a-form :form="wellheadForm" class="custom-vertical-form" autocomplete="off">
<div class="mb-20">
<a-form-item label="所属作业区">
<a-input placeholder="请输入所属作业区" :max-length="50"
@@ -3,7 +3,7 @@
<a-row :gutter="20" type="flex" class="mb-20">
<a-col flex="556px">
<common-card title="系统设置">
<a-form :form="sysSettingForm" class="custom-vertical-form">
<a-form :form="sysSettingForm" class="custom-vertical-form" autocomplete="off">
<div class="mb-20">
<a-form-item label="服务器IP">
<a-input placeholder="请输入服务器IP" :max-length="50"
@@ -87,7 +87,7 @@
<a-row :gutter="20" type="flex">
<a-col flex="556px">
<common-card title="添加用户">
<a-form :form="addUserForm" class="custom-vertical-form">
<a-form :form="addUserForm" class="custom-vertical-form" autocomplete="off">
<a-form-item style="margin-bottom: 0;">
<div class="upload-avatar-box">
<j-image-upload v-decorator="['avatar', validatorRules.avatar]"
@@ -11,7 +11,7 @@
style="top:5%;height: 85%;overflow-y: hidden">
<a-spin :spinning="confirmLoading">
<a-form :form="form" class="custom-vertical-form flex-column-between">
<a-form :form="form" class="custom-vertical-form flex-column-between" autocomplete="off">
<a-form-item>
<div class="upload-avatar-box">
<j-image-upload v-decorator="['avatar', validatorRules.avatar]"
+4 -4
View File
@@ -478,11 +478,11 @@ export default {
}
}
/deep/.ant-input {
border: none;
border-radius: 0;
border: none !important;
box-shadow: none !important;
background: none !important;
border-bottom: 0.01rem solid rgba(0,148,255,0.4);
box-shadow: none;
border-bottom: 0.01rem solid rgba(0,148,255,0.4) !important;
border-radius: 0 !important;
height: 0.48rem;
padding-left: 0.36rem;
font-family: PingFang SC, PingFang SC, sans-serif;