123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266 |
- <template>
- <div class="data-fill-list-box">
- <el-collapse v-model="ActiveKey" accordion @change="CollapseChange">
- <el-collapse-item v-for="(item,index) in listDatas" :id="`item-${index}-${item?.pkeyId}`"
- :key="item?.pkeyId" :disabled="item['isBussShow'] === 2"
- :name="`item-${index}-${item?.pkeyId}`">
- <template #title>
- <div class="hc-collapse-item-header">
- <div class="text-lg truncate item-title"> {{ item.nodeName }}</div>
- <div class="hc-extra-text-box">
- <HcTooltip v-if="item['isCopeTab'] === 2 || item['isCopeTab'] === 3" keys="wbs_del_table">
- <el-button :disabled="item['isBussShow'] === 2" :loading="tableFormDelLoading" plain
- type="danger"
- @click.stop="delClick(item)">删除本表
- </el-button>
- </HcTooltip>
- <HcTooltip keys="wbs_copy_table">
- <el-button
- v-if="item['isLinkTable'] === 1"
- disabled plain
- type="info">
- 复制本表
- </el-button>
- <el-button v-else :loading="copyClickLoading" plain type="primary"
- @click.stop="copyClick(item,index)">复制本表
- </el-button>
- </HcTooltip>
- <HcTooltip keys="wbs_hide_table">
- <el-button :loading="tableFormHideLoading" plain type="primary"
- @click.stop="hideClick(item,index)">
- <template v-if="item['isBussShow'] === 1">隐藏本表</template>
- <template v-else>显示本表</template>
- </el-button>
- </HcTooltip>
- <HcTooltip v-if="isStatus !== 3" keys="wbs_preview_table">
- <el-button
- v-if="item['isBussShow'] === 2 || item['isTabPdf'] === 1|| item['pdfUrl'] === ''"
- disabled plain
- type="info">
- 预览
- </el-button>
- <el-button v-else :loading="tableFormPreviewLoading" plain type="primary"
- @click.stop="previewClick(item)">预览
- </el-button>
- </HcTooltip>
- <HcTooltip keys="wbs_upload_table">
- <el-button :disabled="item['isBussShow'] === 2"
- :type="item['tabFileType'] === 2?'success':'primary'"
- plain
- @click.stop="uploadClick(item,index)">
- <template v-if="item['tabFileType'] === 2">已上传</template>
- <template v-else>上传</template>
- </el-button>
- </HcTooltip>
- </div>
- </div>
- </template>
- <div :style="`height: calc(100vh - ${draw_type ? '555px' : '360px'});`"
- class="data-fill-list-item-content">
- <div v-if="item?.isWindow" class="data-fill-table-form-box is-window">
- <div class="hc-window-tip">
- <div class="table-form-no">
- <img :src="NoDataSvg" alt=""/>
- <div class="desc">当前表单处于窗口模式,关闭相关窗口后恢复</div>
- </div>
- </div>
- </div>
- <div v-else class="data-fill-table-form-box">
- <TableFormItem v-if="item.isTableRender"
- :ref="(el) => setItemRefs(el, item)"
- :classify="classifys"
- :datas="changeFormDatas(item?.pkeyId, 'collapse')"
- :kid="item?.pkeyId"
- :nodeName="item.nodeName"
- :pid="`table-form-${item?.pkeyId}`"
- :tid="treeId"
- @excelBodyTap="excelTableFormClick($event)"
- @render="tableFormRender($event, item, index)"
- @rightTap="tableFormRightTap($event, index)"/>
- </div>
- <div class="hc-window-switch-box">
- <el-tooltip :content="item.isWindow?'关闭窗口并恢复':'当前表单窗口化'" :hide-after="0"
- placement="top">
- <div class="icon-btn-view" @click.stop="windowClick(item, index)">
- <template v-if="item.isWindow">
- <HcIcon class="icon" name="picture-in-picture-2"/>
- <span class="ml-1">关闭窗口化</span>
- </template>
- <template v-else>
- <HcIcon class="icon" name="picture-in-picture-exit"/>
- <span class="ml-1">表单窗口化</span>
- </template>
- </div>
- </el-tooltip>
- </div>
- <div class="data-fill-table-tip-box">
- <el-scrollbar>
- <div class="text-orange tip-title">
- <HcIcon fill name="information" ui="text-2xl"/>
- <span class="ml-1">提示</span>
- </div>
- <div class="text-gray-400 tip-item">
- 1、灰色框代表可通过系统识别计算,公式自动引用,可通过公式计算少量数据,(表头数据及简单),也可只填写白色框数据
- </div>
- <div class="text-gray-400 tip-item">2、系统支持键盘中,shift +
- tab键向上一个填报框切换,tab向下一个填报框切换。Shift + 上 ( ↑ )、下 ( ↓ )、左 ( ← )、右 ( →
- )键,切换填报输入框焦点。
- </div>
- <div class="text-gray-400 tip-item">3、先点击一下表单任一区域,再键盘按住 ctrl +
- 点击,选择输入框,变为绿色边框,选中成功。选择完毕后,键盘按 ctrl + c 复制所选中的数据,
- 再其它表内,或同一张表内,再次按住 ctrl + 点击,选择输入框。键盘按 ctrl + v
- 依次粘贴所选的数据。(目前仅支持输入框和文本框的操作)
- </div>
- <div class="text-orange-500 tip-item">4、完善资料填写后记得一定要保存哦</div>
- </el-scrollbar>
- <div class="table-tip-foot">
- <div class="tip-left-btn">
- <HcTooltip keys="wbs_import_table">
- <div class="text-gray-400 dow-text">
- <HcIcon name="publish" ui="text-lg"/>
- <span class="ml-1">导入列表数据</span>
- </div>
- </HcTooltip>
- <HcTooltip keys="wbs_download_table">
- <div class="text-main dow-text">
- <HcIcon name="file_download" ui="text-lg"/>
- <span class="ml-1">下载导入模板</span>
- </div>
- </HcTooltip>
- </div>
- <div class="tip-right-btn">
- <HcTooltip keys="wbs_save_table">
- <el-button :disabled="!item?.isTableForm"
- :loading="tableFormSaveLoading" hc-btn
- type="primary"
- @click="tableFormSaveClick(item)">
- <HcIcon name="save"/>
- <span>保存</span>
- </el-button>
- </HcTooltip>
- </div>
- </div>
- </div>
- </div>
- </el-collapse-item>
- </el-collapse>
- </div>
- <!--右键菜单-->
- <HcContextMenu ref="contextMenuRef" :datas="tableFormMenu" @item-click="handleMenuSelect"/>
- <!--上传文件-->
- <HcDialog :footer="false" :show="uploadModal" title="上传文件" widths="38rem" @close="uploadModalClose">
- <HcUpload :datas="uploadData" :fileList="fileListData" @change='uploadChange'/>
- </HcDialog>
- <!--插入设计值/频率-->
- <HcDialog :loading="designModalLoading" :show="designModal" isToBody saveText="确认插入"
- title="插入设计值/频率" widths="600px"
- @close="closeDesignModal" @save="designModalSave">
- <el-alert :closable="false" title="填写完设计值和频率,系统自动计算实测值" type="warning"/>
- <el-form ref="formDesignRef" :model="formDesignModel" label-width="auto" size="large">
- <div class="form-item-div text-center mb-3">
- <el-radio-group v-model="formDesignModel.type" size="large">
- <el-radio :label="1">公路工程</el-radio>
- <el-radio :label="2" class="ml-4">水利水电</el-radio>
- </el-radio-group>
- </div>
- <el-form-item label="设计值">
- <!-- onkeyup="value = value.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g,'$1')" -->
- <el-input v-model="formDesignModel.design" placeholder="如果设计值存在两个,则使用 '/' 连接,例如12/23"/>
- </el-form-item>
- <el-form-item v-if="formDesignModel.type === 1" label="频率">
- <!-- onkeyup="value = value.replace(/^(0+)|[^\d]+/g,'')" -->
- <el-input v-model="formDesignModel.size"
- placeholder="如果设计值使用 '/' 连接,则频率也是用 '/' 连接,例如5/10"/>
- </el-form-item>
- <el-form-item v-if="formDesignModel.type === 2" label="容量">
- <!-- onkeyup="value = value.replace(/^(0+)|[^\d]+/g,'')" -->
- <el-input v-model="formDesignModel.capacity"
- placeholder="如果容量存在两个,则使用 '*',或者 '/' 连接例如2*4,5/7"/>
- </el-form-item>
- <el-form-item label="合格点数">
- <el-input v-model="formDesignModel.pass"
- placeholder="如果设计值使用 '/' 连接,则合格点数也是用 '/' 连接,例如2/5"/>
- </el-form-item>
- <el-form-item label="偏差范围">
- <el-input v-model="formDesignModel.dev"
- placeholder="如果设计值使用 '/' 连接,则偏差范围也是用 '/' 连接,例如±2/±3"/>
- </el-form-item>
- </el-form>
- </HcDialog>
- <!--插入特殊字符-->
- <HcDialog :loading="specialModalLoading" :show="specialModal" isToBody saveText="确认插入" title="插入特殊字符"
- widths="600px" @close="specialModalClose" @save="specialNodeClick">
- <HcSpecialDiaolg v-if="specialModal" ref="specialRef" @change="specialDiaolgChange"/>
- </HcDialog>
- <!--关联试验数据-->
- <HcDialog :footer="false" :loading="testModalLoading" :show="testModal" isTable isToBody title="关联试验数据"
- widths="84%" @close="testModalClose">
- <HcTestDiaolg v-if="testModal" :contractId="contract_id" :projectId="projectId" :tenantId="tenant_id"
- :wbsId="wbsTemp_id"
- :wbsType="wbs_type" @change="testTableRowName"/>
- </HcDialog>
- <!-- 选择要插入的数据 -->
- <HcDialog :loading="insertDataLoading" :show="insertDataShow" isTable isToBody saveText="保存"
- title="选择需要插入的数据" widths="84%" @close="cancelinsertData"
- @save="submitinsertData">
- <HcTestData v-if="insertDataShow" ref="insertDataRef" :contractId="contract_id" :projectId="projectId"
- :tableId="itinsertTableId"
- :treeId="itinsertTreeId"/>
- </HcDialog>
- <!--关联试验文件-->
- <HcDialog :loading="fileModalLoading" :show="fileModal" isTable isToBody saveText="保存" title="关联试验文件"
- widths="84%" @close="fileModalClose"
- @save="savefileModal">
- <HcTestFile v-if="fileModal" ref="testFileRefs" :contractId="contract_id" :projectId="projectId"
- :tenantId="tenant_id"
- :treeId="treeId" :wbsId="wbsTemp_id"
- :wbsType="wbs_type"/>
- </HcDialog>
- <!-- 公式参数配置 -->
- <HcDialog :loading="formulaModalLoading" :show="formulaModal" isToBody saveText="保存" title="公式参数配置"
- widths="84%" @close="formulaModalClose"
- @save="formulaSaveClick">
- <HcFormula v-if="formulaModal" ref="formulaRefs" :KeyName="tableFormItemNode.KeyName" :contractId="contract_id"
- :formparentId="formparentId"
- :pkeyId="tableFormItemNode.pkeyId" :projectId="projectId"/>
- </HcDialog>
- <!--查看表单-->
- <template v-for="(item,index) in DragModalTableForm">
- <HcDragModal :closeIconArr="closeIconArr" :eid="item.pkeyId" :height="DragModalHeight" :isShow="item.isShow"
- :loading="item.loading" :loadingText="item.loadingText" :title="item.title"
- isSortTop
- @close="TableFormClose(item, index)" @closeIconTap="closeIconTap($event, item, index)">
- <HcDragNode :more-menu="dragNodeMoreMenu" @menuTap="dragNodeMoreMenuTap($event, item)">
- <TableFormItem :ref="(el) => setItemRefs(el, item)"
- :classify="item.classify"
- :datas="changeFormDatas(item?.pkeyId, 'window')"
- :height="item.height"
- :kid="item.pkeyId"
- :nodeName="item.title"
- :pid="`table-form-${item?.pkeyId}`"
- :scroll="false"
- :tid="item.treeId"
- :width="item.width"
- @excelBodyTap="excelTableFormClick($event)"
- @render="tableFormRender($event, item['item'], item['index'])"
- @rightTap="tableFormRightTap($event, item['index'])"/>
- </HcDragNode>
- </HcDragModal>
- </template>
- </template>
- <script setup>
- import {ref, watch, nextTick, onUnmounted} from "vue";
- import {useAppStore} from "~src/store";
- import wbsApi from "~api/data-fill/wbs"
- import HcUpload from "../components/HcUpload.vue"
- import TableFormItem from "./table-form-item.vue"
- import HcSpecialDiaolg from "./special-diaolg.vue"
- import HcTestDiaolg from "./test-diaolg.vue"
- import HcTestData from "./test-data.vue"
- import HcTestFile from "./test-file.vue"
- import HcFormula from "./formula.vue"
- import HcDragNode from "~com/drag-node/index.vue"
- import NoDataSvg from '~src/assets/view/no-data.svg'
- import {setPosRange, isType, utilsArray, deepClone, isValueNull} from "vue-utils-plus"
- //初始变量
- const useAppState = useAppStore()
- const {isIndex, getIndex} = utilsArray()
- const {isString, getObjNullValue, getArrValue, getObjValue} = isType()
- //参数
- const props = defineProps({
- datas: {
- type: Array,
- default: () => ([])
- },
- classify: {
- type: [String, Number],
- default: ''
- },
- status: {
- type: [String, Number],
- default: ''
- },
- primaryKeyId: {
- type: [String, Number],
- default: ''
- },
- contractId: {
- type: [String, Number],
- default: ''
- },
- drawType: {
- type: Boolean,
- default: false
- },
- wbsTempId: {
- type: [String, Number],
- default: ''
- },
- tenantId: {
- type: [String, Number],
- default: ''
- },
- wbsType: {
- type: [String, Number],
- default: ''
- },
- })
- //全局变量
- const projectId = ref(useAppState.projectId);
- const contract_id = ref(props.contractId)
- const treeId = ref(props.primaryKeyId)
- const classifys = ref(props.classify)
- const wbsTemp_id = ref(props.wbsTempId);
- const tenant_id = ref(props.tenantId);
- const wbs_type = ref(props.wbsType);
- const isStatus = ref(parseInt(props.status))
- const listDatas = ref([])
- const draw_type = ref(props.drawType)
- //表单变量
- const formDataList = ref([])
- const formKeyIds = ref('')
- const formparentId = ref('')
- //处理ref
- const itemRefs = ref([])
- const setItemRefs = (el, {pkeyId}) => {
- if (el) {
- let index = getIndex(itemRefs.value, 'pkeyId', pkeyId)
- if (index !== -1) {
- itemRefs.value[index].ref = el
- } else {
- itemRefs.value.push({
- pkeyId: pkeyId,
- ref: el
- });
- }
- }
- }
- //处理表单的ref
- const setSpliceItemRefs = async ({pkeyId}) => {
- const refs = itemRefs.value
- let index = getIndex(refs, 'pkeyId', pkeyId)
- if (index !== -1) {
- refs.splice(index, 1)
- itemRefs.value = refs
- }
- }
- const closeIconArr = [
- {key: 'reduction', icon: 'picture-in-picture-2', name: '还原到面板内,并自动展开面板'}
- ]
- //事件
- const emit = defineEmits(['renew', 'offsetTop'])
- //组件参数变量
- const apis = ref({
- dataInfo: wbsApi.getBussDataInfo,
- bussCols: wbsApi.getHtmlBussCols,
- excelHtml: wbsApi.getExcelHtml
- })
- //深度监听数据
- watch(() => [
- props.datas,
- ], ([datas]) => {
- setFormDataNum(datas)
- }, {deep: true})
- //监听变量值
- watch(() => [
- useAppState.projectId,
- props.contractId,
- props.wbsTempId,
- props.tenantId,
- props.wbsType,
- props.status,
- props.classify,
- props.primaryKeyId,
- ], ([pid, cid, temp_id, tid, type, status, class_id, tree_id]) => {
- projectId.value = pid
- contract_id.value = cid
- wbsTemp_id.value = temp_id
- tenant_id.value = tid
- wbs_type.value = type
- isStatus.value = parseInt(status)
- classifys.value = class_id
- treeId.value = tree_id
- })
- //渲染完成
- nextTick(() => {
- setFormDataNum(props.datas)
- setTableFormMenu(useAppState.projectInfo)
- const {offsetHeight} = document.body
- DragModalHeight.value = offsetHeight - 200
- })
- //处理变动的数据
- const changeFormData = ref({
- 'window': [],
- 'collapse': [],
- })
- const changeFormDatas = (pkeyId, type) => {
- const changeData = changeFormData.value[type]
- const index = getIndex(changeData, 'pkeyId', pkeyId)
- if (index !== -1) {
- return changeData[index]
- } else {
- return {}
- }
- }
- //设置变动的数据
- const setChangeFormDatas = async (pkeyId, type) => {
- const refs = await getFormRef(pkeyId)
- const formData = refs?.getFormData()
- const changeData = changeFormData.value[type]
- const index = getIndex(changeData, 'pkeyId', pkeyId)
- if (index !== -1) {
- changeData[index] = formData
- } else {
- changeData.push(formData)
- }
- changeFormData.value[type] = changeData
- }
- //展开事件
- const ActiveKey = ref('')
- const CollapseChange = (name) => {
- ActiveKey.value = name
- let index = getCollapseItemIndex(name)
- if (index > -1) {
- getOffsetTop(name);
- const item = listDatas.value[index]
- formKeyIds.value = setToString(item.pkeyId)
- formparentId.value = setToString(item.parentId)
- nextTick(() => {
- if (!item.isTableRender) {
- item.isTableRender = true
- }
- })
- } else {
- getOffsetTop()
- formKeyIds.value = ''
- formparentId.value = ''
- }
- }
- //初始设置
- const setFormDataNum = (datas) => {
- itemRefs.value = []
- ActiveKey.value = ''
- let newArr = [];
- for (let i = 0; i < datas.length; i++) {
- newArr.push({isCollapseLoad: false})
- }
- formDataList.value = newArr
- listDatas.value = deepClone(datas)
- }
- //渲染完成
- const tableFormRender = (form, item, index) => {
- formDataList.value[index] = {
- ...form,
- isCollapseLoad: form.isRenderForm
- }
- item.isTableForm = form.isRenderForm
- }
- //菜单数据
- const contextMenuRef = ref(null)
- const tableFormMenu = ref([])
- const tableFormItemNode = ref({}) //临时信息
- //设置菜单权限数据
- const setTableFormMenu = (info) => {
- let newArr = [], infos = getObjValue(info)
- const isOpen = infos['isOpenRandomNumber'] ?? 0
- if (isOpen === 1 && isStatus.value !== 3) {
- newArr.push({label: '插入设计值/频率', key: "design"})
- }
- newArr.push({label: '插入特殊字符', key: "special"})
- newArr.push({label: '关联试验数据', key: "test"})
- newArr.push({label: '关联试验文件', key: "file"})
- newArr.push({label: '公式参数', key: "formula"})
- tableFormMenu.value = newArr
- }
- //鼠标右键事件
- const tableFormRightTap = ({event, KeyName, startPos, endPos, pkeyId}, index) => {
- //存储临时信息
- tableFormItemNode.value = {KeyName, index, startPos, endPos, pkeyId}
- contextMenuRef.value?.showMenu(event, false) //展开菜单
- }
- //鼠标右键菜单被点击
- const handleMenuSelect = ({key}) => {
- if (key === 'design') {
- setInitDesignForm()
- designModalLoading.value = false
- designModal.value = true
- } else if (key === 'special') {
- specialModalShow()
- } else if (key === 'test') {
- testModalLoading.value = false
- testModal.value = true
- } else if (key === 'file') {
- fileModalLoading.value = false
- fileModal.value = true;
- } else if (key === 'formula') {
- formulaModalLoading.value = false
- formulaModal.value = true
- }
- }
- //插入设计值
- const designModal = ref(false)
- const formDesignRef = ref(null)
- const formDesignModel = ref()
- //初始设计值/频率表单
- const setInitDesignForm = () => {
- formDesignModel.value = {
- type: 1, design: '', size: '',
- dev: '', key: '', capacity: '',
- pass: '', pkId: ''
- }
- }
- //设计值频率计算
- const designModalLoading = ref(false)
- const designModalSave = async () => {
- const {pkeyId, KeyName} = tableFormItemNode.value
- if (pkeyId) {
- designModalLoading.value = true
- //const {design, size} = formDesignModel.value
- const {error, code, data} = await wbsApi.queryFormulaRange({
- ...formDesignModel.value,
- // dev: (!design && !size) ? '±5': '',
- key: KeyName,
- pkId: pkeyId,
- })
- //处理数据
- const res = getObjNullValue(data)
- if (!error && code === 200 && res) {
- try {
- const refs = await getFormRef(pkeyId)
- const itemFormData = refs?.getFormData()
- Object.keys(data).forEach(key => {
- itemFormData[key] = data[key]
- })
- refs?.setFormData(itemFormData)
- } catch {
- }
- designModalLoading.value = false
- designModal.value = false
- } else {
- designModalLoading.value = false
- }
- } else {
- window?.$message?.warning('pkeyId为空')
- }
- }
- //关闭设计值/频率弹窗
- const closeDesignModal = () => {
- designModal.value = false
- setInitDesignForm()
- }
- //插入特殊字符
- const specialModal = ref(false)
- const specialModalLoading = ref(false)
- const specialModalShow = () => {
- specialFormValue.value = ''
- specialModalLoading.value = false
- specialModal.value = true
- }
- //监听特殊符号输入框的内容
- const specialFormValue = ref('')
- const specialDiaolgChange = (val) => {
- specialFormValue.value = val
- }
- //确认插入
- const specialRef = ref(null)
- const specialNodeClick = async () => {
- specialModalLoading.value = true
- const itemNode = tableFormItemNode.value
- const {KeyName, pkeyId} = itemNode
- try {
- const refs = await getFormRef(pkeyId)
- const itemFormData = refs?.getFormData()
- const {code, val, posVal} = await specialRef.value?.getSpecialNode(itemNode, itemFormData[KeyName])
- if (code === 200 && val) {
- itemFormData[KeyName] = val
- refs?.setFormData(itemFormData)
- specialModalLoading.value = false
- specialModal.value = false
- await nextTick(() => {
- setPosRange(KeyName, posVal)
- })
- } else {
- specialModalLoading.value = false
- }
- } catch (e) {
- specialModalLoading.value = false
- }
- }
- //关闭插入特殊字符
- const specialModalClose = () => {
- specialModalLoading.value = false
- specialModal.value = false
- }
- //关联试验数据
- const testModal = ref(false)
- const testModalLoading = ref(false)
- //关联试验数据被点击
- const itinsertTableId = ref('')
- const itinsertTreeId = ref('')
- const testTableRowName = ({row, treeId}) => {
- itinsertTableId.value = row.id
- itinsertTreeId.value = treeId
- insertDataLoading.value = false
- insertDataShow.value = true
- }
- //关闭弹窗
- const testModalClose = () => {
- testModal.value = false
- testModalLoading.value = false
- }
- //选择要插入的实验数据
- const insertDataShow = ref(false);
- const insertDataLoading = ref(false);
- //确定关联试验数据数据
- const insertDataRef = ref(null)
- const submitinsertData = async () => {
- insertDataLoading.value = true
- const itemNode = tableFormItemNode.value
- const {KeyName, pkeyId} = itemNode
- try {
- const refs = await getFormRef(pkeyId)
- const itemFormData = refs?.getFormData()
- const {code, val, posVal} = await insertDataRef.value?.submitinsertData(itemNode, itemFormData[KeyName])
- if (code === 200 && val) {
- itemFormData[KeyName] = val
- refs?.setFormData(itemFormData)
- insertDataLoading.value = false
- insertDataShow.value = false
- testModal.value = false
- await nextTick(() => {
- setPosRange(KeyName, posVal)
- })
- }
- } catch {
- insertDataLoading.value = false
- }
- }
- //取消关联数据
- const cancelinsertData = async () => {
- insertDataShow.value = false
- insertDataLoading.value = false
- }
- //关联试验文件
- const fileModal = ref(false)
- const testFileRefs = ref(null)
- //确认关联文件
- const fileModalLoading = ref(false)
- const savefileModal = async () => {
- fileModalLoading.value = true
- await testFileRefs.value?.savefileSubmit()
- fileModalLoading.value = false
- fileModal.value = false
- }
- //关闭弹窗
- const fileModalClose = () => {
- fileModal.value = false
- fileModalLoading.value = false
- }
- //公式参数配置
- const formulaModal = ref(false)
- const formulaRefs = ref(null)
- //保存
- const formulaModalLoading = ref(false)
- const formulaSaveClick = async () => {
- formulaModalLoading.value = true
- await formulaRefs.value?.panelSave()
- formulaModalLoading.value = false
- formulaModal.value = false
- }
- //关闭
- const formulaModalClose = () => {
- formulaModal.value = false
- formulaModalLoading.value = false
- }
- //窗口化
- const DragModalTableForm = ref([])
- const DragModalHeight = ref(600)
- const windowClick = async (item, indexs) => {
- const list = deepClone(DragModalTableForm.value)
- let index = getIndex(list, 'pkeyId', item.pkeyId)
- if (!item.isWindow) {
- const formSize = getTableFormSize(item?.pkeyId)
- const newTableForm = {
- ...setInitDragModalTableForm(item, indexs),
- ...formSize
- }
- await setChangeFormDatas(item?.pkeyId, 'window')
- item.isWindow = true
- //处理表单的ref
- await setSpliceItemRefs(item)
- //弹窗表单的排序
- if (index === -1) {
- list.push(newTableForm)
- } else if (index !== list.length - 1) {
- //检查是否在最上层,不在则置顶,可以解决多次点击时,频繁更改全局状态的问题
- list.splice(index, 1)
- list.push(newTableForm)
- }
- DragModalTableForm.value = list
- ActiveKey.value = ''
- } else {
- await setChangeFormDatas(item?.pkeyId, 'collapse')
- //处理表单的ref
- await setSpliceItemRefs(item)
- if (index !== -1) {
- list.splice(index, 1)
- DragModalTableForm.value = list
- }
- item.isWindow = false
- }
- }
- //初始拖动表单的内容
- const setInitDragModalTableForm = (item, index) => {
- return {
- projectId: projectId.value,
- contractId: contract_id.value,
- wbsTempId: wbsTemp_id.value,
- tenantId: tenant_id.value,
- wbsType: wbs_type.value,
- classify: classifys.value,
- treeId: treeId.value,
- pkeyId: item.pkeyId,
- height: '100%',
- width: '100%',
- title: item.nodeName,
- isShow: true,
- index: index,
- item: item
- }
- }
- //关闭窗口
- const TableFormClose = async ({pkeyId, index}, indexs) => {
- const list = deepClone(DragModalTableForm.value)
- //取表单的数据
- await setChangeFormDatas(pkeyId, 'collapse')
- //关闭窗口
- list.splice(indexs, 1)
- DragModalTableForm.value = list
- listDatas.value[index].isWindow = false
- }
- const dragNodeMoreMenu = [
- {key: 'save', icon: 'save-2', name: '保存'},
- {key: 'preview', icon: 'eye', name: '预览'},
- ]
- //还原窗口
- const closeIconTap = async (event, item, indexs) => {
- const {index, pkeyId} = item
- let KeyId = `item-${index}-${pkeyId}`
- await TableFormClose(item, indexs)
- ActiveKey.value = KeyId
- }
- //菜单被点击
- const dragNodeMoreMenuTap = ({key}, items) => {
- const {item} = items
- if (key === 'save') {
- if (item?.isTableForm) {
- tableFormSaveClick(item, items)
- } else {
- window.$message.warning('此表单暂无数据和文件')
- }
- } else if (key === 'preview') {
- if (item['isBussShow'] === 2 || item['isTabPdf'] === 1 || item['pdfUrl'] === '') {
- window.$message.warning('此表单暂无可预览文件')
- } else {
- previewClick(item, items)
- }
- }
- }
- //删除本表
- const tableFormDelLoading = ref(false)
- const delClick = async ({pkeyId}) => {
- if (pkeyId) {
- if (isStatus.value !== 3) {
- tableFormDelLoading.value = true
- const {error, code} = await wbsApi.removeBussTabInfo({
- pkeyid: pkeyId,
- classify: classifys.value,
- })
- tableFormDelLoading.value = false
- if (!error && code === 200) {
- window?.$message?.success('操作成功')
- //判断是否存在窗口,如果存在,就删除窗口
- delWindowRefs(pkeyId)
- renewData()
- }
- } else {
- window?.$message?.warning('已上报的资料,不允许删除')
- }
- } else {
- window?.$message?.warning('pkeyId为空')
- }
- }
- //复制本表
- const copyClickLoading = ref(false)
- const copyClick = async (items) => {
- const {pkeyId, isTableRender, isTableForm} = items
- if (pkeyId) {
- if (isStatus.value !== 3) {
- if (!isTableRender) {
- await copeBussTab(pkeyId)
- } else if (!isTableForm) {
- window?.$message?.warning('暂无表单数据')
- } else if (isTableRender) {
- copyClickLoading.value = true
- const isSave = await saveExcelBussData(items, null, false)
- if (isSave) {
- await copeBussTab(pkeyId)
- } else {
- copyClickLoading.value = false
- window?.$message?.warning('复制本表操作失败')
- }
- } else {
- window?.$message?.warning(`数据异常了, isRenderTableForm: ${isTableRender}, isTableForm: ${isTableForm}, pkeyIds:${pkeyId}`)
- }
- } else {
- window?.$message?.warning('已上报的资料,不允许复制')
- }
- } else {
- window?.$message?.warning('pkeyId为空')
- }
- }
- //复制表的请求
- const copeBussTab = async (pkeyId) => {
- copyClickLoading.value = true
- const {error, code} = await wbsApi.copeBussTab({
- pkeyId: pkeyId
- })
- copyClickLoading.value = false
- if (!error && code === 200) {
- window?.$message?.success('操作成功')
- renewData()
- }
- }
- //隐藏本表
- const tableFormHideLoading = ref(false)
- const hideClick = async ({pkeyId, isBussShow}) => {
- if (pkeyId) {
- if (isStatus.value !== 3) {
- tableFormHideLoading.value = true
- const bussShow = isBussShow === 2 ? 1 : 2 //状态(1显示 2隐藏)
- const {error, code} = await wbsApi.showBussTab({
- pkeyId: pkeyId,
- status: bussShow
- })
- tableFormHideLoading.value = false
- if (!error && code === 200) {
- window?.$message?.success('操作成功')
- if (bussShow === 2) {
- //判断是否存在窗口,如果存在,就删除窗口
- delWindowRefs(pkeyId)
- }
- renewData()
- }
- } else {
- window?.$message?.warning('已上报的资料,不允许隐藏')
- }
- } else {
- window?.$message?.warning('pkeyId为空')
- }
- }
- //预览本表
- const tableFormPreviewLoading = ref(false)
- const previewClick = async (item, dragItem = null) => {
- tableFormPreviewLoading.value = true
- await getBussPdfInfo(item, dragItem)
- tableFormPreviewLoading.value = false
- }
- //上传变量
- const uploadModal = ref(false)
- const fileListData = ref([]);
- const uploadData = ref({})
- //上传附件
- const uploadClick = (items, index) => {
- const {pkeyId, isTableForm, isTableRender} = items
- const keyName = `item-${index}-${pkeyId}`
- if (pkeyId) {
- if (isStatus.value !== 3 && isTableForm) {
- uploadModal.value = true
- uploadData.value = {
- projectId: projectId.value,
- contractId: contract_id.value,
- classify: classifys.value,
- pkeyId: pkeyId,
- nodeId: treeId.value
- }
- //获取文件列表
- getBussFileList(pkeyId)
- } else if (!isTableRender) {
- CollapseChange([keyName])
- window?.$message?.warning('请再次点击上传')
- } else if (!isTableForm) {
- window?.$message?.warning('暂无表单数据')
- } else {
- window?.$message?.warning('已上报的资料,不允许上传')
- }
- } else {
- window?.$message?.warning('pkeyId为空')
- }
- }
- //获取文件列表
- const getBussFileList = async (pkeyId) => {
- const {error, code, data} = await wbsApi.getBussFileList({
- pkeyid: pkeyId
- })
- if (!error && code === 200) {
- fileListData.value = getArrValue(data)
- } else {
- fileListData.value = []
- }
- }
- //上传文件
- const uploadChange = async ({type}) => {
- if (type === 'success') {
- uploadModal.value = false
- renewData()
- } else if (type === 'del') {
- renewData()
- }
- }
- //关闭上传附件窗口
- const uploadModalClose = () => {
- uploadModal.value = false
- }
- //单个保存
- const tableFormSaveLoading = ref(false)
- const tableFormSaveClick = async (item, dragItem = null) => {
- if (isStatus.value !== 3) {
- tableFormSaveLoading.value = true
- const isSave = await saveExcelBussData(item, dragItem)
- if (isSave) {
- await getBussPdfInfo(item, dragItem)
- tableFormSaveLoading.value = false
- renewData()
- } else {
- tableFormSaveLoading.value = false
- }
- } else {
- window?.$message?.warning('已上报的资料,不允许保存。')
- }
- }
- //保存表单数据
- const saveExcelBussData = async ({pkeyId}, dragItem = null, showTip = true) => {
- setDragModalLoading(dragItem, '保存中...', true)
- const refs = await getFormRef(pkeyId)
- const isRegExp = await refs?.isFormRegExp()
- if (isRegExp) {
- const formData = refs?.getFormData()
- const {error, code} = await wbsApi.saveExcelBussData(formData)
- setDragModalLoading(dragItem)
- if (!error && code === 200) {
- if (showTip) {
- window?.$message?.success('保存成功')
- }
- return true
- } else {
- return false
- }
- } else {
- setDragModalLoading(dragItem)
- return false
- }
- }
- //预览PDF
- const getBussPdfInfo = async ({pkeyId}, dragItem = null, showTip = true) => {
- setDragModalLoading(dragItem, '获取pdf中...', true)
- const {error, code, data} = await wbsApi.getBussPdfInfo({
- pkeyId: pkeyId
- }, false)
- setDragModalLoading(dragItem)
- if (!error && code === 200) {
- if (data) {
- window.open(data, '_blank')
- } else if (showTip) {
- window?.$message?.warning('PDF错误')
- }
- } else {
- if (showTip) {
- window?.$message?.warning(data.msg || '获取PDF失败')
- }
- }
- }
- //通知数据更新
- const renewData = () => {
- emit('renew')
- ActiveKey.value = ''
- }
- //设置表单的加载状态
- const setDragModalLoading = (dragItem, text = '保存中...', show = false) => {
- if (dragItem && show) {
- dragItem.loading = true
- dragItem.loadingText = text
- }
- if (dragItem && !show) {
- dragItem.loading = false
- }
- }
- //获取表单的ref
- const getFormRef = async (pkeyId) => {
- const itemRef = itemRefs.value
- const index = getIndex(itemRef, 'pkeyId', pkeyId)
- return itemRef[index].ref
- }
- //删除打开的窗口
- const delWindowRefs = (pkeyId) => {
- //判断是否存在窗口,如果存在,就删除窗口
- const list = DragModalTableForm.value
- const index = getIndex(list, 'pkeyId', pkeyId)
- if (index !== -1) {
- list.splice(index, 1)
- DragModalTableForm.value = list
- }
- }
- //计算展开高度和滚动位置
- const getOffsetTop = (key = '') => {
- if (key) {
- const dom = document.getElementById(key)
- if (!draw_type.value) {
- if (dom?.offsetTop >= 583 && key) {
- emit('offsetTop', dom?.offsetTop - 583)
- } else {
- emit('offsetTop', dom?.offsetTop)
- }
- } else {
- if (dom.offsetTop >= 424 && key) {
- emit('offsetTop', dom?.offsetTop - 424)
- } else {
- emit('offsetTop', dom?.offsetTop)
- }
- }
- } else {
- emit('offsetTop', 0)
- }
- ActiveKey.value = key
- }
- //获取折叠面板的索引
- const getCollapseItemIndex = (name) => {
- const keys = name.split('-')
- if (keys.length > 0) {
- return keys[1]
- } else {
- return -1
- }
- }
- //获取表单的大小
- const getTableFormSize = (pkeyId) => {
- let formId = `table-form-${pkeyId}`
- try {
- const {clientWidth, clientHeight} = document.getElementById(formId).children[0]
- return {
- width: (clientWidth + 40) + 'px',
- height: (clientHeight + 80) + 'px'
- }
- } catch {
- return {
- width: '100%',
- height: '100%'
- }
- }
- }
- //转字符串
- const setToString = (val) => {
- return val ? val + '' : ''
- }
- //表单被点击
- const presentId = ref('')
- const excelTableFormClick = (key) => {
- presentId.value = key
- }
- //全局按键按下监听
- document.onkeydown = async (event) => {
- const pkeyId = presentId.value
- if (!isValueNull(pkeyId)) {
- const {key, ctrlKey} = event
- //按下ctrl键
- if (ctrlKey && key === 'Control') {
- const refs = await getFormRef(pkeyId)
- refs?.setIsCtrlKey(true)
- }
- //按下复制快捷键
- if (ctrlKey && key === 'c') {
- const refs = await getFormRef(pkeyId)
- refs?.setCopyKeyList(event)
- }
- //按下粘贴快捷键
- if (ctrlKey && key === 'v') {
- const refs = await getFormRef(pkeyId)
- await refs?.setPasteKeyList(event)
- }
- }
- }
- //全局键盘放开监听
- document.onkeyup = async (event) => {
- const pkeyId = presentId.value
- if (!isValueNull(pkeyId)) {
- const {key, ctrlKey} = event
- if (!ctrlKey && key === 'Control') {
- const refs = await getFormRef(pkeyId)
- refs?.setIsCtrlKey(false)
- }
- }
- }
- //获取已渲染的表单
- const getFilterFormData = async () => {
- const formArr = formDataList.value;
- return formArr.filter((item) => {
- return (item.pkeyId ?? '') !== '' && item.isCollapseLoad;
- })
- }
- //获取表单数据
- const getFormData = async () => {
- const formArr = await getFilterFormData();
- //获取表单数据
- let newArr = [];
- for (let i = 0; i < formArr.length; i++) {
- const pkeyId = formArr[i].pkeyId
- const refs = await getFormRef(pkeyId)
- const form = refs?.getFormData()
- newArr.push({
- ...form
- })
- }
- return newArr
- }
- //获取表单效验数据
- const getFormRegExpJson = async () => {
- const formArr = await getFilterFormData();
- const list = listDatas.value
- //获取表单数据
- let formRegExpJson = {};
- for (let i = 0; i < formArr.length; i++) {
- const pkeyId = formArr[i].pkeyId
- const refs = await getFormRef(pkeyId)
- const regExp = refs?.getRegExpJson()
- const nodeName = refs?.getNodeName()
- if (getObjNullValue(regExp)) {
- const index = getIndex(list, 'pkeyId', pkeyId)
- formRegExpJson[pkeyId] = {
- ...regExp,
- itemId: `item-${index}-${pkeyId}`,
- nodeName: nodeName
- }
- }
- }
- return formRegExpJson
- }
- //获取当前展开项
- const getActiveKey = () => {
- return ActiveKey.value;
- }
- //设置当前展开项
- const setActiveKey = (key) => {
- return ActiveKey.value = key;
- }
- //卸载页面
- onUnmounted(() => {
- console.log('卸载页面')
- document.onkeydown = null
- document.onkeyup = null
- })
- // 暴露出去
- defineExpose({
- getFormData,
- getFormRegExpJson,
- getActiveKey,
- setActiveKey
- })
- </script>
- <style lang="scss" scoped>
- @import "./index.scss";
- </style>
- <style lang="scss">
- @import "./style.scss";
- </style>
|