bonus
/
smart-bid-web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'main' of http://192.168.0.75:3000/bonus/smart-bid-web

This commit is contained in:
LHD_HY 2025-11-03 13:48:17 +08:00
parent 55ee724db6 afcece44ea
commit 1287a9776e
14 changed files with 856 additions and 167 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/api/enterpriseLibrary/tool/tool.js
View File

@ -39,7 +39,7 @@ export function delDataAPI(data) {
/* 工器具库->查询详情 */
export function getDetailDataAPI(params) {
return request({
url: '/smartBid/mainDatabase/tool/getDetailData',
url: '/smartBid/mainDatabase/tool/detailData',
method: 'GET',
params
})

37
src/assets/styles/index.scss
View File

@ -176,3 +176,40 @@ aside {
margin-bottom: 10px;
}
}
// 下载加载提示样式优化
::v-deep .download-loading-mask {
.el-loading-spinner {
margin-top: -30px;
.el-loading-text {
color: #409EFF;
font-size: 16px;
font-weight: 500;
margin-top: 15px;
letter-spacing: 0.5px;
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}
.circular {
width: 50px;
height: 50px;
}
.path {
stroke: #409EFF;
stroke-width: 3.5;
}
.el-icon-loading {
font-size: 50px;
color: #409EFF;
}
}
// 背景渐变效果
.el-loading-mask {
backdrop-filter: blur(2px);
-webkit-backdrop-filter: blur(2px);
}
}

10
src/components/TableModel2/index.vue
View File

@ -198,6 +198,11 @@ export default {
type: [Number, String],
default: 600
},
// 是否自动加载数据 默认自动加载
autoLoad: {
type: Boolean,
default: true
},
},
computed: {
/* 根据操作栏控制表头是否显示 */
@ -322,7 +327,10 @@ export default {
this.$set(this.queryParams, key, this.sendParams[key])
}
}
this.getTableList()
// 根据 autoLoad 属性决定是否自动加载数据
if (this.autoLoad) {
this.getTableList()
}
},
updated() {
// 若需要自适应最小宽度，可启用下行；当前使用固定宽度 handleColWidth

82
src/utils/download.js
View File

@ -1,3 +1,9 @@
import axios from 'axios'
import { Loading, Message } from 'element-ui'
import { getToken } from '@/utils/auth'
import { blobValidate } from '@/utils/bonus'
import { saveAs } from 'file-saver'
// 下载blob文件
export const downloadFile = ({ fileData, fileType, fileName }) => {
const blob = new Blob([fileData], {
@ -24,3 +30,79 @@ export const downloadFileByUrl = (url) => {
URL.revokeObjectURL(link.href)
document.body.removeChild(link)
}
/**
* 通用文件下载方法（带加载提示）
* @param {string} path - 下载路径
* @param {string} defaultFileName - 默认文件名（可选，如果响应头没有文件名则使用此名称）
* @param {string} loadingText - 加载提示文本（可选，默认为'正在下载文件，请稍候...'）
* @returns {Promise} - 返回 Promise
*/
export const downloadFileWithLoading = (path, defaultFileName = '文件.xlsx', loadingText = '正在下载文件，请稍候...') => {
const baseURL = process.env.VUE_APP_BASE_API
const url = path.startsWith('http') ? path : `${baseURL}/${path}`
// 显示下载中提示（优化样式）
const downloadLoadingInstance = Loading.service({
lock: true, // 锁定屏幕，防止用户操作
text: loadingText,
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.1)', // 稍微降低透明度，更柔和
customClass: 'download-loading-mask' // 自定义样式类
})
return axios({
method: 'get',
url: url,
responseType: 'blob',
headers: {
'Authorization': 'Bearer ' + getToken(),
'encryptResponse':false
}
}).then((res) => {
// 验证是否为blob格式
const isBlob = blobValidate(res.data)
if (isBlob) {
// 从响应头获取文件名，如果没有则使用默认名称
const fileName = res.headers['download-filename']
? decodeURIComponent(res.headers['download-filename'])
: defaultFileName
// 创建blob并下载
const blob = new Blob([res.data], {
type: res.data.type || 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
})
saveAs(blob, fileName)
Message.success('文件下载成功')
return Promise.resolve(fileName)
} else {
// 如果不是blob，尝试解析错误信息
return printErrMsg(res.data)
}
}).catch((error) => {
console.error('文件下载失败:', error)
Message.error('文件下载失败，请稍后重试')
return Promise.reject(error)
}).finally(() => {
// 关闭加载提示
if (downloadLoadingInstance) {
downloadLoadingInstance.close()
}
})
}
/**
* 打印错误信息
* @param {Blob} data - 错误响应的blob数据
*/
async function printErrMsg(data) {
try {
const resText = await data.text()
const rspObj = JSON.parse(resText)
Message.error(rspObj.msg || '下载失败，请稍后重试')
return Promise.reject(new Error(rspObj.msg || '下载失败'))
} catch (e) {
Message.error('下载失败，请稍后重试')
return Promise.reject(e)
}
}

410
src/views/common/ImportExcelDialog.vue Normal file
View File

@ -0,0 +1,410 @@
<template>
<el-dialog :title="title" :visible.sync="dialogVisible" width="450px" append-to-body @close="handleClose"
class="import-excel-dialog">
<div class="upload-container">
<el-upload ref="upload" :limit="1" accept=".xlsx, .xls" :headers="headers"
:action="uploadUrl + '?updateSupport=' + updateSupport" :disabled="isUploading"
:on-progress="handleFileUploadProgress" :on-success="handleFileSuccess" :on-error="handleFileError"
:before-upload="beforeUpload" :on-change="handleFileChange" :auto-upload="false" drag :data="params" class="custom-upload">
<div class="upload-content">
<i class="el-icon-upload upload-icon"></i>
<div class="upload-text">
<div class="main-text">将文件拖到此处</div>
<div class="sub-text">或<em>点击上传</em></div>
</div>
</div>
<div class="upload-tip" slot="tip">
<i class="el-icon-info"></i>
<span>仅允许导入 xls、xlsx 格式文件，单份文件大小上限 {{ maxFileTips }}</span>
</div>
</el-upload>
</div>
<div slot="footer" class="dialog-footer">
<el-button type="primary" class="confirm-btn" @click="handleSubmit" :loading="isUploading"
:disabled="isUploading">
<span v-if="!isUploading">确认</span>
<span v-else>上传中...</span>
</el-button>
<el-button class="cancel-btn" @click="handleClose">取消</el-button>
</div>
</el-dialog>
</template>
<script>
import { getToken } from '@/utils/auth'
export default {
name: 'ImportExcelDialog',
props: {
// 是否显示对话框
visible: {
type: Boolean,
default: false
},
// 对话框标题
title: {
type: String,
default: '数据导入'
},
// 上传地址
uploadUrl: {
type: String,
required: true
},
maxFileTips: {
type: String,
default: '20MB',
},
params:{
type:Object,
default:()=>{}
}
},
data() {
return {
dialogVisible: false,
isUploading: false,
updateSupport: 0,
headers: {
Authorization: 'Bearer ' + getToken()
},
fileList: []
}
},
watch: {
visible: {
immediate: true,
handler(val) {
this.dialogVisible = val
if (val) {
// 打开对话框时重置状态
this.resetState()
}
}
},
dialogVisible(val) {
this.$emit('update:visible', val)
}
},
computed: {
// 将 maxFileTips 转换为字节数
maxFileSize() {
const tips = this.maxFileTips.toUpperCase()
const match = tips.match(/(\d+)(MB|KB|GB)/)
if (!match) return 20 * 1024 * 1024 // 默认 20MB
const size = parseInt(match[1])
const unit = match[2]
switch (unit) {
case 'KB':
return size * 1024
case 'MB':
return size * 1024 * 1024
case 'GB':
return size * 1024 * 1024 * 1024
default:
return 20 * 1024 * 1024
}
}
},
methods: {
// 添加文件变化监听
handleFileChange(file, fileList) {
this.fileList = fileList
},
// 文件上传前的验证
beforeUpload(file) {
// 验证文件大小
if (file.size > this.maxFileSize) {
this.$message.error(`文件大小不能超过 ${this.maxFileTips}`)
return false
}
// 验证文件类型
const isExcel = file.type === 'application/vnd.ms-excel' ||
file.type === 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' ||
file.name.endsWith('.xls') ||
file.name.endsWith('.xlsx')
if (!isExcel) {
this.$message.error('只能上传 xls、xlsx 格式的文件！')
return false
}
return true
},
// 重置状态
resetState() {
this.isUploading = false
this.updateSupport = 0
if (this.$refs.upload) {
this.$refs.upload.clearFiles()
}
},
// 文件上传进度
handleFileUploadProgress(event, file, fileList) {
this.isUploading = true
this.$emit('upload-progress', event, file, fileList)
},
// 文件上传成功
handleFileSuccess(response, file, fileList) {
this.isUploading = false
this.$refs.upload.clearFiles()
this.$emit('upload-success', response, file, fileList)
// 显示导入结果
if (response && response.msg) {
this.$alert(
"<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.msg + "</div>",
"导入结果",
{
dangerouslyUseHTMLString: true,
type: response.code === 200 ? 'success' : 'error'
}
)
}
// 成功后关闭对话框
if (response && response.code === 200) {
this.handleClose()
}
},
// 文件上传失败
handleFileError(error, file, fileList) {
this.isUploading = false
this.$message.error('文件上传失败，请稍后重试')
this.$emit('upload-error', error, file, fileList)
},
// 提交上传
handleSubmit() {
if (this.fileList.length > 0) {
this.$refs.upload.submit()
} else {
this.$message.warning('请先选择要上传的文件')
}
},
// 关闭对话框
handleClose() {
this.dialogVisible = false
this.resetState()
this.$emit('close')
}
}
}
</script>
<style scoped lang="scss">
// 对话框样式优化
::v-deep .import-excel-dialog {
.el-dialog {
border-radius: 8px;
overflow: hidden;
}
.el-dialog__header {
padding: 20px 24px;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
.el-dialog__title {
color: #fff;
font-size: 18px;
font-weight: 600;
}
.el-dialog__close {
color: #fff;
font-size: 20px;
&:hover {
color: rgba(255, 255, 255, 0.8);
}
}
}
.el-dialog__body {
padding: 30px 24px 20px;
}
}
// 上传容器
.upload-container {
width: 100%;
}
// 自定义上传样式
::v-deep .custom-upload {
.el-upload-dragger {
width: 100%;
height: 200px;
border: 2px dashed #d9d9d9;
border-radius: 8px;
background: #fafafa;
transition: all 0.3s ease;
cursor: pointer;
&:hover {
border-color: #409EFF;
background: #f0f7ff;
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(64, 158, 255, 0.15);
}
&.is-dragover {
border-color: #409EFF;
background: #e6f4ff;
border-style: solid;
}
}
.el-upload__input {
display: none;
}
}
// 上传内容区域
.upload-content {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 100%;
padding: 20px;
.upload-icon {
font-size: 64px;
color: #409EFF;
margin-bottom: 16px;
transition: all 0.3s ease;
}
.upload-text {
text-align: center;
.main-text {
font-size: 16px;
color: #333;
font-weight: 500;
margin-bottom: 8px;
}
.sub-text {
font-size: 14px;
color: #666;
em {
color: #409EFF;
font-style: normal;
font-weight: 500;
}
}
}
&:hover {
.upload-icon {
transform: scale(1.1);
color: #66b1ff;
}
}
}
// 上传提示
.upload-tip {
margin-top: 16px;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
gap: 6px;
color: #909399;
font-size: 13px;
i {
color: #909399;
font-size: 14px;
}
span {
line-height: 20px;
}
}
// 文件列表样式优化
::v-deep .el-upload-list {
margin-top: 16px;
.el-upload-list__item {
border-radius: 6px;
border: 1px solid #e4e7ed;
transition: all 0.3s ease;
&:hover {
border-color: #409EFF;
background: #f0f7ff;
}
.el-icon-document {
color: #409EFF;
}
.el-upload-list__item-name {
color: #333;
}
}
}
// 禁用状态
::v-deep .custom-upload.is-disabled {
.el-upload-dragger {
cursor: not-allowed;
opacity: 0.6;
&:hover {
border-color: #d9d9d9;
background: #fafafa;
transform: none;
box-shadow: none;
}
}
}
// 底部按钮样式（按照 ToolForm.vue 样式）
.dialog-footer {
text-align: center;
}
.confirm-btn {
width: 98px;
height: 36px;
background: #1F72EA;
box-shadow: 0px 4px 8px 0px rgba(51, 135, 255, 0.5);
border-radius: 4px;
color: #fff;
border: none;
font-size: 14px;
transition: all 0.3s;
&:hover {
background: #4A8BFF;
box-shadow: 0px 6px 12px 0px rgba(51, 135, 255, 0.6);
}
}
.cancel-btn {
width: 98px;
height: 36px;
background: #E5E5E5;
box-shadow: 0px 4px 8px 0px rgba(76, 76, 76, 0.2);
border-radius: 4px;
color: #333;
border: none;
font-size: 14px;
transition: all 0.3s;
&:hover {
background: #d0d0d0;
box-shadow: 0px 6px 12px 0px rgba(76, 76, 76, 0.3);
}
}
</style>

4
src/views/enterpriseLibrary/technical/components/LeftType.vue
View File

@ -57,14 +57,14 @@ export default {
watch: {
value(newVal) {
if (newVal) {
this.activeCategory = newVal
this.activeCategory = parseInt(newVal)
}
},
immediate: true
},
mounted() {
if (this.value) {
this.activeCategory = this.value;
this.activeCategory = parseInt(this.value);
}
},
created() {

65
src/views/enterpriseLibrary/technical/components/RightTable.vue
View File

@ -2,13 +2,13 @@
<!-- 技术方案列表 -->
<div class="right-table-card">
<TableModel :formLabel="formLabel" :showOperation="true" :showRightTools="false" ref="technicalTableRef"
:columnsList="columnsList" :request-api="listAPI" :sendParams="{'technicalSolutionTypeId':value }">
:columnsList="columnsList" :request-api="listAPI" :sendParams="sendParams" :autoLoad="false">
<template slot="tableTitle">
<h3>数据列表</h3>
</template>
<template slot="tableActions">
<el-button @click="handleAdd" :disabled="disabled" v-hasPermi="['enterpriseLibrary:technical:add']" class="add-btn"><i
class="el-icon-plus"></i> 新增</el-button>
<el-button @click="handleAdd" :disabled="disabled" v-hasPermi="['enterpriseLibrary:technical:add']"
class="add-btn"><i class="el-icon-plus"></i> 新增</el-button>
</template>
<template slot="technicalSolutionState">
<span>可引用</span>
@ -34,7 +34,7 @@
<script>
import TableModel from '@/components/TableModel2'
import { columnsList, formLabel } from './config'
import { listAPI,delDataAPI } from '@/api/enterpriseLibrary/technical/technical'
import { listAPI, delDataAPI } from '@/api/enterpriseLibrary/technical/technical'
import { encryptWithSM4 } from '@/utils/sm'
export default {
@ -61,16 +61,25 @@ export default {
}
},
watch: {
value(newVal){
if(newVal){
this.handleQuery();
}
},
immediate: true
value: {
handler(newVal) {
if (newVal) {
this.$nextTick(() => {
this.handleQuery();
})
}
},
immediate: true
}
},
computed:{
disabled(){
computed: {
disabled() {
return !this.value;
},
sendParams() {
return {
technicalSolutionTypeId: this.value
}
}
},
created() {
@ -114,7 +123,7 @@ export default {
/** 查看操作 */
handleDetail(row) {
console.log(row);
this.$router.push({
name: 'TechnicalDetail',
query: {
@ -131,24 +140,30 @@ export default {
},
/** 删除操作 */
handleDelete(row) {
this.$modal.confirm(`是否确认删除此数据项？`).then(() => {
// 显示加载遮罩
this.$modal.loading("正在删除，请稍候...");
delUser({ userId: row.userId }).then(res => {
this.$modal.closeLoading();
this.$confirm(`确定要删除方案类型"${raw.technicalSolutionName}"吗？删除后将无法恢复！`, '操作提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
dangerouslyUseHTMLString: true,
customClass: 'delete-confirm-dialog'
}).then(() => {
delDataAPI(
{
technicalSolutionTypeId: raw.technicalSolutionTypeId,
technicalSolutionId: row.technicalSolutionId
}
).then(res => {
if (res.code === 200) {
this.$modal.msgSuccess("删除成功");
this.$message.success('删除成功');
this.activeCategory = null;
this.handleQuery();
} else {
this.$modal.msgError(res.msg);
this.$message.error(res.msg || '删除失败');
}
}).catch(error => {
this.$modal.closeLoading();
this.$modal.msgError(error);
console.error('删除失败:', error);
});
}).catch(() => {
// 用户取消删除，不需要处理
});
})
},
},
}

1
src/views/enterpriseLibrary/technical/components/TechnicalDetail.vue
View File

@ -52,6 +52,7 @@ export default {
path: "/technical/index",
query: {
enterpriseId: encryptWithSM4(this.enterpriseId || '0'),
checkedCategory: encryptWithSM4(this.technicalSolutionTypeId + ''),
}
}
this.$tab.closeOpenPage(obj)

1
src/views/enterpriseLibrary/technical/components/TechnicalForm.vue
View File

@ -64,6 +64,7 @@ export default {
path: "/technical/index",
query: {
enterpriseId: encryptWithSM4(this.enterpriseId || '0'),
checkedCategory: encryptWithSM4(this.technicalSolutionTypeId + ''),
}
}
this.$tab.closeOpenPage(obj)

4
src/views/enterpriseLibrary/technical/components/config.js
View File

@ -3,7 +3,7 @@ export const formLabel = [
isShow: false, // 是否展示label
f_type: 'ipt',
f_label: '方案名称',
f_model: 'userName',
f_model: 'technicalName',
f_max: 32,
},
{
@ -12,7 +12,7 @@ export const formLabel = [
f_label: '建设性质',
f_model: 'natureConstruction',
f_selList: [],
f_dict: 'nature_construction',
f_dict: 'construction_nature',
},
{
isShow: false, // 是否展示label

25
src/views/enterpriseLibrary/technical/index.vue
View File

@ -34,36 +34,13 @@ export default {
},
data() {
return {
activeCategory: null,
activeCategory: this.$route.query.checkedCategory ? decryptWithSM4(this.$route.query.checkedCategory) : null,
enterpriseId: decryptWithSM4(this.$route.query.enterpriseId),
}
},
methods: {
handleCategoryChange(categoryId) {
this.activeCategory = categoryId
console.log('切换到分类:', categoryId)
},
handleAddCategory() {
console.log('添加分类')
},
handleCategoryCommand(command) {
if (command.type === 'edit') {
console.log('编辑分类:', command.id)
} else if (command.type === 'delete') {
console.log('删除分类:', command.id)
}
},
handleAddScheme() {
console.log('新增方案')
},
handleView(row) {
console.log('查看:', row)
},
handleEdit(row) {
console.log('编辑:', row)
},
handleDelete(row) {
console.log('删除:', row)
},
// 返回上一页
handleBack() {

240
src/views/enterpriseLibrary/tool/components/ToolForm.vue
View File

@ -5,58 +5,83 @@
<div>
<el-form :model="form" :rules="rules" ref="ruleForm" label-width="110px">
<el-form-item label="工器具名称" prop="toolName">
<el-input class="form-item" v-model="form.toolName" clearable show-word-limit
placeholder="请输入工器具名称" maxlength="32"></el-input>
<el-input class="form-item" v-model="form.toolName" clearable show-word-limit placeholder="请输入工器具名称"
maxlength="64" :disabled="isDisabled"></el-input>
</el-form-item>
<el-form-item label="规格型号" prop="model">
<el-input class="form-item" v-model="form.model" clearable show-word-limit
placeholder="请输入规格型号" maxlength="32"></el-input>
<el-input class="form-item" v-model="form.model" clearable show-word-limit placeholder="请输入规格型号"
maxlength="32" :disabled="isDisabled"></el-input>
</el-form-item>
<el-form-item label="单位" prop="unit">
<el-input class="form-item" v-model="form.unit" clearable show-word-limit
placeholder="请输入单位" maxlength="32"></el-input>
<el-input class="form-item" v-model="form.unit" clearable show-word-limit placeholder="请输入单位"
maxlength="32" :disabled="isDisabled"></el-input>
</el-form-item>
<el-form-item label="技术参数" prop="technicalParameters">
<el-input class="form-item" v-model="form.technicalParameters" clearable show-word-limit
placeholder="请输入技术参数" maxlength="32"></el-input>
placeholder="请输入技术参数" maxlength="100" :disabled="isDisabled"></el-input>
</el-form-item>
<el-form-item label="主要作用" prop="mainFunction">
<el-input class="form-item" v-model="form.mainFunction" clearable show-word-limit
placeholder="请输入主要作用" maxlength="32"></el-input>
placeholder="请输入主要作用" maxlength="100" :disabled="isDisabled"></el-input>
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input type="textarea" :autosize="{ minRows: 4, maxRows: 6 }" class="form-item"
v-model.trim="form.remark" clearable show-word-limit placeholder="请输入备注"
maxlength="300"></el-input>
<el-input type="textarea" :autosize="{ minRows: 2, maxRows: 4 }" class="form-item"
v-model.trim="form.remark" clearable show-word-limit placeholder="请输入备注"
maxlength="200" :disabled="isDisabled"></el-input>
</el-form-item>
<!-- 工器具图片 -->
<el-form-item label="工器具图片" prop="fileList" v-if="!isDisabled">
<UploadFile :fileList="form.fileList" :fileUploadRule="defaultParams.fileUploadRule"
@file-change="handleFileChange" @del-file="handleDelFile" type="tool" />
</el-form-item>
<el-form-item label="工器具图片" v-if="isDisabled">
<FileOrImageDisplay :file="form.fileList[0]" :image-url="form.url"/>
</el-form-item>
</el-form>
</div>
<span slot="footer" class="dialog-footer">
<el-button type="primary" class="confirm-btn" :disabled="disabled"
@click="submitForm('ruleForm')">确认</el-button>
@click="submitForm('ruleForm')" v-if="!isDisabled">确认</el-button>
<el-button class="cancel-btn" @click="handleClose" :disabled="disabled">取消</el-button>
</span>
</el-dialog>
</template>
<script>
import _ from 'lodash'
import UploadFile from '@/views/common/UploadFile.vue'
import FileOrImageDisplay from '@/views/common/FileOrImageDisplay.vue';
import { addDataAPI, editDataAPI, getDetailDataAPI } from '@/api/enterpriseLibrary/tool/tool'
// 默认参数
const defaultParams = {
fileUploadRule: {
fileUploadType: 'tools',
fields_json: '',
suffix: 'tools_database'
},
};
export default {
name: "TypeForm",
name: "ToolForm",
components: {
UploadFile,
FileOrImageDisplay
},
props: ["width", "rowData", "title", "disabled", "isAdd"],
data() {
return {
lDialog: this.width > 500 ? "w700" : "w500",
dialogVisible: true,
isDisabled: true,
defaultParams,
form: {
id: null,
enterpriseId: this.rowData.enterpriseId,
technicalSolutionName: '',
model: '',
unit: '',
technicalParameters: '',
mainFunction: '',
remark: '',
fileList: [],
delFileList: []
},
rules: {
toolName: [
@ -68,33 +93,86 @@ export default {
unit: [
{ required: true, message: '单位不能为空', trigger: 'blur' }
],
fileList: [
{ required: true, message: '工器具图片不能为空', trigger: ['blur', 'change'] }
],
},
};
},
watch: {
isAdd: {
handler(newVal) {
if (newVal === 'edit') {
if (newVal === 'edit' || newVal === 'detail') {
this.initFormData();
}
},
immediate: true,
},
},
computed: {
isDisabled() {
return this.isAdd === 'detail';
}
},
methods: {
/** 初始化表单数据 */
initFormData() {
if (this.isAdd === 'edit' && this.rowData) {
// 编辑模式：填充表单数据
this.form = {
id: this.rowData.id,
toolName: this.rowData.toolName || '',
model: this.rowData.model || '',
unit: this.rowData.unit || '',
technicalParameters: this.rowData.technicalParameters || '',
mainFunction: this.rowData.mainFunction || '',
remark: this.rowData.remark || '',
async initFormData() {
if (!this.rowData) return;
const files = await this.getDetail();
// 编辑模式：填充表单数据
this.form = {
toolId: this.rowData.toolId,
enterpriseId: this.rowData.enterpriseId,
toolName: this.rowData.toolName || '',
model: this.rowData.model || '',
unit: this.rowData.unit || '',
technicalParameters: this.rowData.technicalParameters || '',
mainFunction: this.rowData.mainFunction || '',
remark: this.rowData.remark || '',
fileList: Array.isArray(files) ? files : [],
delFileList: [],
};
if(this.isDisabled){
this.rules = [];
this.$set(this.form, 'url', files[0]?.lsFilePath || null);
}
},
async getDetail() {
try {
const res = await getDetailDataAPI({ toolId: this.rowData.toolId, enterpriseId: this.rowData.enterpriseId });
if (res && res.code === 200) {
return this.getFileList(res.data);
}
return [];
} catch (error) {
console.error(error);
return [];
}
},
getFileList(detailData){
const list = detailData && Array.isArray(detailData.resourceFileVoList)
? detailData.resourceFileVoList
: [];
return list.map(item => {
return {
name: item.fileName,
filePath: item.filePath,
lsFilePath: item.lsFilePath,
fileType: item.fileType
};
});
},
// 文件变化
handleFileChange(file) {
console.log(file);
this.form.fileList = file;
},
// 文件删除时触发
handleDelFile(file) {
console.log(file);
const delPath = file?.response?.fileRes?.filePath || file?.filePath || null;
if (delPath) {
this.form.delFileList.push(delPath);
}
},
/*关闭弹窗 */
@ -123,46 +201,80 @@ export default {
this.$emit('handleQuery');
this.handleClose();
},
/**验证 */
submitForm(formName) {
this.$refs[formName].validate(valid => {
if (valid) {
// 显示遮罩层
this.loading = this.$loading({
lock: true,
text: "数据提交中，请稍候...",
background: 'rgba(0,0,0,0.5)',
target: this.$el.querySelector('.el-dialog') || document.body
})
let params = _.cloneDeep(this.form);
if (this.isAdd === 'add') {
addDataClassAPI(params).then(res => {
this.loading.close();
if (res.code === 200) {
this.handleReuslt(res);
} else {
this.$modal.msgError(res.msg);
}
}).catch(error => {
this.loading.close();
this.$modal.msgError(this.errorMsg(error));
});
validate(formName) {
return new Promise((resolve, reject) => {
this.$refs[formName].validate((valid) => {
if (valid) {
resolve(this.form) // 校验成功返回表单数据
} else {
updateDataClassAPI(params).then(res => {
this.loading.close();
if (res.code === 200) {
this.handleReuslt(res);
} else {
this.$modal.msgError(res.msg);
}
}).catch(error => {
this.loading.close();
this.$modal.msgError(this.errorMsg(error));
});
reject(new Error('数据未填写完整'))
}
})
})
},
/**验证 */
async submitForm(formName) {
try {
const data = await this.validate(formName);
// 所有校验通过，组装完整数据
let formData = {
...data,
allFiles: [
...data.fileList.map(file => JSON.parse(JSON.stringify(file))),
],
delFiles: [
...data.delFileList
]
}
});
let allFiles = formData.allFiles.map(file => {
return file?.response?.fileRes ? {
...file.response.fileRes,
} : null;
}).filter(item => item !== null);
formData.files = allFiles;
delete formData.fileList;
delete formData.delFileList;
delete formData.allFiles;
// 显示遮罩层
this.loading = this.$loading({
lock: true,
text: "数据提交中，请稍候...",
background: 'rgba(0,0,0,0.5)',
target: this.$el.querySelector('.el-dialog') || document.body
})
console.log('所有表单校验通过，完整数据:', formData)
const res = await this.saveData(formData)
if (res.code === 200) {
this.handleReuslt(res);
} else {
this.$modal.msgError(res.msg);
}
} catch (error) {
} finally {
this.loading.close();
}
},
// 保存接口
async saveData(formData) {
return new Promise((resolve, reject) => {
if (this.isAdd === 'add') { // 新增
addDataAPI(formData).then(res => {
resolve(res)
}).catch(error => {
reject(error)
})
} else { // 修改
editDataAPI(formData).then(res => {
resolve(res)
}).catch(error => {
reject(error)
})
}
})
},
}
};

12
src/views/enterpriseLibrary/tool/config.js
View File

@ -3,16 +3,16 @@ export const formLabel = [
isShow: false, // 是否展示label
f_type: 'ipt',
f_label: '工器具名称',
f_model: 'userName',
f_model: 'toolName',
f_max: 32,
f_width: '250px',
},
]
export const columnsList = [
{ t_props: 'userName', t_label: '名称' },
{ t_props: 'nickName', t_label: '规格型号' },
{ t_props: 'phonenumberDes', t_label: '单位' },
{ t_props: 'phonenumberDes', t_label: '技术参数' },
{ t_props: 'phonenumberDes', t_label: '主要作用' },
{ t_props: 'toolName', t_label: '工器具名称' },
{ t_props: 'model', t_label: '规格型号' },
{ t_props: 'unit', t_label: '单位' },
{ t_props: 'technicalParameters', t_label: '技术参数' },
{ t_props: 'mainFunction', t_label: '主要作用' },
]

130
src/views/enterpriseLibrary/tool/index.vue
View File

@ -8,35 +8,36 @@
</el-button>
</div>
<div class="table-container">
<TableModel :formLabel="formLabel" :showOperation="true" :showRightTools="false" ref="userTableRef"
:columnsList="columnsList" :request-api="listUser">
<TableModel :formLabel="formLabel" :showOperation="true" :showRightTools="false" ref="toolTableRef"
:columnsList="columnsList" :request-api="listAPI" :sendParams= "sendParams">
<template slot="tableTitle">
<h3>数据列表</h3>
</template>
<template slot="tableActions">
<el-button @click="handleAdd" v-hasPermi="['enterpriseLibrary:technical:add']"
<el-button @click="handleModelExport" v-hasPermi="['enterpriseLibrary:tool:add']"
class="add-btn">导入模板下载</el-button>
<el-button @click="handleAdd" v-hasPermi="['enterpriseLibrary:technical:add']"
class="add-btn">导入模板下载</el-button>
<el-button @click="handleAdd" v-hasPermi="['enterpriseLibrary:technical:add']" class="add-btn"><i
<el-button @click="handleBathchImport" v-hasPermi="['enterpriseLibrary:tool:import']"
class="add-btn">批量导入</el-button>
<el-button @click="handleAdd" v-hasPermi="['enterpriseLibrary:tool:add']" class="add-btn"><i
class="el-icon-plus"></i> 新增工器具</el-button>
</template>
<template slot="deptName" slot-scope="{ data }">
<span>{{ data.dept.deptName || '--' }}</span>
</template>
<template slot="handle" slot-scope="{ data }">
<el-button type="text" v-hasPermi="['enterpriseLibrary:technical:detail']" class="action-btn"
@click="handleUpdate(data)">
<el-button type="text" v-hasPermi="['enterpriseLibrary:tool:detail']" class="action-btn"
@click="handleDetail(data)">
查看
</el-button>
<el-button type="text" v-hasPermi="['enterpriseLibrary:technical:edit']" class="action-btn"
<el-button type="text" v-hasPermi="['enterpriseLibrary:tool:edit']" class="action-btn"
style="color: #EAA819;" @click="handleUpdate(data)">
编辑
</el-button>
<el-button type="text" v-hasPermi="['enterpriseLibrary:technical:del']" class="action-btn"
<el-button type="text" v-hasPermi="['enterpriseLibrary:tool:del']" class="action-btn"
style="color: #DB3E29;" @click="handleDelete(data)">
删除
</el-button>
</template>
</TableModel>
</div>
@ -44,6 +45,17 @@
<!-- 添加方案类型弹窗 -->
<ToolForm ref="toolForm" v-if="isflag" :isAdd="isAdd" :rowData="row" @handleQuery="handleQuery" :title="title"
@closeDialog="closeDialog" :width="600" />
<!-- 批量导入弹窗 -->
<ImportExcelDialog
:visible.sync="importExcelDialogVisible"
ref="importExcelDialog"
title="工器具导入"
:upload-url="importExcelDialogUploadUrl"
@upload-success="handleImportSuccess"
@close="handleImportClose"
:maxFileTips="maxFileTips"
:params = "params"
/>
</el-card>
</template>
@ -51,43 +63,47 @@
import TableModel from '@/components/TableModel2'
import { columnsList, formLabel } from './config'
import ToolForm from './components/ToolForm.vue'
import {
listUser,
delUser,
} from '@/api/system/user'
import { listAPI, delDataAPI } from '@/api/enterpriseLibrary/tool/tool'
import { encryptWithSM4, decryptWithSM4 } from '@/utils/sm'
import { downloadFileWithLoading } from '@/utils/download'
import ImportExcelDialog from '@/views/common/ImportExcelDialog'
const IMPORT_URL = '/smartBid/mainDatabase/tool/importData';
export default {
name: 'Tool',
components: {
TableModel,
ToolForm
ToolForm,
ImportExcelDialog
},
dicts: ['construction_nature', 'structural_form', 'basic_form'],
data() {
return {
formLabel,
columnsList,
listUser,
listAPI,
enterpriseId: decryptWithSM4(this.$route.query.enterpriseId) || '0',
title: "",
isflag: false,
isAdd: '',
row: {},
maxFileTips:'20MB',
importExcelDialogVisible: false,
// 批量导入上传地址（需要根据实际API接口修改）
importExcelDialogUploadUrl: process.env.VUE_APP_BASE_API + IMPORT_URL,
params:{
enterpriseId: decryptWithSM4(this.$route.query.enterpriseId) || '0',
},
}
},
created() {
// 将字典数据填充到表单配置的下拉选项中
if (Array.isArray(this.formLabel)) {
this.formLabel.forEach((item) => {
if (item.f_dict && this.dict && this.dict.type && this.dict.type[item.f_dict]) {
this.$set(item, 'f_selList', this.dict.type[item.f_dict])
}
})
},
computed:{
sendParams(){
return {
enterpriseId : this.enterpriseId
}
}
},
methods: {
// 返回上一页
handleBack() {
@ -103,44 +119,75 @@ export default {
handleAdd() {
this.title = "新增工器具";
this.isAdd = 'add';
this.row = {};
this.row = {enterpriseId:this.enterpriseId};
this.isflag = true;
},
/** 修改操作 */
handleUpdate(row) {
this.title = "修改";
this.title = "修改工器具";
this.isAdd = 'edit';
this.row = row;
this.isflag = true;
},
/* 查看操作 */
handleDetail(row){
this.title = "查看详情";
this.isAdd = 'detail';
this.row = row;
this.isflag = true;
},
// 模板下载
handleModelExport() {
downloadFileWithLoading(
'smartBid/commonDownload/downLoadToolModel',
'工器具导入模板.xlsx',
'正在下载模板，请稍候...'
)
},
// 批量导入
handleBathchImport(){
this.importExcelDialogVisible = true;
},
handleImportSuccess() {
this.handleQuery();
},
handleImportClose() {
this.handleQuery();
},
closeDialog() {
this.isflag = false;
},
/* 搜索操作 */
handleQuery() {
this.$refs.userTableRef.getTableList()
this.$refs.toolTableRef.getTableList()
},
/** 删除操作 */
handleDelete(row) {
this.$modal.confirm(`是否确认删除此数据项？`).then(() => {
// 显示加载遮罩
this.$modal.loading("正在删除，请稍候...");
delUser({ userId: row.userId }).then(res => {
this.$modal.closeLoading();
this.$confirm(`确定要删除"${row.toolName}"吗？删除后将无法恢复！`, '操作提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
dangerouslyUseHTMLString: true,
customClass: 'delete-confirm-dialog'
}).then(() => {
delDataAPI(
{
toolId: row.toolId,
enterpriseId: this.enterpriseId
}
).then(res => {
if (res.code === 200) {
this.$modal.msgSuccess("删除成功");
this.$message.success('删除成功');
this.handleQuery();
} else {
this.$modal.msgError(res.msg);
this.$message.error(res.msg || '删除失败');
}
}).catch(error => {
this.$modal.closeLoading();
this.$modal.msgError(error);
console.error('删除失败:', error);
});
}).catch(() => {
// 用户取消删除，不需要处理
});
})
},
},
}
@ -203,5 +250,4 @@ export default {
margin-right: 0;
}
}
</style>