123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560 |
- <!-- 物料信息基础档案——详情 -->
- <template>
- <div class="material-details">
- <!-- 操作栏 -->
- <!-- 基本信息栏 -->
- <div v-if="activeMainTab == 'material'">
- <el-row :gutter="10" class="mb10" v-if="!updateButtonGroup">
- <!-- 新增、修改、删除、复制 -->
- <el-col :span="1.5">
- <el-button-group>
- <el-button size="small" @click="handleInster">新增</el-button>
- <el-button size="small" @click="handleBasicEdit">修改</el-button>
- <el-button size="small" @click="handleDel">删除</el-button>
- <el-button size="small" @click="handleCopy">复制</el-button>
- </el-button-group>
- </el-col>
- <!-- 查询、刷新、过滤 -->
- <el-col :span="1.5">
- <el-button-group>
- <el-dropdown size="small" @command="handleFilter">
- <el-button size="small">
- 过滤<i class="el-icon-arrow-down el-icon--right"></i>
- </el-button>
- <el-dropdown-menu slot="dropdown">
- <el-dropdown-item :command="filterCondition('stop')">显示停用</el-dropdown-item>
- <el-dropdown-item :command="filterCondition('allot')">显示已分配</el-dropdown-item>
- </el-dropdown-menu>
- </el-dropdown>
- <el-button size="small" @click="handleQuery">查询</el-button>
- <el-button size="small" @click="handleRefresh">刷新</el-button>
- </el-button-group>
- </el-col>
- <!-- 启用 -->
- <el-col :span="1.5">
- <el-button-group>
- <el-dropdown split-button size="small" @click="handleIsInvoke(true)" @command="handleIsInvoke">
- 启用
- <el-dropdown-menu slot="dropdown">
- <el-dropdown-item :command="isInvoke(true)">启用</el-dropdown-item>
- <el-dropdown-item :command="isInvoke(false)">停用</el-dropdown-item>
- </el-dropdown-menu>
- </el-dropdown>
- </el-button-group>
- </el-col>
- <!-- 申请单查询 -->
- <el-col :span="1.5">
- <el-button-group>
- <el-button size="small" @click="handleQueryForm">申请单查询</el-button>
- </el-button-group>
- </el-col>
- <!-- 导入导出 -->
- <el-col :span="1.5">
- <el-button-group>
- <el-button size="small" @click="handleImport">批量导入</el-button>
- <el-button size="small" @click="handleExport">批量导出</el-button>
- </el-button-group>
- </el-col>
- </el-row>
- <!-- 基本信息修改状态下—— 保存、保存新增、更新导入、取消 -->
- <el-row :gutter="10" class="mb10" v-else>
- <el-col :span="1.5">
- <el-button-group>
- <el-button size="small" @click="handleSave">保存</el-button>
- <el-button size="small" @click="handleSaveAdd" :disabled="true">保存新增</el-button>
- <el-button size="small" @click="handleUpdateImport">更新导入</el-button>
- </el-button-group>
- </el-col>
- <el-col :span="1.5">
- <el-button-group>
- <el-button size="small" @click="handleCancel">取消</el-button>
- </el-button-group>
- </el-col>
- </el-row>
- </div>
- <!-- 其他标签页操作 修改、删除 -->
- <el-row :gutter="10" class="mb10" v-show="activeMainTab != 'material'">
- <el-col :span="1.5">
- <el-button-group>
- <el-button size="small" @click="handleEdit">修改</el-button>
- <el-button size="small" @click="handleDel">删除</el-button>
- </el-button-group>
- <el-button-group>
- <el-button size="small" @click="handleRefresh">刷新</el-button>
- </el-button-group>
- </el-col>
- </el-row>
- <el-card>
- <!-- 返回 切换 附件管理 -->
- <el-row type="flex" justify="space-between">
- <el-col :span="6">
- <!-- :disabled="headerParam.isEdit" -->
- <el-button size="small" @click="handleBack" :disabled="updateButtonGroup">返回</el-button>
- </el-col>
- <el-col :span="6" style="text-align: right;">
- <!-- 附件管理 -->
- <el-button-group>
- <el-button size="small" icon="el-icon-paperclip" @click="handleFile"></el-button>
- </el-button-group>
- <!-- 切换 -->
- <el-button-group>
- <el-button size="small" icon="el-icon-d-arrow-left" @click="handleChangePage('first')"></el-button>
- <el-button size="small" icon="el-icon-arrow-left" @click="handleChangePage('pre')"></el-button>
- <el-button size="small" icon="el-icon-arrow-right" @click="handleChangePage('next')"></el-button>
- <el-button size="small" icon="el-icon-d-arrow-right" @click="handleChangePage('end')"></el-button>
- </el-button-group>
- </el-col>
- </el-row>
- <div class="md-content">
- <el-form :inline="true" label-position="right" :model="basicData.value">
- <!-- <el-form-item label="所属组织"></el-form-item> -->
- <el-form-item label="物料编码">
- <el-input v-model="basicData.value.code" size="small" placeholder="物料编码"></el-input>
- </el-form-item>
- <el-form-item label="物料名称">
- <el-input v-model="basicData.value.name" size="small" placeholder="物料名称"></el-input>
- </el-form-item>
- <el-form-item label="英文名称">
- <el-input v-model="basicData.value.enName" size="small" placeholder="英文名称"></el-input>
- </el-form-item>
- <!-- <el-form-item label="版本号"></el-form-item> -->
- </el-form>
- <dr-tabs :tabList="detailsTabs" :handleTabClick="handleMainTabClick">
- <template #tabContent>
- <div class="md-basic">
- <!-- 主信息 -->
- <div class="md-main">
- <!-- 基本信息展示表单 -->
- <el-form v-if="activeMainTab == 'material'" :inline="true" label-position="right"
- :hide-required-asterisk="true" :model="basicData.value">
- <el-row :gutter="10">
- <el-col :span="8" v-for="f in basicData.form" style="text-align: right;">
- <template v-if="f.show">
- <!-- :disabled="!(headerParam.isEdit && f.edit)" -->
- <!-- 多选框 -->
- <el-form-item v-if="f.attribute == 'checkbox'" style="text-align: left;">
- <el-checkbox :label="f.name" name="type" v-model="basicData.value[f.prop]"
- :disabled="!updateButtonGroup">
- </el-checkbox>
- </el-form-item>
- <!-- 下拉框 -->
- <el-form-item v-else-if="f.attribute == 'select'" :label="f.name"
- :id="(updateButtonGroup && f.apiUrl) ? 'selected' : ''">
- <el-select v-model="basicData.value[`${f.prop}Label`]" :placeholder="f.name"
- :key="basicData.value[f.prop]" :disabled="!updateButtonGroup"
- @focus="f.apiUrl && handleQueryMore(f, '', { name: 'basicData', prop: f.prop })">
- <el-option v-if="f.dictId" v-for="d in f.dictValue" :key="d.dictValue" :label="d.dictLabel"
- :value="d.dictValue">
- </el-option>
- <div slot="empty"></div>
- </el-select>
- </el-form-item>
- <el-form-item v-else-if="f.attribute == 'image'" :label="f.name">
- <el-image :src="basicData.value[f.prop]" fit="contain">
- </el-image>
- </el-form-item>
- <!--attribute 文本 数字 文本域 为null -->
- <el-form-item v-else :label="f.name">
- <el-input size="small" v-model="basicData.value[f.prop]" :type="f.attribute || 'text'"
- :readonly="!updateButtonGroup" :placeholder="f.name">
- </el-input>
- </el-form-item>
- </template>
- </el-col>
- </el-row>
- </el-form>
- <!-- 其他展示为列表 -->
- <el-table v-else :data="mainMsg.value" @cell-dblclick="handleMaindbClick"
- @selection-change="handleMainChange">
- <el-table-column type="selection" width="55" />
- <el-table-column type="index" label="序号" width="55" align="center" />
- <el-table-column v-for="m in mainMsg.form" v-if="m.show" :label="m.name" align="center" :prop="m.prop"
- show-overflow-tooltip />
- </el-table>
- </div>
- <!-- 副信息 -->
- <div class="md-vice">
- <dr-tabs v-if="activeMainTab == 'material'" :tabList="basicMessage" :handleTabClick="handleViceTabClick">
- <template #tabContent>
- <el-form v-if="activeViceTab == 'material_medcine'" :inline="true" label-position="right"
- :hide-required-asterisk="true" :model="medcineData.value" class="md-vice-content">
- <el-row :gutter="10">
- <el-col :span="8" v-for="m in medcineData.form" style="text-align: right;">
- <template v-if="m.show">
- <!-- 多选框 -->
- <el-form-item v-if="m.attribute == 'checkbox'">
- <el-checkbox :label="m.name" name="type" v-model="medcineData.value[m.prop]"
- :disabled="!updateButtonGroup">
- </el-checkbox>
- </el-form-item>
- <!-- 下拉框 -->
- <el-form-item v-else-if="m.attribute == 'select'" :label="m.name">
- <el-select v-model="medcineData.value[`${m.prop}Label`]" :placeholder="m.name"
- :key="medcineData.value[m.prop]" :disabled="!updateButtonGroup"
- @focus="m.apiUrl && handleQueryMore(m, '', { name: 'medcineData', prop: m.prop })">
- <el-option v-if="m.dictId" v-for="d in m.dictValue" :key="d.dictValue"
- :label="d.dictLabel" :value="d.dictValue">
- </el-option>
- <div slot="empty"></div>
- </el-select>
- </el-form-item>
- <!-- 图片 -->
- <el-form-item v-else-if="m.attribute == 'image'" :label="m.name">
- <el-image :src="medcineData.value[m.prop]" fit="contain">
- </el-image>
- </el-form-item>
- <!-- 文本、数字、textarae -->
- <el-form-item v-else :label="m.name">
- <el-input size="small" v-model="medcineData.value[m.prop]" :type="m.attribute || 'text'"
- :placeholder="m.name" :readonly="!updateButtonGroup">
- </el-input>
- </el-form-item>
- </template>
- </el-col>
- </el-row>
- </el-form>
- <!-- 其他展示为列表 -->
- <!-- 辅计量 -->
- <el-table v-else-if="activeViceTab == 'material_unit'" :data="unitDetails.value"
- class="material-table">
- <el-table-column type="index" label="序号" width="55" align="center" />
- <el-table-column v-for="v in unitDetails.form" v-if="v.show" :label="v.name" align="center"
- :prop="v.prop" show-overflow-tooltip />
- </el-table>
- <!-- 辅助属性 -->
- <el-table v-else-if="activeViceTab == 'material_property'" :data="propertyDetail.value"
- class="material-table">
- <el-table-column type="index" label="序号" width="55" align="center" />
- <el-table-column v-for="v in propertyDetail.form" v-if="v.show" :label="v.name" align="center"
- :prop="v.prop" show-overflow-tooltip />
- </el-table>
- </template>
- </dr-tabs>
- </div>
- <!-- 基本信息 - 审计信息 -->
- <div class="md-auditInfo" v-if="activeMainTab == 'material'">
- <el-divider content-position="left">审计信息</el-divider>
- <el-form :inline="true" label-position="right" :model="basicData.value">
- <el-form-item label="创建人">
- <el-input v-model="basicData.value.createBy" size="small" readonly placeholder="创建人"></el-input>
- </el-form-item>
- <el-form-item label="创建时间">
- <el-input v-model="basicData.value.createTime" size="small" readonly placeholder="创建时间"></el-input>
- </el-form-item>
- <el-form-item label="最后修改人">
- <el-input v-model="basicData.value.updateBy" size="small" readonly placeholder="最后修改人"></el-input>
- </el-form-item>
- <el-form-item label="最后修改时间">
- <el-input v-model="basicData.value.updateTime" size="small" readonly placeholder="最后修改时间"></el-input>
- </el-form-item>
- </el-form>
- </div>
- </div>
- </template>
- </dr-tabs>
- </div>
- </el-card>
- <!-- 操作提示弹窗 -->
- <el-dialog title="操作提示" :visible.sync="optionDialog.show" width="30%" center>
- <span>是否确认{{ optionDialog.op }}?</span>
- <span slot="footer">
- <el-button @click="handleOptionCancal">取 消</el-button>
- <el-button type="primary" @click="handleComfirmOption('cancal')">确 定</el-button>
- </span>
- </el-dialog>
- <!-- 其他页签的操作 -->
- <el-dialog :title="otherDeatils.title" :visible.sync="otherDeatils.show" show-close width="70%"
- :before-close="handleCloseOtherDetails" :close-on-press-escape="false" :close-on-click-modal="false"
- class="otherDialog">
- <div>
- <!-- 其他标签页操作 修改、删除 -->
- <el-row :gutter="10" class="mb10">
- <el-col :span="1.5" v-if="!otherDeatils.isEdit">
- <el-button-group>
- <el-button size="small" @click="handleEdit">修改</el-button>
- <el-button size="small" @click="handleDel">删除</el-button>
- </el-button-group>
- <el-button-group>
- <el-button size="small" @click="handleRefresh">刷新</el-button>
- </el-button-group>
- </el-col>
- <el-col :span="1.5" v-else>
- <el-button-group>
- <el-button size="small" @click="handleOtherSave">保存</el-button>
- <el-button size="small" @click="handleOtherCancel">取消</el-button>
- </el-button-group>
- </el-col>
- </el-row>
- <el-collapse v-model="collapseActive" @change="handleCollapseChange">
- <el-collapse-item title="物料基本信息" name="basic">
- <el-form :inline="true" label-position="right" :model="basicData.value">
- <!-- <el-form-item label="所属组织">
- <el-input v-model="basicData.value.orgName" placeholder="所属组织"></el-input>
- </el-form-item> -->
- <el-form-item label="物料编码">
- <el-input v-model="basicData.value.code" size="small" readonly placeholder="物料编码"></el-input>
- </el-form-item>
- <el-form-item label="物料名称">
- <el-input v-model="basicData.value.name" size="small" readonly placeholder="物料名称"></el-input>
- </el-form-item>
- <el-form-item label="英文名称">
- <el-input v-model="basicData.value.enName" size="small" readonly placeholder="英文名称"></el-input>
- </el-form-item>
- <!-- <el-form-item label="版本号">
- <el-input v-model="basicData.value.version" placeholder="版本号"></el-input>
- </el-form-item> -->
- </el-form>
- </el-collapse-item>
- <el-collapse-item :title="otherDeatils.title" :name="activeMainTab">
- <div class="od-msg">
- <!-- 展示表单 -->
- <el-form :inline="true" label-position="right" :hide-required-asterisk="true" :model="otherDeatils.value">
- <el-row :gutter="10">
- <el-col :span="8" v-for="f in otherDeatils.form" style="text-align: right;">
- <template v-if="f.show">
- <!-- 多选框 -->
- <el-form-item v-if="f.attribute == 'checkbox'" style="text-align: left;" class="od-msg-checkedbx">
- <el-checkbox :label="f.name" name="type" v-model="otherDeatils.value[f.prop]"
- :disabled="!(otherDeatils.isEdit && f.edit)">
- </el-checkbox>
- </el-form-item>
- <!-- 下拉框 -->
- <el-form-item v-else-if="f.attribute == 'select'" :label="f.name">
- <el-select v-model="otherDeatils.value[`${f.prop}Label`]" :placeholder="f.name"
- :key="otherDeatils.value[f.prop]" :disabled="!(otherDeatils.isEdit && f.edit)"
- @focus="f.apiUrl && handleQueryMore(f, '', { name: 'otherDeatils', prop: f.prop })">
- <el-option v-if="f.dictId" v-for="d in f.dictValue" :key="d.dictValue" :label="d.dictLabel"
- :value="d.dictValue">
- </el-option>
- <div slot="empty"></div>
- </el-select>
- </el-form-item>
- <el-form-item v-else-if="f.attribute == 'image'" :label="f.name">
- <el-image :src="otherDeatils.value[f.prop]" fit="contain">
- </el-image>
- </el-form-item>
- <!--attribute 文本 数字 文本域 为null -->
- <el-form-item v-else :label="f.name">
- <el-input size="small" v-model="otherDeatils.value[f.prop]" :type="f.attribute || 'text'"
- :placeholder="f.name" :readonly="!(otherDeatils.isEdit && f.edit)">
- </el-input>
- </el-form-item>
- </template>
- </el-col>
- </el-row>
- </el-form>
- </div>
- </el-collapse-item>
- <el-collapse-item title="审计信息" name="auditInfo">
- <!-- 基本信息 - 审计信息 -->
- <div class="md-auditInfo">
- <el-form :inline="true" label-position="right" :model="basicData.value">
- <el-form-item label="创建人">
- <el-input v-model="basicData.value.createBy" size="small" readonly placeholder="创建人"></el-input>
- </el-form-item>
- <el-form-item label="创建时间">
- <el-input v-model="basicData.value.createTime" size="small" readonly placeholder="创建时间"></el-input>
- </el-form-item>
- <el-form-item label="最后修改人">
- <el-input v-model="basicData.value.updateBy" size="small" readonly placeholder="最后修改人"></el-input>
- </el-form-item>
- <el-form-item label="最后修改时间">
- <el-input v-model="basicData.value.updateTime" size="small" readonly placeholder="最后修改时间"></el-input>
- </el-form-item>
- </el-form>
- </div>
- </el-collapse-item>
- </el-collapse>
- </div>
- </el-dialog>
- <!-- 参照弹窗 -->
- <el-dialog :title="MoreDataDialog.msg.name" :visible.sync="MoreDataDialog.show" width="70%" class="MoreDataDialog"
- :close-on-press-escape="false" :close-on-click-modal="false" :before-close="handleCloseRefer">
- <div>
- <el-row>
- <el-col :span="1.5">
- <el-input v-model="MoreDataDialog.key" placeholder="过滤" size="small" @change="handleFilterRefer" />
- </el-col>
- </el-row>
- <!-- 树形 -->
- <el-tree class="referTree" v-loading="MoreDataDialog.loading" v-if="MoreDataDialog.type == 'tree'"
- :data="MoreDataDialog.list" @node-click="handleNodeClick" :props="defaultProps" node-key="id">
- </el-tree>
- <!-- 列表 -->
- <el-table v-else :data="MoreDataDialog.list" v-loading="MoreDataDialog.loading" style="width: 100%"
- @row-click="handleCurentRow" highlight-current-row>
- <el-table-column type="index" label="序号" width="55" align="center" />
- <el-table-column v-for="m in MoreDataDialog.form" v-if="m.show" :prop="m.prop" :label="m.name" />
- </el-table>
- <!-- 按钮 -->
- <el-row class="more-button">
- <el-button round size="small" @click="handleConcalRefer">取消</el-button>
- <el-button round size="small" type="primary" @click="handleConfirmRefer">确认</el-button>
- </el-row>
- </div>
- </el-dialog>
- </div>
- </template>
- <script>
- import drTabs from '../components/dr-tabs.vue';
- import detailsTabs from '../config/detailsTabs';
- import materialApi from '@/api/material/basic';
- import { getDicts as getDicts } from '@/api/system/dict/data'
- export default {
- name: 'material-details',
- // dicts: [''],
- components: {
- drTabs
- },
- data() {
- return {
- count: 1,
- // 详情固定标签页
- detailsTabs,
- defaultProps: {
- children: 'childrens',
- label: 'name'
- },
- // 标签页当前激活状态
- activeMainTab: 'material',
- activeViceTab: 'material_medcine',
- materialId: this.$route.params.id,
- collapseActive: ['basic', '',],
- // 修改按钮 是否激活
- updateButtonGroup: false,
- // 基本信息下的页签
- basicMessage: [
- {
- label: '医药行业',
- code: 'material_medcine',
- isShow: true,
- },
- {
- label: '辅计量管理',
- code: 'material_unit',
- isShow: true,
- },
- {
- label: '辅助属性',
- code: 'material_property',
- isShow: true,
- },
- ],
- // 基本信息
- basicData: {
- value: {},
- form: []
- },
- // 医药行业
- medcineData: {
- value: {},
- form: []
- },
- // 辅助属性
- propertyDetail: {
- value: [],
- form: []
- },
- // 辅计量管理
- unitDetails: {
- value: [],
- form: []
- },
- // 主标签信息
- mainMsg: {
- form: [],
- value: [],
- checkedList: [],
- },
- // 副信息
- viceMsg: {
- form: [],
- value: []
- },
- // 操作弹窗
- optionDialog: {
- show: false,
- op: ''
- },
- // 其他页签操作弹窗
- otherDeatils: {
- show: false,
- title: '',
- // 查询关键字-物料id
- queryKey: '',
- isEdit: false,
- // 详情表头
- from: [],
- // 详情值
- value: {}
- },
- // 编辑-更多数据展示弹窗_ 参照
- MoreDataDialog: {
- loading: false,
- show: false,
- // 查询关键字
- key: '',
- // 需要查看参照的表单头信息
- msg: '',
- type: 'table',
- // 查询出的参照数据
- list: [],
- // 查询出的参照表头
- form: [],
- // 选中的参照数据
- value: '',
- // 参照最后应该赋值的地方
- target: {
- name: '',
- prop: ''
- }
- }
- }
- },
- methods: {
- // 返回
- handleBack() {
- this.$router.push({
- path: `/basic/material/basicFile`,
- });
- },
- // 附件按钮
- handleFile() {
- console.log('附件按钮');
- },
- // 改变分页情况
- handleChangePage(type) {
- switch (type) {
- case 'first':
- console.log('第一页');
- break;
- case 'pre':
- console.log('上一页');
- break;
- case 'next':
- console.log('下一页');
- break;
- case 'end':
- console.log('最后页');
- break;
- }
- },
- // 切换主信息标签
- handleMainTabClick(e) {
- this.activeMainTab = detailsTabs[e.index].code;
- this.collapseActive.splice(1, 1, this.activeMainTab);
- console.log(this.collapseActive, 'this.collapseActive');
- switch (this.activeMainTab) {
- // 基本信息
- case 'material':
- this.getTagList('material', (form) => {
- this.basicData.form = form;
- this.getMaterialDetails(this.materialId, 'material');
- })
- break;
- // 财物信息
- case 'material_finance':
- this.getTagList('material_finance', (form) => {
- this.mainMsg.form = form;
- this.getFinanceList('');
- });
- break;
- // 利润中心信息
- case 'profit_center':
- this.getTagList('profit_center', (form) => {
- this.mainMsg.form = form;
- this.getCenterList('');
- });
- break;
- // 采购信息
- case 'material_purchase':
- this.getTagList('material_purchase', (form) => {
- this.mainMsg.form = form;
- this.getPurchaseList();
- });
- break;
- // 库存信息
- case 'material_inventory':
- this.getTagList('material_inventory', (form) => {
- this.mainMsg.form = form;
- this.getInventoryList();
- });
- break;
- // 计划信息
- case 'material_plan':
- this.getTagList('material_plan', (form) => {
- this.mainMsg.form = form;
- this.getPlanList('');
- });
- break;
- // 成本信息
- case 'material_cost':
- this.getTagList('material_cost', (form) => {
- this.mainMsg.form = form;
- this.getCostList('');
- });
- break;
- default: break;
- }
- },
- // 切换副表信息
- handleViceTabClick(e) {
- console.log(this.basicMessage[e.index], '切换标签');
- this.activeViceTab = this.basicMessage[e.index].code;
- switch (this.activeViceTab) {
- // 医药行业
- case 'material_medcine':
- this.getTagList('material_medcine', (form) => {
- this.medcineData.form = form;
- this.getMedcineDetails(this.materialId, 'material_medcine');
- })
- break;
- // 辅计量管理
- case 'material_unit':
- this.getTagList('material_unit', (form) => {
- console.log(form, 'form');
- this.unitDetails.form = form;
- this.getUnitList('');
- });
- break;
- // 辅助属性
- case 'material_property':
- this.getTagList('material_property', (form) => {
- this.propertyDetail.form = form;
- this.getPropertyList('');
- });
- break;
- default:
- break;
- }
- },
- // 主标签页 列表双击
- handleMaindbClick(e) {
- console.log(e, '主标签页 列表双击');
- this.otherDeatils.queryKey = e.id;
- this.otherDeatils.show = true;
- let activeTab = this.detailsTabs.filter(item => item.code == this.activeMainTab)[0];
- console.log(activeTab, 'activeTab');
- this.otherDeatils.title = activeTab.label;
- this.getOtherListDetails(activeTab.code, this.otherDeatils.queryKey);
- },
- // 主页签 列表数据选择
- handleMainChange(e) {
- console.log(e, '主页签 列表数据选择');
- this.mainMsg.checkedList = e;
- },
- // 编辑状态下,弹窗显示查询数据
- handleQueryMore(msg, val, target) {
- this.MoreDataDialog.loading = true;
- let _this = this;
- console.log('编辑状态下,弹窗显示查询数据', msg, 'val', val, target);
- this.MoreDataDialog.show = true;
- this.MoreDataDialog.msg = msg;
- this.MoreDataDialog.target = target;
- this.getExecuteMethods(msg.apiUrl, { param: this.MoreDataDialog.key }, (data) => {
- console.log(data, '编辑状态下,弹窗显示查询数据');
- _this.MoreDataDialog.type = data.type;
- _this.MoreDataDialog.list = data.tableBody;
- if (data.type == 'tree') {
- } else {
- _this.MoreDataDialog.form = data.tableHeader;
- }
- console.log(_this.MoreDataDialog.list, 'this.MoreDataDialog.list');
- console.log(_this.MoreDataDialog.form, 'this.MoreDataDialog.form');
- })
- },
- // 根据apiUrl获取对应参照的值
- getExecuteMethods(methodName, params, cb) {
- materialApi.executeMethods(methodName, params).then(res => {
- this.MoreDataDialog.loading = false;
- if (res.code == 200) {
- cb(res.data);
- }
- })
- },
- // 获取物料基本信息详细信息
- getMaterialDetails(id, templateCode) {
- let _this = this;
- materialApi.materialDetails(
- id,
- templateCode,
- ).then(res => {
- console.log(res, '物料基本信息');
- let { code, data } = res;
- if (code == 200) {
- _this.basicData.value = data.data;
- // this.basicData.form = data.form;
- _this.handleAddReferLabel('basicData');
- }
- })
- },
- // 添加参照中的label
- handleAddReferLabel(dataName) {
- let _this = this;
- this[dataName].form.map(item => {
- // 查参照
- if (item.apiUrl && item.apiUrl != '') {
- _this.getExecuteMethods(item.apiUrl, {}, (data) => {
- let { tableBody } = data;
- let Blabel = tableBody.filter((t) => t.id == _this[dataName].value[item.prop])[0];
- _this[dataName].value[`${item.prop}Label`] = Blabel || '';
- })
- }
- })
- console.log(_this[dataName].value, '_this[dataName].value//////////////////////');
- },
- // 查询财务信息列表
- getFinanceList(materialId) {
- materialApi.financeList({ materialId }).then(res => {
- console.log(res, '查询财务信息列表');
- if (res.code == 200) {
- this.mainMsg.value = res.rows;
- }
- })
- },
- // 查询计划信息列表
- getPlanList(materialId) {
- materialApi.planList({ materialId }).then(res => {
- console.log(res, '查询计划信息列表');
- if (res.code == 200) {
- this.mainMsg.value = res.data.tableBody.rows;
- }
- })
- },
- // 查询成本信息列表
- getCostList(materialId) {
- materialApi.costList({ materialId }).then((res) => {
- console.log(res, '成本信息列表+表头');
- if (res.code == 200) {
- this.mainMsg.value = res.data.tableBody.rows;
- }
- })
- },
- // 查询利润中心列表
- getCenterList(materialId) {
- materialApi.centerList({ materialId }).then(res => {
- console.log(res, '查询利润中心信息');
- if (res.code == 200) {
- this.mainMsg.value = res.data.tableBody.rows;
- }
- })
- },
- // 查询采购中心列表
- getPurchaseList(materialId) {
- materialApi.purchaseList({ materialId }).then(res => {
- console.log(res, '查询采购中心');
- if (res.code == 200) {
- this.mainMsg.value = res.data.tableBody.rows;
- }
- })
- },
- // 获取库存信息列表
- getInventoryList(materialId) {
- materialApi.inventoryList({ materialId }).then(res => {
- console.log(res, '获取库存信息列表');
- if (res.code == 200) {
- this.mainMsg.value = res.data.tableBody.rows;
- }
- })
- },
- // 查询其他标签页列表详情
- getOtherListDetails(type, id) {
- console.log(type, id, '查询其他标签页列表详情');
- this.otherDeatils.form = this.mainMsg.form;
- console.log(this.otherDeatils.form, 'this.otherDeatils.form');
- switch (type) {
- // 财物信息
- case 'material_finance':
- this.getFinanceDetails(id);
- break;
- // 利润中心信息
- case 'profit_center':
- this.getCenterDetails(id);
- break;
- // 采购信息
- case 'material_purchase':
- this.getPurchaseDetails(id);
- break;
- // 库存信息
- case 'material_inventory':
- this.getInventoryDetails(id);
- break;
- // 计划信息
- case 'material_plan':
- this.getPlanDetails(id);
- break;
- // 成本信息
- case 'material_cost':
- this.getCostDetails(id);
- break;
- default: break;
- }
- },
- // 查询财务信息详情
- getFinanceDetails(id) {
- materialApi.financeDetails(id).then(res => {
- let _this = this;
- console.log('查询财务信息详情', res);
- if (res.code == 200) {
- this.otherDeatils.value = res.data.data;
- _this.handleAddReferLabel('otherDeatils');
- }
- })
- },
- // 获取利润中心详情
- getCenterDetails(materialId) {
- let _this = this;
- materialApi.centerDetails(materialId).then(res => {
- console.log(res, '获取利润中心详情');
- if (res.code == 200) {
- this.otherDeatils.value = res.data.data;
- _this.handleAddReferLabel('otherDeatils');
- }
- })
- },
- // 获取采购详细信息详情
- getPurchaseDetails(materialId) {
- let _this = this;
- materialApi.purchaseDetails(materialId).then(res => {
- console.log(res, '获取采购详细信息详情');
- if (res.code == 200) {
- this.otherDeatils.value = res.data.data;
- _this.handleAddReferLabel('otherDeatils');
- }
- })
- },
- // 获取成本信息详情
- getCostDetails(id) {
- let _this = this;
- materialApi.costDetails(id).then(res => {
- console.log(res, '获取成本信息详情');
- if (res.code == 200) {
- this.otherDeatils.value = res.data.data;
- _this.handleAddReferLabel('otherDeatils');
- }
- })
- },
- // 获取计划信息详情
- getPlanDetails(id) {
- let _this = this;
- materialApi.planDetails(id).then(res => {
- console.log(res, '获取计划信息详情');
- if (res.code == 200) {
- this.otherDeatils.value = res.data.data;
- _this.handleAddReferLabel('otherDeatils');
- }
- })
- },
- // 获取库存详细信息详情
- getInventoryDetails(materialId) {
- let _this = this;
- materialApi.inventoryDetails(materialId).then(res => {
- console.log(res, '获取库存详细信息详情');
- if (res.code == 200) {
- this.otherDeatils.value = res.data.data;
- _this.handleAddReferLabel('otherDeatils');
- }
- })
- },
- /* 二级标签页 */
- // 获取医药行业信息详细信息+表单属性
- getMedcineDetails(id, templateCode) {
- console.log(id, templateCode);
- materialApi.medcineDetails(
- id,
- templateCode,
- ).then((res) => {
- console.log(res, '医药行业');
- let { code, data } = res;
- if (code == 200) {
- this.medcineData.value = data.data || {};
- // this.medcineData.form = data.form;
- }
- })
- },
- // 获取物料辅助属性详细信息+表单列段属性
- getPropertyDetails(id) {
- materialApi.propertyDetails(id).then(res => {
- console.log(res, '物料辅助属性详细信息');
- if (res.code == 200) {
- this.propertyDetail.value = res.data.data || [];
- }
- })
- },
- // 查询物料辅助属性列表+表头字段
- getPropertyList() {
- materialApi.propertyList().then(res => {
- console.log(res, '料辅助属性列表');
- if (res.code == 200) {
- this.propertyDetail.value = res.data.data || [];
- }
- })
- },
- //获取辅助计量单位基本信息+表单列段属性
- getUnitDetails(materialId) {
- materialApi.unitDetails(materialId).then(res => {
- console.log(res, '辅助计量单位基本信息');
- if (res.code == 200) {
- this.unitDetails.value = res.data.data || [];
- }
- })
- },
- //获取辅计量管理列表信息+表头字段
- getUnitList() {
- materialApi.unitList().then(res => {
- console.log(res, '辅计量管理列表信息');
- if (res.code == 200) {
- this.unitDetails.value = res.data.data || [];
- }
- })
- },
- // 获取物料列表表头
- getTagList(templateCode, cb) {
- let _this = this
- materialApi.tagList({ templateCode }).then(res => {
- console.log(res, `获取${templateCode}表头`);
- let dictIdList = [];
- if (res.code == 200) {
- res.data.map(item => {
- // 查字典
- if (item.dictId && item.dictId != '') {
- // 通过接口获取有dict的对应的数据
- getDicts(item.dictId).then(dict => {
- if (dict.data) {
- item['dictValue'] = dict.data;
- }
- })
- }
- })
- // 动态更改dict
- // res.data.forEach(item => {
- // if (item.dictId) {
- // // 请求接口
- // dictIdList.push(item.dictId);
- // }
- // })
- // console.log(dictIdList, 'dictIdList');
- // _this.dict = Array.from(new Set([..._this.dict, ...dictIdList]));
- // console.log(_this.dicts, 'dicts');
- return cb(res.data);
- }
- })
- },
- // 新增
- handleInster() {
- this.$message({
- message: '物料只能通过申请审批增加,不能在节点直接录入!',
- type: 'warning'
- });
- },
- // 除基本信息之后的修改
- handleEdit() {
- console.log('除基本信息之后的修改', this.otherDeatils.queryKey);
- if ((this.otherDeatils.queryKey && this.otherDeatils.queryKey != '') || this.mainMsg.checkedList.length == 1) {
- this.otherDeatils.show = true;
- this.otherDeatils.isEdit = true;
- let activeTab = this.detailsTabs.filter(item => item.code == this.activeMainTab)[0];
- this.otherDeatils.title = activeTab.label;
- this.otherDeatils.queryKey = this.otherDeatils.queryKey || this.mainMsg.checkedList[0].id;
- console.log(this.otherDeatils, 'this.otherDeatils');
- // 查询其他标签页列表详情
- this.getOtherListDetails(activeTab.code, this.otherDeatils.queryKey);
- } else {
- this.$message({
- message: '修改请选择单个数据!',
- type: 'warning'
- });
- }
- },
- // 修改
- handleBasicEdit() {
- console.log('修改基本信息');
- this.updateButtonGroup = true;
- //需要禁止点击其他标签
- this.detailsTabs = this.detailsTabs.map(item => {
- item['disabled'] = true;
- return item
- })
- console.log(this.detailsTabs, 'this.detailsTabs ');
- },
- // 删除
- handleDel() {
- console.log('删除');
- },
- // 复制
- handleCopy() {
- console.log('复制');
- },
- //查询
- handleQuery() {
- },
- // 刷新
- handleRefresh() {
- console.log('刷新');
- },
- // 过滤
- handleFilter(e) {
- console.log(e, '过滤');
- },
- filterCondition(type) {
- return {
- type
- }
- },
- // 启用
- handleIsInvoke(e) {
- console.log('启用', e);
- },
- isInvoke(val) {
- return val;
- },
- // 申请单查询
- handleQueryForm() {
- console.log('申请单查询');
- },
- // 批量导入
- handleImport() {
- console.log('批量导入');
- },
- // 批量导出
- handleExport() {
- console.log('批量导出');
- },
- // 取消保存
- handleCancel() {
- console.log('取消保存');
- this.optionDialog.op = '取消';
- this.optionDialog.show = true;
- },
- // 保存修改
- handleSave() {
- console.log('保存修改');
- this.handleSaveMaterial(() => {
- this.$router.go(0)
- });
- },
- // 保存修改并新增
- handleSaveAdd() {
- console.log('保存修改并新增');
- },
- // 其他标签页弹窗取消操作
- handleOtherCancel() {
- console.log('其他标签页弹窗取消操作');
- this.optionDialog.show = true;
- this.optionDialog.op = '修改';
- },
- // 其他标签页弹窗保存
- handleOtherSave() {
- console.log('其他标签页弹窗保存');
- },
- // 其他页签详情弹窗关闭事件
- handleCloseOtherDetails(done) {
- console.log('其他页签详情弹窗关闭事件');
- // 处于编辑状态
- if (this.otherDeatils.isEdit) {
- this.$message({
- message: '请先退出编辑操作',
- type: 'warning'
- });
- } else {
- done();
- }
- },
- // 折叠菜单改变
- handleCollapseChange(val) {
- console.log(val, '折叠菜单改变');
- },
- // 更新导入
- handleUpdateImport() {
- console.log('更新导入');
- },
- // 确认弹窗操作
- handleComfirmOption() {
- console.log('确认弹窗操作');
- this.optionDialog.show = false;
- this.updateButtonGroup = false;
- this.handleRest();
- //需要禁止点击其他标签
- this.detailsTabs = this.detailsTabs.map(item => {
- item['disabled'] = false;
- return item;
- })
- if (this.otherDeatils.isEdit) {
- this.otherDeatils.isEdit = false;
- }
- },
- // 参照弹窗过滤
- handleFilterRefer() {
- // this.MoreDataDialog.key =
- console.log(this.MoreDataDialog.key, '查询关键字');
- this.handleQueryMore(this.MoreDataDialog.msg, this.MoreDataDialog.key);
- },
- // 操作提示弹窗关闭
- handleOptionCancal() {
- this.optionDialog.show = false;
- this.otherDeatils.isEdit = true;
- },
- // 树形节点选择
- handleNodeClick(e) {
- console.log(e, '树形节点选择', this.MoreDataDialog.target);
- // let node = { ...e, name: e.label }
- this.MoreDataDialog.value = e;
- },
- // 修改-更多数据表格——选择行
- handleCurentRow(row) {
- console.log(row, '修改-更多数据表格——选择行');
- this.MoreDataDialog.value = row;
- },
- // 参照弹窗确认
- handleConfirmRefer() {
- console.log('确认参照弹窗', `{this.${this.MoreDataDialog.target.name}:${this.MoreDataDialog.value.id}}`);
- if (this.MoreDataDialog.target.name == 'basicData') {
- // 基本信息
- this.basicData.value[this.MoreDataDialog.target.prop] = this.MoreDataDialog.value.id;
- this.basicData.value[`${this.MoreDataDialog.target.prop}Label`] = this.MoreDataDialog.value.name;
- console.log(this.basicData.value[`${this.MoreDataDialog.target.prop}Label`], '//////////基本信息///////////');
- } else if (this.MoreDataDialog.target.name == 'medcineData') {
- // 医药信息
- this.medcineData.value[this.MoreDataDialog.target.prop] = this.MoreDataDialog.value.id;
- this.medcineData.value[`${this.MoreDataDialog.target.prop}Label`] = this.MoreDataDialog.value.name;
- console.log(this.medcineData.value[`${this.MoreDataDialog.target.prop}Label`], '//////医药信息//////////');
- } else if (this.MoreDataDialog.target.name == 'otherDeatils') {
- // 其他页签
- this.otherDeatils.value[this.MoreDataDialog.target.prop] = this.MoreDataDialog.value.id;
- this.otherDeatils.value[`${this.MoreDataDialog.target.prop}Label`] = this.MoreDataDialog.value.name;
- console.log(this.otherDeatils.value[`${this.MoreDataDialog.target.prop}Label`], '/////////其他页签///////');
- }
- this.MoreDataDialog.show = false;
- },
- // 取消-关闭参照弹窗
- handleConcalRefer() {
- console.log('关闭参照弹窗');
- this.MoreDataDialog.show = false;
- this.MoreDataDialog.key = '';
- },
- // 关闭参照弹窗前
- handleCloseRefer(done) {
- this.MoreDataDialog.key = '';
- done();
- },
- // 保存物料以及相关页签
- handleSaveMaterial(cb) {
- let param = {
- ...this.basicData.value,
- materialMedcine: this.medcineData.value,
- materialMedcineItem: {}
- };
- // basicData this.medcineData.value materialMedcine
- console.log(param, '保存物料以及相关页签param');
- materialApi.insertMaterialInfo(param).then(res => {
- console.log(res, '保存物料以及相关页签');
- if(res.code) cb();
- })
- },
- // 取消之后重新查询页面
- handleRest() {
- // 基本信息
- this.getTagList('material', (form) => {
- this.basicData.form = form;
- this.getMaterialDetails(this.materialId, 'material');
- })
- // 医疗行业
- this.getTagList('material_medcine', (form) => {
- this.medcineData.form = form;
- this.getMedcineDetails(this.materialId, 'material_medcine');
- })
- },
- },
- created() {
- // 基本信息
- this.handleRest();
- },
- }
- </script>
- <style lang="scss">
- .material-details {
- padding: 12px;
- height: calc(100vh - 158px);
- box-sizing: border-box;
- .el-card__body {
- height: calc(100vh - 160px);
- box-sizing: border-box;
- padding: 12px;
- }
- .md-content {
- margin-top: 12px;
- height: calc(100vh - 260px);
- box-sizing: border-box;
- .md-basic {
- overflow: auto;
- .md-main {
- height: calc(100vh - 625px);
- // max-height: 290px;
- margin-bottom: 10px;
- overflow-y: auto;
- overflow-x: hidden;
- }
- .md-vice-content {
- height: 140px;
- overflow-y: auto;
- overflow-x: hidden;
- }
- }
- .md-auditInfo {
- .el-divider--horizontal {
- margin: 20px 0px 15px;
- }
- }
- }
- .otherDialog {
- .el-collapse-item__content {
- padding-bottom: 12px;
- }
- .el-dialog__body {
- padding: 12px 20px;
- height: 80%;
- overflow: auto;
- }
- .od-msg {
- max-height: 220px;
- box-sizing: border-box;
- overflow-y: auto;
- overflow-x: hidden;
- }
- .el-dialog__header {
- background-color: rgb(244, 244, 244);
- }
- }
- .MoreDataDialog {
- .el-dialog__body {
- height: 500px;
- padding: 20px 15px;
- .el-table {
- margin-top: 10px;
- .el-table__body-wrapper {
- height: 340px;
- overflow-y: auto;
- overflow-x: hidden;
- }
- }
- .referTree {
- height: 390px;
- overflow-x: hidden;
- overflow-y: auto;
- }
- }
- .el-dialog__header {
- background-color: rgb(244, 244, 244);
- }
- .more-button {
- margin-top: 10px;
- text-align: right;
- }
- }
- }
- // 修改下拉框样式
- #selected {
- /*很关键:将默认的select选择框样式清除*/
- // appearance: none;
- // -moz-appearance: none;
- // -webkit-appearance: none;
- // /*为下拉小箭头留出一点位置,避免被文字覆盖*/
- // padding-right: 14px;
- // /*自定义图片*/
- // background: url("../images/search@2x.png") no-repeat scroll right center transparent;
- // /*自定义图片的大小*/
- // background-size: 16px 16px;
- // /*将小箭头的样式去去掉*/
- // .el-icon-arrow-up:before {
- // content: '';
- // }
- // }
- }
- </style>
- <style scoped>
- .md-content>>>.el-form-item,
- .otherDialog>>>.el-form-item {
- margin-bottom: 10px;
- }
- .md-content>>>.el-tabs--border-card>.el-tabs__content {
- padding-bottom: 8px;
- }
- .md-content .md-auditInfo>>>.el-form-item {
- margin-bottom: 0px;
- }
- .md-main>>>.el-form-item,
- .md-vice>>>.el-form-item,
- .od-msg>>>.el-form-item {
- width: 100%;
- box-sizing: border-box;
- }
- .md-main>>>.el-form-item__label,
- .md-vice>>>.el-form-item__label,
- .od-msg>>>.el-form-item__label {
- width: 40%;
- }
- .od-msg>>>.el-checkbox__input {
- width: 15%;
- }
- .md-main>>>.el-form-item__content,
- .md-vice>>>.el-form-item__content,
- .od-msg>>>.el-form-item__content {
- width: 60%;
- box-sizing: border-box;
- }
- .od-msg>>>.el-checkbox__label {
- width: 85%;
- box-sizing: border-box;
- }
- .od-msg-checkedbx>>>.el-form-item__content {
- width: 80%;
- box-sizing: border-box;
- }
- .od-msg-checkedbx>>>.el-checkbox {
- width: 75%;
- box-sizing: border-box;
- }
- .md-content>>>.el-form-item__label,
- .otherDialog>>>.el-form-item__label,
- .od-msg>>>.el-form-item__label,
- .od-msg>>>.el-checkbox__label {
- font-weight: normal;
- /* text-align: left;
- width: 28%; */
- white-space: nowrap;
- /* IE6 需要定义宽度 */
- overflow: hidden;
- -o-text-overflow: ellipsis;
- /* Opera */
- text-overflow: ellipsis;
- /* IE, Safari (WebKit) */
- /* -moz-binding: url('ellipsis.xml#ellipsis'); */
- /* Firefox */
- }
- .otherDialog>>>.el-form-item__label {
- font-size: 12px;
- }
- .md-main>>>.material-table {
- height: 100%;
- }
- .md-vice>>>.material-table {
- height: 140px;
- overflow-y: auto;
- overflow-x: auto;
- }
- /* .otherDialog>>>.el-collapse-item__content {
- padding-bottom: 12px;
- }
- .otherDialog>>>.el-dialog__body {
- padding: 12px 20px;
- } */
- </style>
|