ZQ/laws-sinotruk-client
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update 抽屉样式调整

Browse Source
This commit is contained in:
赵霄
2023-09-07 11:35:43 +08:00
parent 6967d4d6a4
commit f156b08ec2
4 changed files with 210 additions and 203 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/assets/less/common.less
+24 -16
View File
@@ -474,31 +474,39 @@
width: 100%; width: 100%;
} }
.ant-tree li .ant-tree-node-content-wrapper.ant-tree-node-selected {
background-color: #ffd9d1 !important;
}
/*抽屉样式修改*/ /*抽屉样式修改*/
.ant-drawer-body { .custom-drawer-style {
height: calc(100vh - 55px); height: 100%;
padding: 24px 0; overflow: auto;
.ant-spin-container { .ant-drawer-body {
height: 100%; height: calc(100% - 55px);
padding: 0;
} }
.drawer-container { &-scroll {
height: calc(100% - 52px); height: calc(100% - 61px);
overflow: auto; overflow: auto;
padding: 0 24px; padding: 24px;
} }
.drawer-footer { &-bottom-btn {
margin-top: 20px; height: 60px;
height: 32px; padding: 12px 24px;
display: flex; opacity: 1;
justify-content: center; border-top: 1px solid #E5E6EB;
text-align: right;
.ant-btn { .ant-btn {
margin-left: 30px; margin-left: 12px;
margin-bottom: 30px; }
float: right;
.ant-btn:first-child {
margin-left: 0;
} }
} }
} }
src/components/selection/StandardSelectionModal.vue
+6 -5
View File
@@ -7,8 +7,8 @@
:closable="true" :closable="true"
@close="handleCancel" @close="handleCancel"
:visible="visible" :visible="visible"
style="height: 100%;overflow: auto;padding-bottom: 53px;"> class="custom-drawer-style">
<div style="margin-bottom: 60px"> <div class="custom-drawer-style-scroll">
<div class="table-page-search-wrapper"> <div class="table-page-search-wrapper">
<a-form layout="inline" @keyup.enter.native="searchQuery"> <a-form layout="inline" @keyup.enter.native="searchQuery">
<a-row :gutter="24"> <a-row :gutter="24">
@@ -44,8 +44,8 @@
</a-table> </a-table>
</div> </div>
<div class="drawer-bootom-button"> <div class="custom-drawer-style-bottom-btn">
<a-button @click="handleCancel" style="margin-right: 16px">{{$t('cancel')}}</a-button> <a-button @click="handleCancel" >{{$t('cancel')}}</a-button>
<a-button @click="handleSubmit" type="primary" :loading="confirmLoading">{{$t('submit')}}</a-button> <a-button @click="handleSubmit" type="primary" :loading="confirmLoading">{{$t('submit')}}</a-button>
</div> </div>
</a-drawer> </a-drawer>
@@ -128,7 +128,6 @@ export default {
this.selectedRowKeys = [] this.selectedRowKeys = []
this.loading = true this.loading = true
getStandardList(query).then((res) => { getStandardList(query).then((res) => {
this.loading = false
if (res.success) { if (res.success) {
this.dataList = res.result.records this.dataList = res.result.records
this.ipagination.total = res.result.total this.ipagination.total = res.result.total
@@ -136,6 +135,8 @@ export default {
} else { } else {
this.dataList = [] this.dataList = []
} }
}).finally(() => {
this.loading = false
}) })
}, },
searchQuery () { searchQuery () {
src/views/system/tags/modules/ClauseSplittingDrawer.vue
+12 -12
View File
@@ -8,10 +8,10 @@
@close="onClose" @close="onClose"
:visible="visible" :visible="visible"
:maskClosable="false" :maskClosable="false"
style="height: 100%;overflow: auto;" class="custom-drawer-style">
>
<a-spin :spinning="confirmLoading" style="width: 100%;height:100%"> <div class="custom-drawer-style-scroll">
<div class="drawer-container"> <a-spin :spinning="confirmLoading">
<a-form-model <a-form-model
:model="form" :model="form"
:rules="validatorRules" :rules="validatorRules"
@@ -113,14 +113,14 @@
</a-form-model-item> </a-form-model-item>
</template> </template>
</a-form-model> </a-form-model>
<div class="drawer-footer"> </a-spin>
<a-button @click="handleOk" type="primary" style="margin-bottom: 0;"> </div>
{{ $t('preservation') }} <div class="custom-drawer-style-bottom-btn">
</a-button> <a-button @click="handleCancel" style="margin-bottom: 0;" :loading="confirmLoading">{{ $t('close') }}</a-button>
<a-button @click="handleCancel" style="margin-bottom: 0;">{{ $t('close') }}</a-button> <a-button @click="handleOk" type="primary" style="margin-bottom: 0;" :loading="confirmLoading">
</div> {{ $t('preservation') }}
</div> </a-button>
</a-spin> </div>
</a-drawer> </a-drawer>
</template> </template>
src/views/system/tags/modules/StandardDrawer.vue
+168 -170
View File
@@ -1,188 +1,186 @@
<!--国内法规新增字段--> <!--国内法规新增字段-->
<template> <template>
<div class="domestic-drawer-div"> <a-drawer
<a-drawer :title="title"
:title="title" :width="width"
:width="width" placement="right"
placement="right" :closable="true"
:closable="true" @close="onClose"
@close="onClose" :visible="visible"
:visible="visible" :maskClosable="false"
:maskClosable="false" class="custom-drawer-style"
style="height: 100%;overflow: auto;" >
> <div class="custom-drawer-style-scroll">
<a-spin :spinning="confirmLoading" style="width: 100%;height:100%"> <a-spin :spinning="confirmLoading">
<div class="drawer-container"> <a-form-model
<a-form-model :model="form"
:model="form" :rules="validatorRules"
:rules="validatorRules" ref="editForm"
ref="editForm" :label-col="labelCol"
:label-col="labelCol" :wrapper-col="wrapperCol"
:wrapper-col="wrapperCol" >
> <a-row>
<a-row> <!--基本信息-->
<!--基本信息--> <p class="tag-info">{{ $t('system.tag.essentialInformation') }}</p>
<p class="tag-info">{{ $t('system.tag.essentialInformation') }}</p> <a-divider dashed />
<!--所属模块-->
<a-col :span="24">
<a-form-model-item :label="$t('system.tag.module')" prop="isModel">
<a-select :placeholder="$t('pleaseSelect') + $t('system.tag.module')" disabled v-model="form.isModel">
<a-select-option v-for="item in moduleArr" :key="item.value" :value="item.value">
{{ translate(item.langKey) }}
</a-select-option>
</a-select>
</a-form-model-item>
</a-col>
<!-- 属性名称-->
<a-col :span="24">
<a-form-model-item :label="$t('system.tag.attributeName')" prop="dbFieldTxt">
<a-input
v-model="form.dbFieldTxt" :placeholder="$t('pleaseEnter') + $t('system.tag.attributeName')"
@change="event => event.target.value = event.target.value.trim()"
:maxLength="120"
></a-input>
</a-form-model-item>
</a-col>
<!-- 英文名称-->
<a-col :span="24">
<a-form-model-item :label="$t('system.tag.attributeNameEnglish')" prop="dbFieldEnName">
<a-input
v-model="form.dbFieldEnName"
:placeholder="$t('pleaseEnter') + $t('system.tag.attributeNameEnglish')"
@change="event => event.target.value = event.target.value.trim()"
:maxLength="120"
></a-input>
</a-form-model-item>
</a-col>
<!-- 字段名称-->
<a-col :span="24">
<a-form-model-item :label="$t('system.tag.fieldName')" prop="dbFieldName">
<a-input
v-model="form.dbFieldName"
:placeholder="$t('pleaseEnter') + $t('system.tag.fieldName')"
@change="event => event.target.value = event.target.value.trim()"
:maxLength="60"
></a-input>
</a-form-model-item>
</a-col>
<!-- 属性类型-->
<a-col :span="24">
<a-form-model-item :label="$t('system.tag.attributeType')" prop="fieldShowType">
<j-dict-select-tag type="list" v-model="form.fieldShowType" dictCode="field_show_type"
:placeholder="$t('pleaseSelect') + $t('system.tag.attributeType')"
:disabled="disabledEdit" />
</a-form-model-item>
</a-col>
<!--选项内容-->
<a-col :span="24" v-if="isTagContent">
<a-form-model-item :label="$t('system.tag.optionContent')" prop="dictId" key="dictId">
<template>
<a-select :placeholder="$t('pleaseSelect') + $t('system.tag.optionContent')" v-model="form.dictId">
<a-select-option v-for="item in contentOption" :key="item.id" :value="item.id">
{{ item.dictName }}
</a-select-option>
</a-select>
</template>
</a-form-model-item>
</a-col>
<!--字段长度 key 值必须加，解决验证错位的问题-->
<a-col :span="24" v-if="isLength">
<a-form-model-item :label="$t('system.tag.fieldLength')" prop="dbLength" key="dbLength">
<a-input-number v-model="form.dbLength" :min="1" :max="200"
:placeholder="$t('pleaseEnter') + $t('system.tag.fieldLength')"
style="width: 100%" :formatter="limitNumber" :parser="limitNumber" />
</a-form-model-item>
</a-col>
<!--展示顺序-->
<a-col :span="24">
<a-form-model-item :label="$t('system.tag.displayOrder')" prop="orderNum">
<a-input-number v-model="form.orderNum"
:placeholder="$t('pleaseEnter') + $t('system.tag.displayOrder')" style="width: 100%"
:min="1" :max="99999" :formatter="limitNumber" :parser="limitNumber" />
</a-form-model-item>
</a-col>
<!--是否必填-->
<a-col :span="24">
<a-form-model-item :label="$t('system.tag.required')" prop="fieldMustInput">
<j-dict-select-tag type="list" v-model="form.fieldMustInput" dictCode="yn"
:placeholder="$t('pleaseSelect') + $t('system.tag.required')" />
</a-form-model-item>
</a-col>
<template>
<!--文档库模块展示-->
<p class="tag-info">{{ $t('system.tag.documentLibraryModuleDisplay') }}</p>
<a-divider dashed /> <a-divider dashed />
<!--所属模块-->
<a-col :span="24"> <a-col :span="24">
<a-form-model-item :label="$t('system.tag.module')" prop="isModel"> <a-form-model-item :label="$t('system.tag.documentLibraryListDisplay')" prop="isShowList">
<a-select :placeholder="$t('pleaseSelect') + $t('system.tag.module')" disabled v-model="form.isModel"> <j-dict-select-tag type="list" v-model="form.isShowList" dictCode="yn"
<a-select-option v-for="item in moduleArr" :key="item.value" :value="item.value"> :placeholder="$t('system.tag.selectWhetherDisplayList')" />
{{ translate(item.langKey) }} </a-form-model-item>
</a-col>
<!--详情页展示-->
<a-col :span="24">
<a-form-model-item :label="$t('system.tag.isShowDetail')" prop="isShowForm">
<j-dict-select-tag type="list" v-model="form.isShowForm" dictCode="yn"
:placeholder="$t('system.tag.isShowDetailMessage')" />
</a-form-model-item>
</a-col>
<!--展示区域-->
<a-col :span="24">
<a-form-model-item :label="$t('system.tag.showArea')" prop="showArea">
<a-select :placeholder="$t('pleaseSelect') + $t('system.tag.showArea')" v-model="form.showArea">
<a-select-option v-for="(item) in areaOptions" :key="item.id" :value="item.id">
{{ item.showArea }}
</a-select-option> </a-select-option>
</a-select> </a-select>
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<!-- 属性名称--> <!--是否搜索-->
<a-col :span="24" v-if="isSearch">
<a-form-model-item :label="$t('system.tag.search')" prop="isQuery" key="isQuery">
<j-dict-select-tag type="list" v-model="form.isQuery" dictCode="yn"
:placeholder="$t('pleaseSelect') + $t('system.tag.search')" />
</a-form-model-item>
</a-col>
<!--是否排序-->
<a-col :span="24" v-if="isSearch">
<a-form-model-item :label="$t('system.tag.isSort')" prop="sortFlag" key="sortFlag">
<j-dict-select-tag type="list" v-model="form.sortFlag" dictCode="yn"
:placeholder="$t('pleaseSelect') + $t('system.tag.isSort')" />
</a-form-model-item>
</a-col>
</template>
<!--其它模块展示-->
<template>
<p class="tag-info">{{ $t('system.tag.displayOtherModules') }}</p>
<a-divider dashed />
<a-col :span="24"> <a-col :span="24">
<a-form-model-item :label="$t('system.tag.attributeName')" prop="dbFieldTxt"> <a-form-model-item :label="$t('system.tag.regulationsListDisplay')" prop="isShowLawsList">
<a-input <j-dict-select-tag type="list" v-model="form.isShowLawsList" dictCode="yn"
v-model="form.dbFieldTxt" :placeholder="$t('pleaseEnter') + $t('system.tag.attributeName')" :placeholder="$t('system.tag.selectDisplayListRegulations')" />
@change="event => event.target.value = event.target.value.trim()"
:maxLength="120"
></a-input>
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<!-- 英文名称--> <!--搜索中心展示-->
<a-col :span="24"> <a-col :span="24">
<a-form-model-item :label="$t('system.tag.attributeNameEnglish')" prop="dbFieldEnName"> <a-form-model-item :label="$t('system.tag.searchCenterDisplay')" prop="isShowSearch">
<a-input <j-dict-select-tag type="list" v-model="form.isShowSearch" dictCode="yn"
v-model="form.dbFieldEnName" :placeholder="$t('system.tag.selectSearchCenterDisplayed')" />
:placeholder="$t('pleaseEnter') + $t('system.tag.attributeNameEnglish')"
@change="event => event.target.value = event.target.value.trim()"
:maxLength="120"
></a-input>
</a-form-model-item> </a-form-model-item>
</a-col> </a-col>
<!-- 字段名称--> </template>
<a-col :span="24"> </a-row>
<a-form-model-item :label="$t('system.tag.fieldName')" prop="dbFieldName"> </a-form-model>
<a-input
v-model="form.dbFieldName"
:placeholder="$t('pleaseEnter') + $t('system.tag.fieldName')"
@change="event => event.target.value = event.target.value.trim()"
:maxLength="60"
></a-input>
</a-form-model-item>
</a-col>
<!-- 属性类型-->
<a-col :span="24">
<a-form-model-item :label="$t('system.tag.attributeType')" prop="fieldShowType">
<j-dict-select-tag type="list" v-model="form.fieldShowType" dictCode="field_show_type"
:placeholder="$t('pleaseSelect') + $t('system.tag.attributeType')"
:disabled="disabledEdit" />
</a-form-model-item>
</a-col>
<!--选项内容-->
<a-col :span="24" v-if="isTagContent">
<a-form-model-item :label="$t('system.tag.optionContent')" prop="dictId" key="dictId">
<template>
<a-select :placeholder="$t('pleaseSelect') + $t('system.tag.optionContent')" v-model="form.dictId">
<a-select-option v-for="item in contentOption" :key="item.id" :value="item.id">
{{ item.dictName }}
</a-select-option>
</a-select>
</template>
</a-form-model-item>
</a-col>
<!--字段长度 key 值必须加，解决验证错位的问题-->
<a-col :span="24" v-if="isLength">
<a-form-model-item :label="$t('system.tag.fieldLength')" prop="dbLength" key="dbLength">
<a-input-number v-model="form.dbLength" :min="1" :max="200"
:placeholder="$t('pleaseEnter') + $t('system.tag.fieldLength')"
style="width: 100%" :formatter="limitNumber" :parser="limitNumber" />
</a-form-model-item>
</a-col>
<!--展示顺序-->
<a-col :span="24">
<a-form-model-item :label="$t('system.tag.displayOrder')" prop="orderNum">
<a-input-number v-model="form.orderNum"
:placeholder="$t('pleaseEnter') + $t('system.tag.displayOrder')" style="width: 100%"
:min="1" :max="99999" :formatter="limitNumber" :parser="limitNumber" />
</a-form-model-item>
</a-col>
<!--是否必填-->
<a-col :span="24">
<a-form-model-item :label="$t('system.tag.required')" prop="fieldMustInput">
<j-dict-select-tag type="list" v-model="form.fieldMustInput" dictCode="yn"
:placeholder="$t('pleaseSelect') + $t('system.tag.required')" />
</a-form-model-item>
</a-col>
<template>
<!--文档库模块展示-->
<p class="tag-info">{{ $t('system.tag.documentLibraryModuleDisplay') }}</p>
<a-divider dashed />
<a-col :span="24">
<a-form-model-item :label="$t('system.tag.documentLibraryListDisplay')" prop="isShowList">
<j-dict-select-tag type="list" v-model="form.isShowList" dictCode="yn"
:placeholder="$t('system.tag.selectWhetherDisplayList')" />
</a-form-model-item>
</a-col>
<!--详情页展示-->
<a-col :span="24">
<a-form-model-item :label="$t('system.tag.isShowDetail')" prop="isShowForm">
<j-dict-select-tag type="list" v-model="form.isShowForm" dictCode="yn"
:placeholder="$t('system.tag.isShowDetailMessage')" />
</a-form-model-item>
</a-col>
<!--展示区域-->
<a-col :span="24">
<a-form-model-item :label="$t('system.tag.showArea')" prop="showArea">
<a-select :placeholder="$t('pleaseSelect') + $t('system.tag.showArea')" v-model="form.showArea">
<a-select-option v-for="(item) in areaOptions" :key="item.id" :value="item.id">
{{ item.showArea }}
</a-select-option>
</a-select>
</a-form-model-item>
</a-col>
<!--是否搜索-->
<a-col :span="24" v-if="isSearch">
<a-form-model-item :label="$t('system.tag.search')" prop="isQuery" key="isQuery">
<j-dict-select-tag type="list" v-model="form.isQuery" dictCode="yn"
:placeholder="$t('pleaseSelect') + $t('system.tag.search')" />
</a-form-model-item>
</a-col>
<!--是否排序-->
<a-col :span="24" v-if="isSearch">
<a-form-model-item :label="$t('system.tag.isSort')" prop="sortFlag" key="sortFlag">
<j-dict-select-tag type="list" v-model="form.sortFlag" dictCode="yn"
:placeholder="$t('pleaseSelect') + $t('system.tag.isSort')" />
</a-form-model-item>
</a-col>
</template>
<!--其它模块展示-->
<template>
<p class="tag-info">{{ $t('system.tag.displayOtherModules') }}</p>
<a-divider dashed />
<a-col :span="24">
<a-form-model-item :label="$t('system.tag.regulationsListDisplay')" prop="isShowLawsList">
<j-dict-select-tag type="list" v-model="form.isShowLawsList" dictCode="yn"
:placeholder="$t('system.tag.selectDisplayListRegulations')" />
</a-form-model-item>
</a-col>
<!--搜索中心展示-->
<a-col :span="24">
<a-form-model-item :label="$t('system.tag.searchCenterDisplay')" prop="isShowSearch">
<j-dict-select-tag type="list" v-model="form.isShowSearch" dictCode="yn"
:placeholder="$t('system.tag.selectSearchCenterDisplayed')" />
</a-form-model-item>
</a-col>
</template>
</a-row>
</a-form-model>
</div>
<div class="drawer-footer">
<a-button @click="handleOk" type="primary" style="margin-bottom: 0;">
{{ $t('preservation') }}
</a-button>
<a-button @click="handleCancel" style="margin-bottom: 0;">{{ $t('close') }}</a-button>
</div>
</a-spin> </a-spin>
</a-drawer> </div>
</div> <div class="custom-drawer-style-bottom-btn">
<a-button @click="handleCancel" style="margin-bottom: 0;">{{ $t('close') }}</a-button>
<a-button @click="handleOk" type="primary" style="margin-bottom: 0;">
{{ $t('preservation') }}
</a-button>
</div>
</a-drawer>
</template> </template>
<script> <script>