|
|
@@ -2,66 +2,39 @@
|
|
|
<div class="data-fill-list-box">
|
|
|
<el-collapse v-model="ActiveKey" accordion @change="CollapseChange">
|
|
|
<template v-for="(item, index) in listDatas" :key="item?.pKeyId">
|
|
|
- <el-collapse-item
|
|
|
- :id="`item-${index}-${item?.pKeyId}`" :disabled="item.isBussShow === 2"
|
|
|
- :name="`item-${index}-${item?.pKeyId}`"
|
|
|
- >
|
|
|
+ <el-collapse-item :id="`item-${index}-${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="real-fill-rate">
|
|
|
+ <div class="tag" :class="item.realFillRate >= 80 ? 'yes' : ''">已填{{ item.realFillRate ?? 0 }}%</div>
|
|
|
+ <HcTooltip keys="wbs_preview_table">
|
|
|
+ <el-link v-if="item.isBussShow === 2 || item.isTabPdf === 1" type="primary" disabled>本 表 预 览</el-link>
|
|
|
+ <el-link v-else type="primary" @click.stop="previewClick(item)">本 表 预 览</el-link>
|
|
|
+ </HcTooltip>
|
|
|
+ </div -->
|
|
|
+ <div class="text-lg truncate item-title">{{ item.nodeName }}</div>
|
|
|
<div class="hc-extra-text-box">
|
|
|
<HcTooltip v-if="item.isCopyTab === 1" keys="wbs_del_table">
|
|
|
- <el-button
|
|
|
- :disabled="item.isBussShow === 2" :loading="delClickLoading" plain
|
|
|
- type="danger" @click.stop="delClick(item, index)"
|
|
|
- >
|
|
|
- 删除本表
|
|
|
- </el-button>
|
|
|
+ <el-link type="danger" :disabled="item.isBussShow === 2 || delClickLoading" @click.stop="delClick(item, index)">删除本表</el-link>
|
|
|
</HcTooltip>
|
|
|
<HcTooltip keys="wbs_copy_table">
|
|
|
- <el-button
|
|
|
- :disabled="item.isBussShow === 2" :loading="copyClickLoading" plain
|
|
|
- type="primary" @click.stop="copyClick(item, index)"
|
|
|
- >
|
|
|
- 复制本表
|
|
|
- </el-button>
|
|
|
- </HcTooltip>
|
|
|
- <HcTooltip keys="wbs_hide_table">
|
|
|
- <el-button plain type="primary" @click.stop="hideClick(item, index)">
|
|
|
- <template v-if="item.isBussShow === 1">
|
|
|
- 隐藏本表
|
|
|
- </template>
|
|
|
- <template v-else>
|
|
|
- 显示本表
|
|
|
- </template>
|
|
|
- </el-button>
|
|
|
+ <el-link type="primary" :disabled="item.isBussShow === 2 || copyClickLoading" @click.stop="copyClick(item, index)">复制本表</el-link>
|
|
|
</HcTooltip>
|
|
|
<HcTooltip keys="wbs_preview_table">
|
|
|
- <el-button
|
|
|
- v-if="item.isBussShow === 2 || item.isTabPdf === 1" disabled plain
|
|
|
- type="info"
|
|
|
- >
|
|
|
- 预览
|
|
|
- </el-button>
|
|
|
- <el-button v-else plain type="primary" @click.stop="previewClick(item, index)">
|
|
|
- 预览
|
|
|
- </el-button>
|
|
|
+ <el-link v-if="item.isBussShow === 2 || item.isTabPdf === 1" type="primary" disabled>预览</el-link>
|
|
|
+ <el-link v-else type="primary" @click.stop="previewClick(item)">预览</el-link>
|
|
|
</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>
|
|
|
+ <el-link :disabled="item.isBussShow === 2" :type="item.tabFileType === 2 ? 'success' : 'primary'" @click.stop="uploadClick(item, index)">
|
|
|
+ <template v-if="item.tabFileType === 2">已上传</template>
|
|
|
+ <template v-else>附件上传</template>
|
|
|
+ </el-link>
|
|
|
+ </HcTooltip>
|
|
|
+ <HcTooltip keys="wbs_hide_table">
|
|
|
+ <el-link type="primary" @click.stop="hideClick(item, index)">
|
|
|
+ <template v-if="item.isBussShow === 1">隐藏本表</template>
|
|
|
+ <template v-else>显示本表</template>
|
|
|
+ </el-link>
|
|
|
</HcTooltip>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -87,71 +60,45 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
- <div class="hc-window-switch-box">
|
|
|
- <el-tooltip
|
|
|
- :content="item.isWindow ? '关闭窗口并恢复' : '当前表单窗口化'" :hide-after="0"
|
|
|
- placement="top"
|
|
|
- >
|
|
|
- <div class="icon-btn-view">
|
|
|
- <template v-if="item.isWindow">
|
|
|
- <HcIcon class="icon" name="picture-in-picture-2" />
|
|
|
- <span class="ml-1" @click.stop="windowCloseClick(item, index)">关闭窗口化</span>
|
|
|
- </template>
|
|
|
- <template v-else>
|
|
|
- <HcIcon class="icon" name="picture-in-picture-exit" />
|
|
|
- <span class="ml-1" @click.stop="windowClick(item, index)">表单窗口化</span>
|
|
|
- </template>
|
|
|
+ <el-tooltip :content="item.isWindow ? '关闭窗口并恢复' : '当前表单窗口化'" :hide-after="0" placement="top">
|
|
|
+ <div v-if="item.isWindow" class="form-window-icon" @click.stop="windowCloseClick(item, index)">
|
|
|
+ <HcIcon name="fullscreen-exit" />
|
|
|
+ </div>
|
|
|
+ <div v-else class="form-window-icon" @click.stop="windowClick(item, index)">
|
|
|
+ <HcIcon name="fullscreen" />
|
|
|
</div>
|
|
|
</el-tooltip>
|
|
|
</div>
|
|
|
- <div class="data-fill-table-tip-box">
|
|
|
- <div class="text-orange tip-title">
|
|
|
- <HcIcon fill name="error" ui="text-2xl" />
|
|
|
- <span class="ml-1">提示</span>
|
|
|
- </div>
|
|
|
- <div class="text-gray-400 tip-item">
|
|
|
- 1、灰色框代表可通过系统识别计算，公式自动引用，可通过公式计算少量数据，(表头数据及简单)，也可只填写白色框数据
|
|
|
+ <div class="data-fill-table-action">
|
|
|
+ <div class="text-orange tip-action" @click="actionTipModal = true">
|
|
|
+ <HcIcon fill name="information" ui="text-2xl" />
|
|
|
</div>
|
|
|
- <div class="text-gray-400 tip-item">
|
|
|
- 2、系统支持键盘中，shift +
|
|
|
- tab键向上一个填报框切换，tab向下一个填报框切换。暂不支持上下按键切换输入框
|
|
|
+ <div v-loading="downloadLoading" class="link-action">
|
|
|
+ <HcTooltip keys="wbs_download_table">
|
|
|
+ <el-link type="primary" @click="downModal(item)">下载导入模板</el-link>
|
|
|
+ </HcTooltip>
|
|
|
+ <HcTooltip keys="wbs_import_table">
|
|
|
+ <el-link type="primary" @click="uploadFileClick(item)">导入表格数据</el-link>
|
|
|
+ </HcTooltip>
|
|
|
+ <HcUploadFile
|
|
|
+ v-if="checkItem?.pKeyId"
|
|
|
+ ref="dataHcUploadFileRef"
|
|
|
+ :params="{ pKeyId: checkItem.pKeyId }"
|
|
|
+ :options="UploadFileOptions"
|
|
|
+ multiple="false"
|
|
|
+ @success="HcUploadFileSuccess"
|
|
|
+ />
|
|
|
</div>
|
|
|
- <div class="table-tip-foot">
|
|
|
- <div class="tip-left-btn">
|
|
|
- <HcTooltip keys="wbs_import_table">
|
|
|
- <div class="text-main dow-text" @click="uploadFileClick(item)">
|
|
|
- <HcIcon name="publish" ui="text-lg" />
|
|
|
- <span class="ml-1">导入表格数据</span>
|
|
|
- </div>
|
|
|
- </HcTooltip>
|
|
|
- <HcUploadFile
|
|
|
- v-if="checkItem?.pKeyId"
|
|
|
- ref="dataHcUploadFileRef"
|
|
|
- :params="{ pKeyId: checkItem.pKeyId }"
|
|
|
- :options="UploadFileOptions"
|
|
|
- multiple="false"
|
|
|
- @success="HcUploadFileSuccess"
|
|
|
- />
|
|
|
- <HcTooltip keys="wbs_download_table">
|
|
|
- <div v-loading="downloadLoading" class="text-main dow-text" @click="downModal(item)">
|
|
|
- <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="NodeStatusval === '3'" :loading="tableFormSaveLoading" hc-btn
|
|
|
- type="primary"
|
|
|
- @click="tableFormSaveClick(item, index)"
|
|
|
- >
|
|
|
- <HcIcon name="save" />
|
|
|
- <span>保存</span>
|
|
|
- </el-button>
|
|
|
- </HcTooltip>
|
|
|
- </div>
|
|
|
+ <div class="btn-action">
|
|
|
+ <HcTooltip keys="wbs_save_table">
|
|
|
+ <el-button
|
|
|
+ :disabled="NodeStatusval === '3'" :loading="tableFormSaveLoading"
|
|
|
+ color="#3794FF" size="small" style="color: white"
|
|
|
+ @click="tableFormSaveClick(item)"
|
|
|
+ >
|
|
|
+ 仅保存本表数据
|
|
|
+ </el-button>
|
|
|
+ </HcTooltip>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -271,6 +218,19 @@
|
|
|
</HcDragNode>
|
|
|
</HcDragModal>
|
|
|
</template>
|
|
|
+
|
|
|
+ <!-- 操作提示 -->
|
|
|
+ <HcDialog :footer="false" :show="actionTipModal" title="操作提示" widths="38rem" @close="actionTipModalClose">
|
|
|
+ <div class="data-fill-table-tip-box">
|
|
|
+ <div class="text-gray-400 tip-item">
|
|
|
+ 1、灰色框代表可通过系统识别计算，公式自动引用，可通过公式计算少量数据，(表头数据及简单)，也可只填写白色框数据
|
|
|
+ </div>
|
|
|
+ <div class="text-gray-400 tip-item">
|
|
|
+ 2、系统支持键盘中，shift + tab键向上一个填报框切换，tab向下一个填报框切换。暂不支持上下按键切换输入框
|
|
|
+ </div>
|
|
|
+ <div class="text-orange-500 tip-item">3、完善资料填写后记得一定要保存哦</div>
|
|
|
+ </div>
|
|
|
+ </HcDialog>
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
@@ -303,7 +263,6 @@ import {
|
|
|
import ossApi from '~api/oss'
|
|
|
import { getTokenHeader } from '~src/api/request/header'
|
|
|
|
|
|
-
|
|
|
//初始
|
|
|
const props = defineProps({
|
|
|
datas: {
|
|
|
@@ -1685,6 +1644,11 @@ const UploadFileOptions = {
|
|
|
|
|
|
|
|
|
|
|
|
+//操作提示
|
|
|
+const actionTipModal = ref(false)
|
|
|
+const actionTipModalClose = () => {
|
|
|
+ actionTipModal.value = false
|
|
|
+}
|
|
|
|
|
|
|
|
|
|
|
|
@@ -1725,33 +1689,64 @@ defineExpose({
|
|
|
.hc-collapse-item-header {
|
|
|
flex: 1;
|
|
|
position: relative;
|
|
|
- margin-left: 46px;
|
|
|
+ margin-left: 10px;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
+ .real-fill-rate {
|
|
|
+ position: relative;
|
|
|
+ height: 100%;
|
|
|
+ line-height: initial;
|
|
|
+ margin-right: 18px;
|
|
|
+ padding-right: 18px;
|
|
|
+ &::after {
|
|
|
+ content: "";
|
|
|
+ background: #bfc8cf;
|
|
|
+ position: absolute;
|
|
|
+ right: 0;
|
|
|
+ height: 100%;
|
|
|
+ width: 1px;
|
|
|
+ top: 0;
|
|
|
+ }
|
|
|
+ .tag {
|
|
|
+ position: relative;
|
|
|
+ background: white;
|
|
|
+ font-size: 12px;
|
|
|
+ color: #BD3124;
|
|
|
+ padding: 1px 6px;
|
|
|
+ border-radius: 3px;
|
|
|
+ border: 1px solid #BD3124;
|
|
|
+ margin-bottom: 2px;
|
|
|
+ margin-top: 2px;
|
|
|
+ }
|
|
|
+ .tag.yes {
|
|
|
+ color: #88CF65;
|
|
|
+ border-color: #88CF65;
|
|
|
+ }
|
|
|
+ }
|
|
|
.item-title {
|
|
|
flex: 1;
|
|
|
position: relative;
|
|
|
user-select: none;
|
|
|
- color: #50545E;
|
|
|
+ color: #591BB7;
|
|
|
font-size: 16px;
|
|
|
- font-weight: 400;
|
|
|
+ font-weight: bold;
|
|
|
cursor: pointer;
|
|
|
}
|
|
|
.hc-extra-text-box {
|
|
|
position: relative;
|
|
|
padding-right: 24px;
|
|
|
+ line-height: initial;
|
|
|
}
|
|
|
}
|
|
|
.data-fill-list-item-content {
|
|
|
position: relative;
|
|
|
- display: flex;
|
|
|
- height: calc(100vh - 428px);
|
|
|
+ height: calc(100vh - 275px);
|
|
|
.data-fill-table-form-box {
|
|
|
position: relative;
|
|
|
padding: 24px 20px;
|
|
|
- height: 100%;
|
|
|
+ height: calc(100% - 36px);
|
|
|
overflow: auto;
|
|
|
- flex: 1;
|
|
|
+ border: 4px solid #c4c4c4;
|
|
|
&.is-window {
|
|
|
border: 0;
|
|
|
.hc-window-tip {
|
|
|
@@ -1773,6 +1768,24 @@ defineExpose({
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+ .form-window-icon {
|
|
|
+ position: absolute;
|
|
|
+ top: 10px;
|
|
|
+ right: 10px;
|
|
|
+ background: #3794FF;
|
|
|
+ color: white;
|
|
|
+ font-size: 20px;
|
|
|
+ width: 32px;
|
|
|
+ height: 32px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ border-radius: 30px;
|
|
|
+ cursor: pointer;
|
|
|
+ &:hover {
|
|
|
+ background: #204DA0;
|
|
|
+ }
|
|
|
+ }
|
|
|
.hc-no-table-form {
|
|
|
position: relative;
|
|
|
height: 100%;
|
|
|
@@ -1792,36 +1805,21 @@ defineExpose({
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
- .data-fill-table-tip-box {
|
|
|
- width: 240px;
|
|
|
+ .data-fill-table-action {
|
|
|
position: relative;
|
|
|
- border-left: 1px solid #E9E9E9;
|
|
|
- padding: 20px 15px 80px;
|
|
|
- .tip-title {
|
|
|
- font-size: 16px;
|
|
|
- margin-bottom: 10px;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ padding: 4px 10px;
|
|
|
+ .tip-action {
|
|
|
+ cursor: pointer;
|
|
|
+ margin-right: 24px;
|
|
|
}
|
|
|
- .tip-item {
|
|
|
- margin-bottom: 20px;
|
|
|
+ .link-action {
|
|
|
+ position: relative;
|
|
|
+ flex: 1;
|
|
|
}
|
|
|
- .table-tip-foot {
|
|
|
- position: absolute;
|
|
|
- bottom: 15px;
|
|
|
- right: 0;
|
|
|
- left: 0;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- padding: 0 15px;
|
|
|
- .tip-left-btn {
|
|
|
- flex: 1;
|
|
|
- .dow-text {
|
|
|
- cursor: pointer;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- }
|
|
|
- }
|
|
|
+ .btn-action {
|
|
|
+ position: relative;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
@@ -1846,16 +1844,46 @@ defineExpose({
|
|
|
font-size: 22px;
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
+.data-fill-table-tip-box {
|
|
|
+ position: relative;
|
|
|
+ .tip-title {
|
|
|
+ font-size: 16px;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+ .tip-item {
|
|
|
+ margin-bottom: 20px;
|
|
|
+ }
|
|
|
+ .table-tip-foot {
|
|
|
+ position: absolute;
|
|
|
+ bottom: 15px;
|
|
|
+ right: 0;
|
|
|
+ left: 0;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ padding: 0 15px;
|
|
|
+ .tip-left-btn {
|
|
|
+ flex: 1;
|
|
|
+ .dow-text {
|
|
|
+ cursor: pointer;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|
|
|
|
|
|
<style lang="scss">
|
|
|
.data-fill-list-box {
|
|
|
.el-collapse {
|
|
|
- --el-collapse-header-height: 60px;
|
|
|
+ --el-collapse-header-height: 50px;
|
|
|
border: 0;
|
|
|
.el-collapse-item {
|
|
|
- margin: 0 0 16px;
|
|
|
- background-color: #f1f5f8;
|
|
|
+ margin: 0 0 6px;
|
|
|
+ background-color: #E6EEF4;
|
|
|
border: 1px solid #E9E9E9;
|
|
|
border-radius: 4px;
|
|
|
}
|
|
|
@@ -1866,11 +1894,7 @@ defineExpose({
|
|
|
cursor: default;
|
|
|
font-size: 14px;
|
|
|
.el-collapse-item__arrow {
|
|
|
- position: absolute;
|
|
|
- color: #50545E;
|
|
|
- cursor: pointer;
|
|
|
- left: 20px;
|
|
|
- margin: 0;
|
|
|
+ display: none;
|
|
|
}
|
|
|
}
|
|
|
.el-collapse-item.is-active .el-collapse-item__header.is-active {
|
|
|
@@ -1888,6 +1912,18 @@ defineExpose({
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+ .hc-collapse-item-header .real-fill-rate .el-link {
|
|
|
+ font-size: 12px;
|
|
|
+ }
|
|
|
+ .el-link {
|
|
|
+ text-decoration: underline;
|
|
|
+ &:hover {
|
|
|
+ text-decoration: auto;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .el-link + .el-link {
|
|
|
+ margin-left: 20px;
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
//插入特殊字符弹窗的输入框
|
