修改文档拆分布局问题

This commit is contained in:
qq787203167
2022-07-15 13:49:18 +08:00
parent 1d576bc57c
commit e44d653e5b
3 changed files with 91 additions and 47 deletions
+35 -2
View File
@@ -142,7 +142,40 @@
.itemModel-multi .ant-form-explain, .ant-form-extra { .itemModel-multi .ant-form-explain, .ant-form-extra {
margin-top: -10px; margin-top: -10px;
} }
.anticon-exclamation-circle{
display: none!important;
.anticon-exclamation-circle {
display: none !important;
}
.ant-select-selection--single {
height: 38px !important;
}
.ant-select-selection--multiple {
height: 38px !important;
}
.ant-select-selection__rendered {
line-height: 38px !important;
height: 38px !important;
}
.ant-select-selection--multiple .ant-select-selection__rendered > ul > li {
margin-top: 6px;
}
.ant-calendar-picker {
line-height: 38px !important;
height: 38px !important;
}
.ant-calendar-picker-input {
height: 38px !important;
}
.ant-input-number-input-wrap {
line-height: 38px !important;
height: 38px !important;
} }
</style> </style>
@@ -10,6 +10,8 @@
@close="onClose" @close="onClose"
width="900" width="900"
> >
<!-- :label-col="labelCol"-->
<!-- :wrapper-col="wrapperCol"-->
<a-spin :spinning="loading"> <a-spin :spinning="loading">
<a-form> <a-form>
<a-form-model <a-form-model
@@ -17,8 +19,6 @@
:model="formInline" :model="formInline"
:rules="rules" :rules="rules"
ref="splitEditForm" ref="splitEditForm"
:label-col="labelCol"
:wrapper-col="wrapperCol"
> >
<a-row :gutter="24" class="split-form-row"> <a-row :gutter="24" class="split-form-row">
@@ -184,6 +184,7 @@
<a-form-model-item class="itemModel" :prop="item.db_field_name"> <a-form-model-item class="itemModel" :prop="item.db_field_name">
<j-dict-select-tag v-model="formInline[item.db_field_name]" <j-dict-select-tag v-model="formInline[item.db_field_name]"
:disabled="disabled" :disabled="disabled"
class="box-input"
@input="handleInput(item.db_field_name)" @input="handleInput(item.db_field_name)"
:placeholder="$t('PleaseSelect')+item.db_field_txt" :placeholder="$t('PleaseSelect')+item.db_field_txt"
:type="'radio'" :triggerChange="false" :dictCode="item.dict_field"/> :type="'radio'" :triggerChange="false" :dictCode="item.dict_field"/>
@@ -191,7 +192,7 @@
</div> </div>
<div class="box-title-text box-tree-text" :title="item.db_field_txt" v-else-if="item.field_show_type === '0'"> <div class="box-title-text" :title="item.db_field_txt" v-else-if="item.field_show_type === '0'">
<div class="title-text"> <div class="title-text">
<span class="Required" v-if="item.field_must_input == 1">*</span> <span class="Required" v-if="item.field_must_input == 1">*</span>
<span class="title-text-text">{{item.db_field_txt}}</span> <span class="title-text-text">{{item.db_field_txt}}</span>
@@ -200,6 +201,7 @@
<a-tree-select <a-tree-select
tree-node-filter-prop="title" tree-node-filter-prop="title"
v-model="formInline[item.db_field_name]" v-model="formInline[item.db_field_name]"
class="box-input"
:getPopupContainer="triggerNode=> triggerNode.parentNode" :getPopupContainer="triggerNode=> triggerNode.parentNode"
style="width: 100%" style="width: 100%"
:tree-data="item.tree" :tree-data="item.tree"
@@ -226,7 +228,6 @@
</a-form-model-item> </a-form-model-item>
</div> </div>
</a-col> </a-col>
</a-row> </a-row>
@@ -278,10 +279,9 @@
</a-modal> </a-modal>
<!-- 类型选择弹框--> <!-- 类型选择弹框-->
<a-modal <a-modal
:title="Title" :title="$t('Add')"
class="split-title" class="split-title"
:visible="addConVisible" :visible="addConVisible"
@ok="handleOk" @ok="handleOk"
@cancel="handleCancel" @cancel="handleCancel"
> >
@@ -303,7 +303,7 @@
<!-- <span class="title-num-add">{{$t('addQuantity')}}</span>--> <!-- <span class="title-num-add">{{$t('addQuantity')}}</span>-->
<a-row :gutter="24"> <a-row :gutter="24">
<a-col :span="24"> <a-col :span="24">
<a-input-number class="title-num-edit" :min="0" :max="100" v-model="numberForm.textNumber" :placeholder="$t('enterQuantity')" :formatter="limitNumber" :parser="limitNumber" ></a-input-number> <a-input-number class="title-num-edit box-input" :min="0" :max="100" v-model="numberForm.textNumber" :placeholder="$t('enterQuantity')" :formatter="limitNumber" :parser="limitNumber" ></a-input-number>
</a-col> </a-col>
</a-row> </a-row>
</a-form-model-item> </a-form-model-item>
@@ -333,12 +333,12 @@
> >
<a-form-model-item :label="$t('numberRows')" prop="rowCount"> <a-form-model-item :label="$t('numberRows')" prop="rowCount">
<!-- <a-form-item :label="$t('numberRows')">--> <!-- <a-form-item :label="$t('numberRows')">-->
<a-input-number v-model="rowColForm.rowCount" :min="1" :max="100" :placeholder="$t('pleaseEnter')+$t('numberRows')" :formatter="limitNumber" :parser="limitNumber" style="width: 100%" /> <a-input-number class="box-input" v-model="rowColForm.rowCount" :min="1" :max="100" :placeholder="$t('pleaseEnter')+$t('numberRows')" :formatter="limitNumber" :parser="limitNumber" style="width: 100%" />
<!-- </a-form-item>--> <!-- </a-form-item>-->
</a-form-model-item> </a-form-model-item>
<a-form-model-item :label="$t('numberColumns')" prop="colCount"> <a-form-model-item :label="$t('numberColumns')" prop="colCount">
<!-- <a-form-item :label="$t('numberColumns')">--> <!-- <a-form-item :label="$t('numberColumns')">-->
<a-input-number v-model="rowColForm.colCount" :min="1" :max="100" :placeholder="$t('pleaseEnter')+$t('numberColumns')" :formatter="limitNumber" :parser="limitNumber" style="width: 100%" /> <a-input-number class="box-input" v-model="rowColForm.colCount" :min="1" :max="100" :placeholder="$t('pleaseEnter')+$t('numberColumns')" :formatter="limitNumber" :parser="limitNumber" style="width: 100%" />
<!-- </a-form-item>--> <!-- </a-form-item>-->
</a-form-model-item> </a-form-model-item>
</a-form-model> </a-form-model>
@@ -1214,7 +1214,6 @@
margin-top: 2px; margin-top: 2px;
} }
} }
.con-divider{ .con-divider{
font-size: 16px; font-size: 16px;
@@ -1310,8 +1309,21 @@
text-align: center; text-align: center;
img{ img{
} }
} }
.box-input {
/*min-width: 200px;*/
display: inline-block;
height: 38px;
margin-top: 2px;
}
.button-text {
height: 38px;
width: calc(100% - 100px);
line-height: 38px;
background: #fff;
border: 1px #00B3BE solid;
color: #00B3BE;
}
</style> </style>
<style lang="less"> <style lang="less">
@@ -1366,10 +1378,10 @@
} }
} }
.split-content{ .split-content{
.box-input .ant-input-number-input-wrap{ /*.box-input .ant-input-number-input-wrap{*/
height: 30px; /* height: 30px;*/
line-height: 30px; /* line-height: 30px;*/
} /*}*/
.ant-input-number{ .ant-input-number{
width: 100%; width: 100%;
} }
@@ -1399,15 +1411,10 @@
} }
} }
} }
.box-tree-text{ /*.box-tree-text{*/
.ant-select-selection--multiple{ /* .ant-select-selection--multiple{*/
height: 32px; /* height: 32px;*/
overflow-y: auto; /* overflow-y: auto;*/
} /* }*/
} /*}*/
.box-input .ant-select-selection__rendered {
line-height: 32px;
height: 32px;
/*overflow-y: auto;*/
}
</style> </style>
@@ -1170,17 +1170,18 @@
@import '~@assets/less/common.less'; @import '~@assets/less/common.less';
.split-detail { .split-detail {
height: 100% !important; /*height: 100% !important;*/
.split-detail-wrap { .split-detail-wrap {
display: flex; /*display: flex;*/
justify-content: space-between; /*justify-content: space-between;*/
.split-detail-left { .split-detail-left {
height: 100%; /*height: 100%;*/
min-width: 300px; width: 300px;
float: left;
padding-right: 20px; padding-right: 20px;
border-right: 1px solid #E6E7EC; /*border-right: 1px solid #E6E7EC;*/
overflow-y: auto; overflow-y: auto;
.split-detail-left-tree { .split-detail-left-tree {
@@ -1206,7 +1207,10 @@
.split-detail-right { .split-detail-right {
padding-left: 20px; padding-left: 20px;
flex: 1; width: calc(100% - 300px);
float: right;
border-left: 1px solid #E6E7EC;
/*flex: 1;*/
.split-detail-search-header { .split-detail-search-header {
margin-bottom: 20px; margin-bottom: 20px;
@@ -1385,22 +1389,22 @@
min-width: 73px !important; min-width: 73px !important;
} }
.split-detail-wrap { /*.split-detail-wrap {*/
height: 481px !important; /* height: 481px !important;*/
} /*}*/
.mainItem { /*.mainItem {*/
height: 500px; /* height: 500px;*/
} /*}*/
} }
@media screen and (min-width: 1600px) and (max-width: 2000px) { @media screen and (min-width: 1600px) and (max-width: 2000px) {
.split-detail .split-detail-wrap .split-detail-left { /*.split-detail .split-detail-wrap .split-detail-left {*/
height: 735px !important; /* height: 735px !important;*/
} /*}*/
.mainItem { /*.mainItem {*/
height: 800px !important; /* height: 800px !important;*/
} /*}*/
} }
</style> </style>