Merge remote-tracking branch 'origin/main'

# Conflicts:
#	src/components/selection/StandardSelectionModal.vue
This commit is contained in:
lideqin
2023-10-08 09:30:31 +08:00
5 changed files with 588 additions and 38 deletions
+5
View File
@@ -794,6 +794,7 @@
color: #1D2129;
padding-left: 12px;
position: relative;
margin-top: 32px;
}
.process-part-title::before {
@@ -807,4 +808,8 @@
top: 2px;
}
.process-part-title:first-child{
margin-top: 0;
}
/*流程表单样式end*/
+9
View File
@@ -40,6 +40,13 @@ export default {
getPopupContainer: {
type: Function,
default: (node) => node.parentNode
},
options: {
type: Array,
required: false,
default: () => {
return []
}
}
},
data () {
@@ -54,6 +61,8 @@ export default {
handler () {
if (this.dictCode) {
this.initDictData()
} else {
this.dictOptions = this.options
}
}
}
@@ -17,7 +17,7 @@
<j-dict-select-tag style="width: 100%" v-model="queryParam.source"
:disabled="disabledSourceSearch"
:placeholder="$t('pleaseSelect')+$t('standardSelect.source')"
:triggerChange="false" dictCode="standard_source"/>
:triggerChange="false" dictCode="standard_source" />
</a-form-item>
</a-col>
<a-col :sm="8">
@@ -27,8 +27,8 @@
</a-form-item>
</a-col>
<div style="float: right;overflow: hidden;margin-right: 41px;margin-bottom: 20px" class="table-page-search-submitButtons">
<a-button class="box-button" style="margin-left: 8px" @click="searchReset">{{$t('reset')}}</a-button>
<a-button class="box-button" style="margin-left: 8px" type="primary" @click="searchQuery">{{$t('query')}}</a-button>
<a-button class="box-button" style="margin-left: 8px" @click="searchReset">{{ $t('reset') }}</a-button>
<a-button class="box-button" style="margin-left: 8px" type="primary" @click="searchQuery">{{ $t('query') }}</a-button>
</div>
</a-row>
</a-form>
@@ -39,15 +39,15 @@
:scroll="{x: 900}"
:data-source="dataList"
:pagination="ipagination"
:row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange, type: changeType }"
:row-selection="{ type: type, selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
:loading="loading">
</a-table>
</div>
<div class="custom-drawer-style-bottom-btn">
<a-button @click="handleCancel" >{{$t('cancel')}}</a-button>
<a-button @click="handleSubmit" type="primary" :loading="confirmLoading">{{$t('submit')}}</a-button>
<a-button @click="handleCancel">{{ $t('cancel') }}</a-button>
<a-button @click="handleSubmit" type="primary" :loading="confirmLoading">{{ $t('submit') }}</a-button>
</div>
</a-drawer>
</template>
@@ -73,9 +73,9 @@ export default {
type: Boolean,
default: false
},
// 选择是单选还是多选
changeType: {
type: {
type: String,
required: false,
default: 'checkbox'
}
},
+6
View File
@@ -69,3 +69,9 @@ export const DynamicCataloging = {
FOREIGN_TRENDS: { text: '国外动态', value: '7' },
OTHER: { text: '其他', value: '8' }
}
// 标准法规入库/变更流程-操作类型
export const OperationType = {
ENTRY: { text: '标准法规入库', value: '1' },
CHANGE: { text: '标准法规变更', value: '2' }
}
@@ -1,38 +1,278 @@
<template>
<internal-detail-page :title="pageTitle">
<div class="process-part-title">流程信息</div>
<a-form :form="form">
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" :label="$t('standardRegulationLibrary.nodeName')">
<a-input :placeholder="$t('pleaseEnter') + $t('standardRegulationLibrary.nodeName')"
@change="event => event.target.value = event.target.value.trim()"
:maxLength="50"
v-decorator="['nodeName']" />
</a-form-item>
</a-form>
<internal-detail-page :title="pageTitle" :content-padding="0">
<div class="scroll-content">
<div class="process-part-title">流程信息</div>
<a-form :form="processInfoForm">
<a-row>
<a-col :span="12">
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" :label="$t('standardRegulationLibrary.nodeName')">
<a-input :placeholder="$t('pleaseEnter') + $t('standardRegulationLibrary.nodeName')"
@change="event => event.target.value = event.target.value.trim()"
:maxLength="50"
v-decorator="['nodeName']" />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" :label="$t('standardRegulationLibrary.nodeName')">
<a-date-picker class="box-input"
:placeholder="$t('pleaseSelect')"
:getCalendarContainer="(trigger) => trigger.parentNode"
format="YYYY-MM-DD"
value-format="YYYY-MM-DD"
style="width: 100%" />
</a-form-item>
</a-col>
</a-row>
<a-form-item :labelCol="longLabelCol" :wrapperCol="longWrapperCol" :label="$t('standardRegulationLibrary.nodeName')">
<a-input :placeholder="$t('pleaseEnter') + $t('standardRegulationLibrary.nodeName')"
@change="event => event.target.value = event.target.value.trim()"
:maxLength="500"
type="textarea"
v-decorator="['nodeName']" />
</a-form-item>
</a-form>
<div class="process-part-title">业务基本信息</div>
<collapsible-panel-form ref="addForm"
:flag="StandardSource.DOMESTIC.value"
:get-form-func="getFormFunc"
:get-document-info-func="getDocumentInfoFunc"
:special-placeholder="specialPlaceholder"
:default-value="defaultValue"
:disabled-field-list="disabledField"
@submitFormData="submitFormData" />
<div class="process-part-title">业务基本信息</div>
<a-form-model :model="basicFormInfo" v-if="isFormInline" class="form-add" :rules="rules" ref="ruleForm">
<template v-for="(val,index) in formList">
<div :key="index"
class="collapsible-panel-form"
v-if="(val && val.length > 0) || ((!val || val.length === 0) && formPartList.indexOf(index) === 0)">
<div class="collapsible-panel-form-header">
<span>{{ index }}</span>
<div class="retractable-btn" @click="handleChangeRetractable(index)">
<a-icon type="double-right" :class="retractableFlag[index] ? 'pack-up-btn' : 'unfold-btn'" />
{{ retractableFlag[index] ? '收起' : '展开' }}
</div>
</div>
<div class="form-flex-box collapsible-panel-form-content" v-show="retractableFlag[index]">
<template v-if="formPartList.indexOf(index) === 0">
<!--来源-->
<div class="box-title-text form-flex-item">
<div class="title-text">
<span class="required">*</span>
<span class="title-text-text" :title="$t('standardSelect.source')">{{ $t('standardSelect.source') }}</span>
</div>
<a-form-model-item class="item-model" prop="source">
<j-dict-select-tag class="box-input"
v-model="basicFormInfo.source"
:disabled="disabled || disabledFieldList.includes('source')"
:placeholder="$t('pleaseSelect')+$t('standardSelect.source')"
:type="'select'"
:triggerChange="false"
:options="sourceOptions"
@change="handleSourceChange" />
</a-form-model-item>
</div>
<!--操作类型-->
<div class="box-title-text form-flex-item">
<div class="title-text">
<span class="required">*</span>
<span class="title-text-text" :title="$t('log.operationType')">{{ $t('log.operationType') }}</span>
</div>
<a-form-model-item class="item-model" prop="operationType">
<j-dict-select-tag class="box-input"
v-model="basicFormInfo.operationType"
:disabled="disabled || disabledFieldList.includes('operationType')"
:placeholder="$t('pleaseSelect')+$t('log.operationType')"
:type="'select'"
:triggerChange="false"
dict-code="operation_type"
@change="handleOperationTypeChange" />
</a-form-model-item>
</div>
</template>
<template v-for="(item, index) in val">
<div :key="index"
class="box-title-text form-flex-item"
:class="{'form-flex-item-line': item.fieldShowType === FieldType.STANDARD_MORE.value}"
v-if="!hiddenFieldList.includes(item.dbFieldName)">
<div class="title-text">
<span class="required" v-if="item.fieldMustInput === '1'">*</span>
<span class="title-text-text" :title="item.dbFieldTxt">{{ item.dbFieldTxt }}</span>
</div>
<a-form-model-item class="item-model" :prop="item.dbFieldName" v-if="item.dbFieldName === 'standard_number_temp'">
<!--标准单选-->
<standard-selection v-if="basicFormInfo.operationType === OperationType.CHANGE.value"
:source="basicFormInfo.source"
:disabledSourceSearch="true"
:disabled="disabled || disabledFieldList.includes(item.dbFieldName)"
type="radio"
:placeholder="$t('pleaseEnter')+item.dbFieldTxt"
v-model="basicFormInfo[item.dbFieldName]" />
<!--文本框-->
<a-input v-else
class="box-input"
:disabled="disabled || disabledFieldList.includes(item.dbFieldName)"
v-model="basicFormInfo[item.dbFieldName]"
:maxLength="50"
:placeholder="specialPlaceholder[item.dbFieldName] || $t('pleaseEnter')+item.dbFieldTxt" />
</a-form-model-item>
<a-form-model-item class="item-model" :prop="item.dbFieldName" v-else>
<!-- 1, 日期单选 -->
<a-date-picker v-if="item.fieldShowType === FieldType.DATE_SINGLE.value"
class="box-input"
:placeholder="$t('pleaseSelect')+item.dbFieldTxt"
:getCalendarContainer="(trigger) => trigger.parentNode"
format="YYYY-MM-DD"
value-format="YYYY-MM-DD"
v-model="basicFormInfo[item.dbFieldName]"
:disabled="disabled || disabledFieldList.includes(item.dbFieldName)"
style="width: 100%" />
<!-- 2, 单选用户 -->
<user-selection v-else-if="item.fieldShowType === FieldType.USER_SINGLE.value"
:placeholder="$t('pleaseSelect')+item.dbFieldTxt"
v-model="basicFormInfo[item.dbFieldName]"
:filedName="item.dbFieldName"
@nameChange="userSelectNameChange"
:nameStr="basicFormInfo[item.dbFieldName + '_dictText']"
type="radio"
:disabled="disabled || disabledFieldList.includes(item.dbFieldName)" />
<!-- 3, 单选组织机构 -->
<j-select-depart v-else-if="item.fieldShowType === FieldType.ORGAN_SINGLE.value"
v-model="basicFormInfo[item.dbFieldName]"
:backDepart="true" />
<!-- 4, 日期多选 -->
<j-multiple-date-picker v-else-if="item.fieldShowType === FieldType.DATE_MORE.value"
class="box-input"
v-model="basicFormInfo[item.dbFieldName]"
:fieldName="item.dbFieldName"
:disabled="disabled || disabledFieldList.includes(item.dbFieldName)" />
<!-- 5, 多行文本 -->
<a-textarea v-else-if="item.fieldShowType === FieldType.TEXTAREA.value"
:placeholder="$t('pleaseEnter')+item.dbFieldTxt"
:disabled="disabled || disabledFieldList.includes(item.dbFieldName)"
:maxLength="500"
v-model="basicFormInfo[item.dbFieldName]" :rows="4" />
<!-- 6, 标准多选 -->
<standard-selection v-else-if="item.fieldShowType === FieldType.STANDARD_MORE.value"
:source="basicFormInfo.source"
:disabledSourceSearch="true"
:disabled="disabled || disabledFieldList.includes(item.dbFieldName)"
v-model="basicFormInfo[item.dbFieldName]" />
<!-- 7, 多选组织机构 -->
<j-select-depart v-else-if="item.fieldShowType === FieldType.ORGAN_MORE.value"
v-model="basicFormInfo[item.dbFieldName]"
:multi="true"
:backDepart="true"
:treeOpera="true" />
<!-- 8, 上传文件 -->
<a-button v-else-if="item.fieldShowType === FieldType.FILE_UP.value" type="primary" class="button-text"
@click="clickButtonToUpload(item)">
{{
(basicFormInfo[item.dbFieldName] === 'null' || basicFormInfo[item.dbFieldName] === ''
|| basicFormInfo[item.dbFieldName] === null || basicFormInfo[item.dbFieldName] === undefined)
? $t('uploadFile.clickUpload')
: $t('uploadFile.viewUploadedFiles')
}}
</a-button>
<!-- 9, 文本框 -->
<a-input v-else-if="item.fieldShowType === FieldType.TEXT_BOX.value"
class="box-input"
:disabled="disabled || disabledFieldList.includes(item.dbFieldName)"
v-model="basicFormInfo[item.dbFieldName]"
:maxLength="50"
:placeholder="specialPlaceholder[item.dbFieldName] || $t('pleaseEnter')+item.dbFieldTxt" />
<!-- 10, 下拉单选数据字典 -->
<j-dict-select-tag v-else-if="item.fieldShowType === FieldType.OPTION_SINGLE.value"
class="box-input"
v-model="basicFormInfo[item.dbFieldName]"
:disabled="disabled || disabledFieldList.includes(item.dbFieldName)"
:placeholder="$t('pleaseSelect')+item.dbFieldTxt"
:type="'select'"
:triggerChange="false"
:dictCode="item.dictField" />
<!-- 11, 下拉多选数据字典 -->
<j-multi-select-tag v-else-if="item.fieldShowType === FieldType.OPTION_MORE.value"
class="box-input"
v-model="basicFormInfo[item.dbFieldName]"
:disabled="disabled || disabledFieldList.includes(item.dbFieldName)"
:placeholder="$t('pleaseSelect')+item.dbFieldTxt"
:type="'select'"
:triggerChange="false"
:dictCode="item.dictField" />
<!-- 12, 树选择 -->
<a-tree-select
v-else-if="item.fieldShowType === FieldType.TREE.value"
v-model="basicFormInfo[item.dbFieldName]"
:getPopupContainer="triggerNode=> triggerNode.parentNode"
style="width: 100%"
:disabled="disabled || disabledFieldList.includes(item.dbFieldName)"
:tree-data="optionsData[item.dbFieldName]"
tree-checkable
treeCheckStrictly
:label-in-value="false"
:placeholder="$t('pleaseSelect')+item.dbFieldTxt" />
<!-- 14, 年份选择 -->
<j-date v-else-if="item.fieldShowType === FieldType.YEAR_PICKER.value"
show-type="year"
:disabled="disabled || disabledFieldList.includes(item.dbFieldName)"
v-model="basicFormInfo[item.dbFieldName]"
:default-value="defaultValue[item.dbFieldName]"
date-format="YYYY"
:placeholder="$t('pleaseSelect')+item.dbFieldTxt" />
<!-- 15, 树选择单选 -->
<a-tree-select v-else-if="item.fieldShowType === FieldType.TREE_SINGLE.value"
v-model="basicFormInfo[item.dbFieldName]"
:getPopupContainer="triggerNode=> triggerNode.parentNode"
style="width: 100%"
:disabled="disabled || disabledFieldList.includes(item.dbFieldName)"
:tree-data="optionsData[item.dbFieldName]"
:label-in-value="false"
:placeholder="$t('pleaseSelect')+item.dbFieldTxt" />
</a-form-model-item>
</div>
</template>
</div>
</div>
</template>
</a-form-model>
<div class="process-part-title">流程审批信息</div>
<a-form :form="approvalInfoForm">
<!--备注-->
<a-form-item :labelCol="longLabelCol" :wrapperCol="longWrapperCol" :label="$t('remarks')">
<a-input :placeholder="$t('pleaseEnter') + $t('remarks')"
@change="event => event.target.value = event.target.value.trim()"
:maxLength="500"
type="textarea"
v-decorator="['remarks']" />
</a-form-item>
<!--附件-->
<a-form-item :labelCol="longLabelCol" :wrapperCol="longWrapperCol" :label="$t('businessSupport.questionAnswer.attach')">
<j-upload v-decorator="['file']" return-id />
</a-form-item>
</a-form>
</div>
<div class="bottom-operate-box">
<!--保存-->
<a-button type="primary" :loading="loading" @click="handleSave">{{ $t('preservation') }}</a-button>
<!--提交-->
<a-button type="primary" :loading="loading" @click="handleSubmit">{{ $t('submit') }}</a-button>
</div>
<upload-file ref="uploadFile" @change="uploadFileChange" :return-url="false"></upload-file>
</internal-detail-page>
</template>
<script>
import InternalDetailPage from '../../../components/InternalDetailPage.vue'
import CollapsiblePanelForm from '../../../components/CollapsiblePanelForm.vue'
import { StandardSource } from '../../../enums/commonEnums.js'
import { getDomesticStandardDocumentInfo, getDomesticStandardFormModal } from '../../../api/standardRegulationLibraryApi.js'
import { FieldType, StandardSource, OperationType } from '../../../enums/commonEnums.js'
import { getDomesticStandardDocumentInfo, getDomesticStandardFormModal, getOverseasStandardForm } from '../../../api/standardRegulationLibraryApi.js'
import { getAction } from '../../../api/manage.js'
import { ajaxGetDictItems, getFormDictTreeList } from '../../../api/api.js'
import JMultipleDatePicker from '../../../components/JMultipleDatePicker.vue'
import UserSelection from '../../../components/selection/UserSelection.vue'
import StandardSelection from '../../../components/selection/StandardSelection.vue'
import UploadFile from '../../../components/UploadFile.vue'
export default {
name: 'StandardEntryOrChangeProcess',
components: { InternalDetailPage, CollapsiblePanelForm },
components: { UploadFile, StandardSelection, UserSelection, JMultipleDatePicker, InternalDetailPage },
data () {
return {
FieldType,
OperationType,
labelCol: {
xs: { span: 24 },
sm: { span: 4 }
@@ -41,7 +281,16 @@ export default {
xs: { span: 24 },
sm: { span: 20 }
},
StandardSource,
longLabelCol: {
xs: { span: 24 },
sm: { span: 2 }
},
longWrapperCol: {
xs: { span: 24 },
sm: { span: 22 }
},
// 流程信息表单
processInfoForm: this.$form.createForm(this),
getFormFunc: getDomesticStandardFormModal,
getDocumentInfoFunc: getDomesticStandardDocumentInfo,
// 特殊的placeholder
@@ -50,15 +299,33 @@ export default {
},
defaultValue: {
year_number: new Date().getFullYear() + ''
}
},
// 业务基本信息的字段
formList: {},
// 业务基本信息有几个部分
formPartList: [],
formListArr: [], // 所有的字段
optionsData: {}, // 用接口获取到的下拉数据
retractableFlag: {}, // 面板展开收起的标识
isFormInline: false,
rules: {},
// 业务基本信息表单
basicFormInfo: {},
// 需要隐藏的字段
hiddenFieldList: [],
disabled: false,
uploadName: '',
sourceOptions: [],
approvalInfoForm: this.$form.createForm(this),
loading: false
}
},
computed: {
pageTitle () {
return `流程中心——${this.$route.meta.title}(法规工程师发起)`
return `${this.$t('flowCenter')}${this.$route.meta.title}(法规工程师发起)`
},
// 不可编辑的字段
disabledField () {
disabledFieldList () {
if (this.isEdit) {
// 标准编号,被代替标准号,被引用标准号,标准类别,年代号
return ['standard_number_temp', 'replaced_by_standard_number', 'referenced_standard', 'standard_class', 'year_number']
@@ -66,15 +333,278 @@ export default {
return ['replaced_by_standard_number', 'referenced_standard']
}
},
created () {
if (this.$route.query.id) {
this.disabled = true
}
this.getSourceOptions()
// 默认选中国内
this.initDomesticStandardForm()
},
methods: {
// 表单提交的回调,获取表单数据
submitFormData (formInline) {
console.log(formInline)
getSourceOptions () {
ajaxGetDictItems('standard_source').then(res => {
if (res.success) {
this.sourceOptions = (res.result || []).filter(tt => tt.value === StandardSource.DOMESTIC.value || tt.value === StandardSource.OVERSEAS.value)
}
})
},
/**
* 获取国内标准的表单
*/
initDomesticStandardForm () {
const params = {
module: StandardSource.DOMESTIC.value,
type: 2 // 2是新增;1是详情
}
this.basicFormInfo = {}
getDomesticStandardFormModal(params).then(res => {
if (res.success) {
this.formList = res.result || {}
this.formListArr = Object.values(this.formList).reduce((acc, cur) => acc.concat(cur), [])
this.formPartList = Object.keys(this.formList)
this.basicFormInfo.source = StandardSource.DOMESTIC.value
this.getOptionsData() // 处理通过接口获取的下拉数据
this.integrateData() // 处理表单验证
this.initRetractableFlag() // 处理面板展开
}
})
},
initOverseasStandardForm () {
const params = {
module: StandardSource.OVERSEAS.value,
type: 2 // 2是新增;1是详情
}
this.basicFormInfo = {}
getOverseasStandardForm(params).then(res => {
if (res.success) {
this.formList = res.result || {}
this.formListArr = Object.values(this.formList).reduce((acc, cur) => acc.concat(cur), [])
this.formPartList = Object.keys(this.formList)
this.basicFormInfo.source = StandardSource.OVERSEAS.value
this.getOptionsData() // 处理通过接口获取的下拉数据
this.integrateData() // 处理表单验证
this.initRetractableFlag() // 处理面板展开
}
})
},
/**
* 默认所有面板都是展开状态
*/
initRetractableFlag () {
this.retractableFlag = {}
this.formPartList.forEach(key => {
this.retractableFlag[key] = true
})
this.$forceUpdate()
},
/**
* 处理需要通过接口获取的下拉数据
*/
getOptionsData () {
this.formListArr.forEach(item => {
if (item.fieldShowType === FieldType.TREE.value || item.fieldShowType === FieldType.TREE_SINGLE.value) {
// 展示类型是树选择,且有接口的
if (item.fieldHref) {
getAction(item.fieldHref).then(res => {
if (res.success) {
this.$set(this.optionsData, item.dbFieldName, res.result)
}
})
} else if (item.dictId) {
getFormDictTreeList({ dictId: item.dictId }).then(res => {
if (res.success) {
this.$set(this.optionsData, item.dbFieldName, res.result)
}
})
}
}
})
},
/**
* 处理表单验证
*/
integrateData () {
this.isFormInline = false
const rules = {}
this.formListArr.forEach((res, index) => {
const rule = []
if (res.fieldMustInput === '1') {
if ([FieldType.TEXT_BOX.value, FieldType.TEXTAREA.value, FieldType.TEXT_LINK.value].includes(res.fieldShowType)) {
rule.push({
required: true,
message: res.dbFieldTxt + this.$t('cannotEmpty'),
trigger: 'blur'
})
} else if (res.fieldShowType === FieldType.DATE_SINGLE.value) {
// 解决第一次校验不消失的问题
rule.push({
required: true,
message: res.dbFieldTxt + this.$t('cannotEmpty'),
trigger: ['change', 'blur']
})
} else {
rule.push({
required: true,
message: res.dbFieldTxt + this.$t('cannotEmpty'),
trigger: 'change'
})
}
}
if (rule.length > 0) {
rules[res.dbFieldName] = rule
}
})
this.rules = rules
this.isFormInline = true
},
/**
* 面板展开收起
* @param key
*/
handleChangeRetractable (key) {
this.$set(this.retractableFlag, key, !this.retractableFlag[key])
this.$forceUpdate()
},
/**
* 选择用户得到用户名
* @param value
* @param fieldName
*/
userSelectNameChange (value, fieldName) {
this.basicFormInfo[fieldName + '_dictText'] = value
},
/**
* 点击点击上传按钮
* @param item
*/
clickButtonToUpload (item) {
this.$refs.uploadFile.open(this.basicFormInfo[item.dbFieldName])
this.uploadName = item.dbFieldName
},
/**
* 文件上传改变后的回调
* @param data
*/
uploadFileChange (data) {
const attIdList = []
if (data && data.length > 0) {
data.map(item => {
attIdList.push(item.id)
})
}
/** 赋值给当前对应的表单文件 */
this.basicFormInfo[this.uploadName] = attIdList.join(',')
this.basicFormInfo = { ...this.basicFormInfo }
},
/**
* 来源变更,重新获取表单
*/
handleSourceChange () {
switch (this.basicFormInfo.source) {
case StandardSource.DOMESTIC.value:
this.initDomesticStandardForm()
break
case StandardSource.OVERSEAS.value:
this.initOverseasStandardForm()
break
default:
this.basicFormInfo.source = StandardSource.DOMESTIC.value
this.initDomesticStandardForm()
break
}
},
handleOperationTypeChange () {
console.log(this.basicFormInfo.operationType)
},
handleSave () {
},
handleSubmit () {
}
}
}
</script>
<style scoped lang="less">
/deep/ .ant-form-item-children {
width: 100%;
display: inline-block;
}
.form-flex-box {
display: flex;
flex-wrap: wrap;
}
.form-flex-item-line {
width: 100%;
}
.collapsible-panel-form {
margin-top: 20px;
&-header {
height: 56px;
line-height: 56px;
background: rgba(245, 245, 245, 0.6);
border-radius: 8px 8px 0 0;
border: 1px solid #E5E6EB;
padding: 0 20px;
font-size: 16px;
font-family: PingFang SC-Medium, PingFang SC, sans-serif;
font-weight: 600;
color: #1D2129;
display: flex;
justify-content: space-between;
.retractable-btn {
cursor: pointer;
font-size: 14px;
font-family: PingFang SC-Regular, PingFang SC, sans-serif;
color: #D52C26;
}
.anticon {
margin-right: 8px;
}
.pack-up-btn {
transform: rotate(-90deg);
}
.unfold-btn {
transform: rotate(90deg);
}
}
&-content {
border: 1px solid #E5E6EB;
border-top: none;
border-radius: 0 0 8px 8px;
padding: 20px;
}
}
.form-flex-item {
width: calc(100% / 3);
}
.bottom-operate-box {
height: 52px;
padding: 10px 32px;
text-align: right;
.ant-btn {
margin-left: 15px;
}
}
.scroll-content {
height: calc(100% - 52px);
box-sizing: border-box;
overflow: auto;
padding: 32px;
}
</style>