dom转word

This commit is contained in:
Teo
2025-07-04 19:57:23 +08:00
parent 7f5300b4f4
commit d1cf9a1a74
10 changed files with 13842 additions and 189 deletions

View File

@ -5,7 +5,7 @@ VITE_APP_TITLE = 新能源项目管理平台
VITE_APP_ENV = 'development' VITE_APP_ENV = 'development'
# 开发环境 # 开发环境
VITE_APP_BASE_API = 'http://192.168.110.148:8899' VITE_APP_BASE_API = 'http://192.168.110.119:8899'
# 无人机接口地址 # 无人机接口地址

View File

@ -211,6 +211,8 @@
</div> </div>
<script type="text/javascript" <script type="text/javascript"
src="http://58.17.134.85:7363/changxieoffice/web-apps/apps/api/documents/api.js"></script> src="http://58.17.134.85:7363/changxieoffice/web-apps/apps/api/documents/api.js"></script>
<script src="/js/html-docx.js"></script>
<script src="./src/assets/sdk/YJEarth.min.js"></script> <script src="./src/assets/sdk/YJEarth.min.js"></script>
<script src="./src/utils/reconnecting-websocket.js"></script> <script src="./src/utils/reconnecting-websocket.js"></script>
<script type="module" src="/src/main.ts"></script> <script type="module" src="/src/main.ts"></script>

13216
public/js/html-docx.js Normal file

File diff suppressed because it is too large Load Diff

View File

@ -16,6 +16,20 @@ export const listContactformtemplate = (query?: ContactformtemplateQuery): Axios
}); });
}; };
/**
* 查询联系单模板类型列表
* @param query
* @returns {*}
*/
export const listContactTypeformtemplate = (query?: ContactformtemplateQuery): AxiosPromise<ContactformtemplateVO[]> => {
return request({
url: '/cory/contactformtemplate/listNoPage',
method: 'get',
params: query
});
};
/** /**
* 查询联系单模板详细 * 查询联系单模板详细
* @param id * @param id

View File

@ -0,0 +1,63 @@
import request from '@/utils/request';
import { AxiosPromise } from 'axios';
import { ContactnoticeVO, ContactnoticeForm, ContactnoticeQuery } from '@/api/cory/contactnotice/types';
/**
* 查询联系单列表
* @param query
* @returns {*}
*/
export const listContactnotice = (query?: ContactnoticeQuery): AxiosPromise<ContactnoticeVO[]> => {
return request({
url: '/cory/contactnotice/list',
method: 'get',
params: query
});
};
/**
* 查询联系单详细
* @param id
*/
export const getContactnotice = (id: string | number): AxiosPromise<ContactnoticeVO> => {
return request({
url: '/cory/contactnotice/' + id,
method: 'get'
});
};
/**
* 新增联系单
* @param data
*/
export const addContactnotice = (data: ContactnoticeForm) => {
return request({
url: '/cory/contactnotice',
method: 'post',
data: data
});
};
/**
* 修改联系单
* @param data
*/
export const updateContactnotice = (data: ContactnoticeForm) => {
return request({
url: '/cory/contactnotice',
method: 'put',
data: data
});
};
/**
* 删除联系单
* @param id
*/
export const delContactnotice = (id: string | number | Array<string | number>) => {
return request({
url: '/cory/contactnotice/' + id,
method: 'delete'
});
};

View File

@ -0,0 +1,65 @@
export interface ContactnoticeVO {
/**
* 自增ID
*/
id: string | number;
/**
* 项目ID
*/
projectId: string | number;
/**
* 模板类型
*/
type: number;
/**
* 文档内容
*/
detail: string;
}
export interface ContactnoticeForm extends BaseEntity {
/**
* 自增ID
*/
id?: string | number;
/**
* 项目ID
*/
projectId?: string | number;
/**
* 模板类型
*/
type?: number | string;
/**
* 文档内容
*/
detail?: string;
}
export interface ContactnoticeQuery extends PageQuery {
/**
* 项目ID
*/
projectId?: string | number;
/**
* 模板类型
*/
type?: number;
/**
* 文档内容
*/
detail?: string;
/**
* 日期范围参数
*/
params?: any;
}

View File

@ -22,19 +22,19 @@
<el-col :span="1.5"> <el-col :span="1.5">
<el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['cory:contactformtemplate:add']">新增</el-button> <el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['cory:contactformtemplate:add']">新增</el-button>
</el-col> </el-col>
<el-col :span="1.5"> <!-- <el-col :span="1.5">
<el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['cory:contactformtemplate:edit']" <el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['cory:contactformtemplate:edit']"
>修改</el-button >修改</el-button
> >
</el-col> </el-col> -->
<el-col :span="1.5"> <el-col :span="1.5">
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['cory:contactformtemplate:remove']" <el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['cory:contactformtemplate:remove']"
>删除</el-button >删除</el-button
> >
</el-col> </el-col>
<el-col :span="1.5"> <!-- <el-col :span="1.5">
<el-button type="warning" plain icon="Download" @click="handleExport" v-hasPermi="['cory:contactformtemplate:export']">导出</el-button> <el-button type="warning" plain icon="Download" @click="handleExport" v-hasPermi="['cory:contactformtemplate:export']">导出</el-button>
</el-col> </el-col> -->
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar> <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
</el-row> </el-row>
</template> </template>
@ -48,17 +48,20 @@
<image-preview :src="scope.row.thumbnail" :width="50" :height="50" /> <image-preview :src="scope.row.thumbnail" :width="50" :height="50" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="模板路径" align="center" prop="path"> <!-- <el-table-column label="模板路径" align="center" prop="path">
<template #default="scope"> <template #default="scope">
<span class="text-blue cursor-pointer" @click="openDoc(scope.row)">{{ scope.row.path }}</span></template <span class="text-blue cursor-pointer" @click="openDoc(scope.row)">{{ scope.row.path }}</span></template
> >
</el-table-column> </el-table-column> -->
<el-table-column label="备注" align="center" prop="remark" /> <!-- <el-table-column label="备注" align="center" prop="remark" /> -->
<el-table-column label="操作" align="center" class-name="small-padding fixed-width"> <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template #default="scope"> <template #default="scope">
<!-- <el-tooltip content="修改" placement="top"> <!-- <el-tooltip content="修改" placement="top">
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['cory:contactformtemplate:edit']"></el-button> <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['cory:contactformtemplate:edit']"></el-button>
</el-tooltip> --> </el-tooltip> -->
<el-tooltip content="查看" placement="top">
<el-button link type="primary" icon="View" @click="openDoc(scope.row)" v-hasPermi="['cory:contactformtemplate:edit']"></el-button>
</el-tooltip>
<el-tooltip content="下载" placement="top"> <el-tooltip content="下载" placement="top">
<el-button <el-button
link link
@ -97,6 +100,7 @@
ref="fileUploadRef" ref="fileUploadRef"
:data="{ name: form.name, projectId: currentProject.id }" :data="{ name: form.name, projectId: currentProject.id }"
uploadUrl="/cory/contactformtemplate" uploadUrl="/cory/contactformtemplate"
:onUploadSuccess="handleUploadSuccess"
/> />
</el-form-item> </el-form-item>
<!-- <el-form-item label="备注" prop="remark"> <!-- <el-form-item label="备注" prop="remark">
@ -263,15 +267,17 @@ const submitForm = () => {
// } // }
uploadData.bo.name = form.value.name; uploadData.bo.name = form.value.name;
console.log('🚀 ~ contactformtemplateFormRef.value?.validate ~ uploadData:', uploadData); fileUploadRef.value!.submitUpload();
await fileUploadRef.value!.submitUpload();
proxy?.$modal.msgSuccess('操作成功');
dialog.visible = false;
await getList();
} }
}); });
}; };
const handleUploadSuccess = () => {
proxy?.$modal.msgSuccess('操作成功');
dialog.visible = false;
getList();
};
/** 删除按钮操作 */ /** 删除按钮操作 */
const handleDelete = async (row?: ContactformtemplateVO) => { const handleDelete = async (row?: ContactformtemplateVO) => {
const _ids = row?.id || ids.value; const _ids = row?.id || ids.value;

View File

@ -1,6 +1,6 @@
<template> <template>
<div class="content-box"> <div class="content-box">
<el-table :data="[form, { ...form, id: '2' }]" @selection-change="handleSelectionChange"> <el-table :data="data" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" /> <el-table-column type="selection" width="55" align="center" />
<el-table-column align="center" prop="projectName" label="工程名称" /> <el-table-column align="center" prop="projectName" label="工程名称" />
<el-table-column align="center" prop="serialNumber" label="编号" /> <el-table-column align="center" prop="serialNumber" label="编号" />
@ -13,77 +13,103 @@
</el-table-column> </el-table-column>
<el-table-column align="center" label="附件"> <el-table-column align="center" label="附件">
<template #default="{ row }"> <template #default="{ row }">
<a v-if="row.attachments" :href="row.attachments" target="_blank">查看附件</a> <!-- <a v-if="row.attachments" :href="row.attachments" target="_blank"></a> -->
<span v-else></span> <el-link type="primary" :underline="false" @click="openFile(row.attachments)" target="_blank">查看附件</el-link>
</template> </template>
</el-table-column> </el-table-column>
<!-- 分段标题施工项目部 --> <!-- 分段标题施工项目部 -->
<el-table-column label="施工项目部" align="center"> <el-table-column label="施工项目部" align="center">
<el-table-column align="center" prop="contractorLeader" label="项目负责人" /> <el-table-column align="center" prop="contractorLeader" label="项目负责人" />
<el-table-column align="center" prop="contractorDate" label="日期" /> <el-table-column align="center" prop="contractorDate" label="日期">
<template #default="{ row }">
{{ dayjs(row.contractorDate).format('YYYY-MM-DD') }}
</template>
</el-table-column>
</el-table-column> </el-table-column>
<!-- 分段标题项目监理机构 --> <!-- 分段标题项目监理机构 -->
<el-table-column label="项目监理机构" align="center"> <el-table-column label="项目监理机构" align="center">
<el-table-column align="center" prop="supervisorLeader" label="总监理工程师" /> <el-table-column align="center" prop="supervisorLeader" label="总监理工程师" />
<el-table-column align="center" prop="supervisorDate" label="日期" /> <el-table-column align="center" prop="supervisorDate" label="日期">
<template #default="{ row }">
{{ dayjs(row.supervisorDate).format('YYYY-MM-DD') }}
</template>
</el-table-column>
</el-table-column> </el-table-column>
<!-- 分段标题建设单位 --> <!-- 分段标题建设单位 -->
<el-table-column label="建设单位" align="center"> <el-table-column label="建设单位" align="center">
<el-table-column align="center" prop="ownerRep" label="业主代表" /> <el-table-column align="center" prop="ownerRep" label="业主代表" />
<el-table-column align="center" prop="ownerDate" label="日期" /> <el-table-column align="center" prop="ownerDate" label="日期">
<template #default="{ row }">
{{ dayjs(row.ownerDate).format('YYYY-MM-DD') }}
</template>
</el-table-column>
</el-table-column> </el-table-column>
<el-table-column align="center" prop="content" label="操作" width="160"> <el-table-column align="center" prop="content" label="操作" width="160">
<template #default="scope"> <template #default="scope">
<el-button link type="success" icon="View" @click="handleDetail(scope.row)" class="ml-3"> 详情 </el-button> <el-button link type="success" icon="View" @click="handleDetail(scope.row)" class="ml-3"> 详情 </el-button>
<el-button link type="primary" icon="Download" @click="handleDelete(scope.row)"> 下载 </el-button> <el-button link type="primary" icon="Download" @click="handleDownload()"> 下载 </el-button>
<el-button link type="warning" icon="Edit" @click="handleDelete(scope.row)"> 修改 </el-button> <!-- <el-button link type="warning" icon="Edit" @click="handleDelete(scope.row)"> 修改 </el-button> -->
<el-button link type="danger" icon="Delete" @click="handleDelete(scope.row)"> 删除 </el-button> <el-button link type="danger" icon="Delete" @click="handleDelete(scope.row)"> 删除 </el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<pagination v-show="total > 0" :total="total" v-model:page="form.pageNum" v-model:limit="form.pageSize" @pagination="getList" />
<!-- 详情 --> <!-- 详情 -->
<el-dialog title="联系单详情" v-model="detailVisible" width="60vw"> <el-dialog title="联系单详情" v-model="detailVisible" width="1000">
<div class="w80% ma"> <div class="w[850px] ma word-export-wrapper" ref="exportRef">
<h2 style="text-align: center; margin-top: 5px; font-weight: bold">联系单</h2> <div class="w80% ma">
<el-row> <h2 style="text-align: center; margin-top: 5px; font-weight: bold">联系单</h2>
<el-col :span="12" style="text-align: left">工程名称</el-col> <el-row>
<el-col :span="12" style="text-align: right">编号123123123132</el-col> <el-col :span="12" style="text-align: left">工程名称{{ tableDetail.projectName }}</el-col>
</el-row> <el-col :span="12" style="text-align: right">编号{{ tableDetail.serialNumber }}</el-col>
<el-descriptions :column="2" border style="margin-top: 8px" label-width="160px" size="large"> </el-row>
<el-descriptions-item label-align="center" label="致:" :span="2" class-name="zebra"> </el-descriptions-item> <el-descriptions :column="2" border style="margin-top: 8px" label-width="160px" size="large">
<el-descriptions-item label-align="center" label="主题" :span="2" label-class-name="white"> </el-descriptions-item> <el-descriptions-item label-align="center" label="致:" :span="2" class-name="zebra"> {{ tableDetail.to }}</el-descriptions-item>
<el-descriptions-item label-align="center" label="内容" :span="2" class-name="zebra"> <el-descriptions-item label-align="center" label="主题" :span="2" label-class-name="white">
Lorem ipsum, dolor sit amet consectetur adipisicing elit. Aspernatur molestiae nam sunt laudantium, illum praesentium dolorum. Mollitia, {{ tableDetail.subject }}</el-descriptions-item
exercitationem. Veritatis recusandae est quas libero, placeat laborum. Ab enim eaque magni ratione. >
</el-descriptions-item> <el-descriptions-item label-align="center" label="内容" :span="2" class-name="zebra">
<el-descriptions-item label-align="center" label="附件" :span="2" label-class-name="white"> </el-descriptions-item> {{ tableDetail.content }}
</el-descriptions> </el-descriptions-item>
<el-descriptions border direction="vertical" size="large"> <el-descriptions-item label-align="center" label="附件" :span="2" label-class-name="white">
<el-descriptions-item label-align="center" label="施工项目部" class-name="none"></el-descriptions-item> <el-link type="primary" :underline="false" :href="tableDetail.url" target="_blank">{{ tableDetail.originalName }}</el-link>
</el-descriptions> </el-descriptions-item>
<el-descriptions :column="2" border label-width="160px" size="large"> </el-descriptions>
<el-descriptions-item label-align="center" label="项目负责人" label-class-name="white"> </el-descriptions-item> <el-descriptions border direction="vertical" size="large">
<el-descriptions-item label-align="center" label="日期" label-class-name="white"> </el-descriptions-item> <el-descriptions-item label-align="center" label="施工项目部" class-name="none"></el-descriptions-item>
</el-descriptions> </el-descriptions>
<el-descriptions border direction="vertical" size="large"> <el-descriptions :column="2" border label-width="160px" size="large">
<el-descriptions-item label-align="center" label="项目监理机构" class-name="none"></el-descriptions-item> <el-descriptions-item label-align="center" label="项目负责人" label-class-name="white">
</el-descriptions> {{ tableDetail.contractorLeader }}</el-descriptions-item
<el-descriptions :column="2" border label-width="160px" size="large"> >
<el-descriptions-item label-align="center" label="项目负责人" label-class-name="white"> </el-descriptions-item> <el-descriptions-item label-align="center" label="日期" label-class-name="white">
<el-descriptions-item label-align="center" label="日期" label-class-name="white"> </el-descriptions-item> {{ dayjs(tableDetail.contractorDate).format('YYYY-MM-DD') }}</el-descriptions-item
</el-descriptions> >
<el-descriptions border direction="vertical" size="large"> </el-descriptions>
<el-descriptions-item label-align="center" label="建设单位" class-name="none"></el-descriptions-item> <el-descriptions border direction="vertical" size="large">
</el-descriptions> <el-descriptions-item label-align="center" label="项目监理机构" class-name="none"> </el-descriptions-item>
<el-descriptions :column="2" border label-width="160px" size="large"> </el-descriptions>
<el-descriptions-item label-align="center" label="项目负责人" label-class-name="white"> </el-descriptions-item> <el-descriptions :column="2" border label-width="160px" size="large">
<el-descriptions-item label-align="center" label="日期" label-class-name="white"> </el-descriptions-item> <el-descriptions-item label-align="center" label="项目负责人" label-class-name="white">
</el-descriptions> {{ tableDetail.supervisorLeader }}</el-descriptions-item
>
<el-descriptions-item label-align="center" label="日期" label-class-name="white">
{{ dayjs(tableDetail.supervisorDate).format('YYYY-MM-DD') }}</el-descriptions-item
>
</el-descriptions>
<el-descriptions border direction="vertical" size="large">
<el-descriptions-item label-align="center" label="建设单位" class-name="none"></el-descriptions-item>
</el-descriptions>
<el-descriptions :column="2" border label-width="160px" size="large">
<el-descriptions-item label-align="center" label="项目负责人" label-class-name="white"> {{ tableDetail.ownerRep }}</el-descriptions-item>
<el-descriptions-item label-align="center" label="日期" label-class-name="white">
{{ dayjs(tableDetail.ownerDate).format('YYYY-MM-DD') }}</el-descriptions-item
>
</el-descriptions>
</div>
</div> </div>
<template #footer> <template #footer>
<!-- <span> <!-- <span>
@ -96,8 +122,18 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
const emit = defineEmits(['selection-change']); import { listByIds } from '@/api/system/oss';
import { saveAs } from 'file-saver';
import { dayjs } from 'element-plus';
const exportRef = ref<HTMLElement>();
const emit = defineEmits(['selection-change', 'delete']);
const props = defineProps({
data: {
type: Array,
default: () => []
}
});
const form = reactive({ const form = reactive({
id: '1', id: '1',
projectName: '', projectName: '',
@ -115,6 +151,9 @@ const form = reactive({
pageNum: 1, pageNum: 1,
pageSize: 10 pageSize: 10
}); });
const tableDetail = ref<any>({});
const total = ref(0); const total = ref(0);
const detailVisible = ref(false); const detailVisible = ref(false);
@ -124,11 +163,70 @@ const handleSelectionChange = (selection: any) => {
emit('selection-change', selection); emit('selection-change', selection);
}; };
const handleDetail = (row) => { const handleDetail = async (row) => {
const res = await listByIds(row.attachments);
tableDetail.value = {
...row,
...res.data[0]
};
console.log('🚀 ~ handleDetail ~ tableDetail.value:', tableDetail.value);
detailVisible.value = true; detailVisible.value = true;
}; };
const getList = (row) => {};
const handleDelete = (row) => {}; const handleDownload = () => {
const style = `
<style>
.white { background: #fff !important; }
.none { display: none !important; }
.zebra { background: #f5f7fa !important; }
.el-descriptions__table { table-layout: fixed !important; }
table { border-collapse: collapse; width: 100%; }
th, td { border: 1px solid #333; padding: 6px; font-size: 14px; }
</style>
`;
const el = exportRef.value;
if (!el) return;
// 拷贝 DOM避免修改原内容
const clone = el.cloneNode(true) as HTMLElement;
applyInlineTableStyles(clone);
// 包裹 HTML 内容
const html = `
<html>
<head>
<meta charset="utf-8">
${style}
</head>
<body>
${clone.innerHTML}
</body>
</html>
`;
const blob = (window as any).htmlDocx.asBlob(html);
saveAs(blob, '工程变更申请单.docx');
};
const applyInlineTableStyles = (rootEl: HTMLElement) => {
rootEl.querySelectorAll('table').forEach((table) => {
table.setAttribute('style', 'width:100%; border-collapse:collapse; table-layout:fixed; border:1px solid #333;');
});
rootEl.querySelectorAll('th, td').forEach((cell) => {
cell.setAttribute('style', 'border:1px solid #333; padding:6px; font-size:14px; word-break:break-all;');
});
};
const handleDelete = (row) => {
emit('delete', row.id);
};
const openFile = async (url: string) => {
const res = await listByIds(url);
window.open(res.data[0].url);
};
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

View File

@ -1,6 +1,6 @@
<template> <template>
<div class="content-box"> <div class="content-box">
<el-table :data="[form]" style="width: 100%" @selection-change="handleSelectionChange"> <el-table :data="data" style="width: 100%" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" /> <el-table-column type="selection" width="55" align="center" />
<el-table-column align="center" prop="projectName" label="工程名称" /> <el-table-column align="center" prop="projectName" label="工程名称" />
<el-table-column align="center" prop="unitName" label="提出单位" /> <el-table-column align="center" prop="unitName" label="提出单位" />
@ -12,11 +12,11 @@
</el-table-column> </el-table-column>
<el-table-column align="center" prop="bookName" label="卷册名称" /> <el-table-column align="center" prop="bookName" label="卷册名称" />
<el-table-column align="center" prop="bookNo" label="卷册号" /> <el-table-column align="center" prop="bookNo" label="卷册号" />
<el-table-column align="center" label="附图"> <!-- <el-table-column align="center" label="附图">
<template #default="{ row }"> <template #default="{ row }">
<ImagePreview :src="row.hasAttachment" disabled :width="80" /> <ImagePreview :src="row.hasAttachment" disabled :width="80" />
</template> </template>
</el-table-column> </el-table-column> -->
<!-- <el-table-column align="center" prop="changeReasons" label="变更原因" width="100"> <!-- <el-table-column align="center" prop="changeReasons" label="变更原因" width="100">
<template #default="{ row }"> <template #default="{ row }">
{{ row.changeReasons?.join(', ') }} {{ row.changeReasons?.join(', ') }}
@ -24,8 +24,8 @@
</el-table-column> --> </el-table-column> -->
<el-table-column align="center" prop="changeContent" label="变更内容" /> <el-table-column align="center" prop="changeContent" label="变更内容" />
<el-table-column align="center" prop="costEstimate" label="变更费用估算" /> <el-table-column align="center" prop="costEstimate" label="变更费用估算" />
<!--
<el-table-column label="施工承包单位" align="center"> <!-- <el-table-column label="施工承包单位" align="center">
<el-table-column align="center" prop="contractorManager" label="项目经理" width="100" /> <el-table-column align="center" prop="contractorManager" label="项目经理" width="100" />
<el-table-column align="center" prop="contractorDate" label="日期" width="130"> <el-table-column align="center" prop="contractorDate" label="日期" width="130">
<template #default="{ row }">{{ formatDate(row.contractorDate) }}</template> <template #default="{ row }">{{ formatDate(row.contractorDate) }}</template>
@ -64,83 +64,118 @@
<el-table-column align="center" prop="content" label="操作" width="160"> <el-table-column align="center" prop="content" label="操作" width="160">
<template #default="scope"> <template #default="scope">
<el-button link type="success" icon="View" @click="handleDetail(scope.row)" class="ml-3"> 详情 </el-button> <el-button link type="success" icon="View" @click="handleDetail(scope.row)" class="ml-3"> 详情 </el-button>
<el-button link type="primary" icon="Download" @click="handleDelete(scope.row)"> 下载 </el-button> <el-button link type="primary" icon="Download" @click="handleDownload()"> 下载 </el-button>
<el-button link type="warning" icon="Edit" @click="handleDelete(scope.row)"> 修改 </el-button> <!-- <el-button link type="warning" icon="Edit" @click="handleDelete(scope.row)"> 修改 </el-button> -->
<el-button link type="danger" icon="Delete" @click="handleDelete(scope.row)"> 删除 </el-button> <el-button link type="danger" icon="Delete" @click="handleDelete(scope.row)"> 删除 </el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<!-- 详情 --> <!-- 详情 -->
<el-dialog title="工程变更申请单详情" v-model="detailVisible" width="60vw"> <el-dialog title="工程变更申请单详情" v-model="detailVisible" width="1000">
<div class="w80% ma"> <div class="w[850px] ma word-export-wrapper" ref="exportRef">
<h2 style="text-align: center; margin-top: 5px; font-weight: bold">工程变更申请单</h2> <div class="w80% ma">
<el-row> <h2 style="text-align: center; margin-top: 5px; font-weight: bold">工程变更申请单</h2>
<el-col :span="12">编号123123123132</el-col> <el-row>
</el-row> <el-col :span="12">编号{{ tableDetail.id }}</el-col>
<el-descriptions :column="2" border style="margin-top: 8px" label-width="160px" size="large"> </el-row>
<el-descriptions-item label-align="center" label="工程名称" class-name="zebra"> </el-descriptions-item> <el-descriptions :column="2" border style="margin-top: 8px" label-width="160px" size="large">
<el-descriptions-item label-align="center" label="提出单位" class-name="zebra"> </el-descriptions-item> <el-descriptions-item label-align="center" label="工程名称" class-name="zebra"> {{ tableDetail.projectName }} </el-descriptions-item>
<el-descriptions-item label-align="center" label="专业" label-class-name="white"> </el-descriptions-item> <el-descriptions-item label-align="center" label="提出单位" class-name="zebra"> {{ tableDetail.unitName }} </el-descriptions-item>
<el-descriptions-item label-align="center" label="提出日期" label-class-name="white"> </el-descriptions-item> <el-descriptions-item label-align="center" label="专业" label-class-name="white"> {{ tableDetail.profession }} </el-descriptions-item>
<el-descriptions-item label-align="center" label="卷册名称" class-name="zebra"> </el-descriptions-item> <el-descriptions-item label-align="center" label="提出日期" label-class-name="white">
<el-descriptions-item label-align="center" label="卷册号" class-name="zebra"> </el-descriptions-item> {{ dayjs(tableDetail.applyDate).format('YYYY-MM-DD') }}
<el-descriptions-item label-align="center" label="附图" :span="2" label-class-name="white"> </el-descriptions-item> </el-descriptions-item>
<el-descriptions-item label-align="center" label="变更原因" :span="2" class-name="zebra"> <el-descriptions-item label-align="center" label="卷册名称" class-name="zebra"> {{ tableDetail.bookName }} </el-descriptions-item>
<el-checkbox-group v-model="form.changeReasons"> <el-descriptions-item label-align="center" label="卷册号" class-name="zebra"> {{ tableDetail.bookNo }} </el-descriptions-item>
<el-checkbox <el-descriptions-item label-align="center" label="附图" :span="2" label-class-name="white">
v-for="(item, index) in radioList" <image-preview :src="item.url" v-for="item in tableDetail.hasAttachmentList" width="200px" class="mr" />
:class="index % 2 == 0 ? 'w45%' : ''" </el-descriptions-item>
:label="item.label" <el-descriptions-item label-align="center" label="变更原因" :span="2" class-name="zebra">
:value="item.value" <el-checkbox-group v-model="tableDetail.changeReasons">
disabled <el-checkbox
/> v-for="(item, index) in radioList"
</el-checkbox-group> :class="index % 2 == 0 ? 'w45%' : ''"
</el-descriptions-item> :label="item.label"
<el-descriptions-item label-align="center" label="内容" :span="2" label-class-name="white"> :value="item.label"
Lorem ipsum, dolor sit amet consectetur adipisicing elit. Aspernatur molestiae nam sunt laudantium, illum praesentium dolorum. Mollitia, disabled
exercitationem. Veritatis recusandae est quas libero, placeat laborum. Ab enim eaque magni ratione. />
</el-descriptions-item> </el-checkbox-group>
<el-descriptions-item label-align="center" label="变更费用估算" :span="2" class-name="zebra"> </el-descriptions-item> </el-descriptions-item>
</el-descriptions> <el-descriptions-item label-align="center" label="内容" :span="2" label-class-name="white">
<el-descriptions border direction="vertical" size="large"> {{ tableDetail.changeContent }}
<el-descriptions-item label-align="center" label="施工承包单位" class-name="none"></el-descriptions-item> </el-descriptions-item>
</el-descriptions> <el-descriptions-item label-align="center" label="变更费用估算" :span="2" class-name="zebra">
<el-descriptions :column="2" border label-width="160px" size="large"> {{ tableDetail.costEstimate }}
<el-descriptions-item label-align="center" label="项目经理 " label-class-name="white"> </el-descriptions-item> </el-descriptions-item>
<el-descriptions-item label-align="center" label="日期" label-class-name="white"> </el-descriptions-item> </el-descriptions>
</el-descriptions> <el-descriptions border direction="vertical" size="large">
<el-descriptions border direction="vertical" size="large"> <el-descriptions-item label-align="center" label="施工承包单位" class-name="none"></el-descriptions-item>
<el-descriptions-item label-align="center" label="总承包单位" class-name="none"></el-descriptions-item> </el-descriptions>
</el-descriptions> <el-descriptions :column="2" border label-width="160px" size="large">
<el-descriptions :column="2" border label-width="160px" size="large"> <el-descriptions-item label-align="center" label="项目经理 " label-class-name="white">
<el-descriptions-item label-align="center" label="项目技术负责人" label-class-name="white"> </el-descriptions-item> {{ tableDetail.asupervisorLeader }}
<el-descriptions-item label-align="center" label="日期" label-class-name="white"> </el-descriptions-item> </el-descriptions-item>
</el-descriptions> <el-descriptions-item label-align="center" label="日期" label-class-name="white">
<el-descriptions border direction="vertical" size="large"> {{ dayjs(tableDetail.asupervisorDate).format('YYYY-MM-DD') }}
<el-descriptions-item label-align="center" label="设计单位" class-name="none"></el-descriptions-item> </el-descriptions-item>
</el-descriptions> </el-descriptions>
<el-descriptions :column="2" border label-width="160px" size="large"> <el-descriptions border direction="vertical" size="large">
<el-descriptions-item label-align="center" label="设计代表" label-class-name="white"> </el-descriptions-item> <el-descriptions-item label-align="center" label="总承包单位" class-name="none"></el-descriptions-item>
<el-descriptions-item label-align="center" label="日期" label-class-name="white"> </el-descriptions-item> </el-descriptions>
</el-descriptions> <el-descriptions :column="2" border label-width="160px" size="large">
<el-descriptions border direction="vertical" size="large"> <el-descriptions-item label-align="center" label="项目技术负责人" label-class-name="white">{{
<el-descriptions-item label-align="center" label="项目监理单位" class-name="none"></el-descriptions-item> tableDetail.bsupervisorLeader
</el-descriptions> }}</el-descriptions-item>
<el-descriptions :column="2" border label-width="160px" size="large"> <el-descriptions-item label-align="center" label="日期" label-class-name="white">
<el-descriptions-item label-align="center" label="总监理工程师" :span="2" label-class-name="white"> </el-descriptions-item> {{ dayjs(tableDetail.bsupervisorDate).format('YYYY-MM-DD') }}
<el-descriptions-item label-align="center" label="监理工程师" label-class-name="white"> </el-descriptions-item> </el-descriptions-item>
<el-descriptions-item label-align="center" label="日期" label-class-name="white"> </el-descriptions-item> </el-descriptions>
</el-descriptions> <el-descriptions border direction="vertical" size="large">
<el-descriptions border direction="vertical" size="large"> <el-descriptions-item label-align="center" label="设计单位" class-name="none"></el-descriptions-item>
<el-descriptions-item label-align="center" label="建设单位" class-name="none"></el-descriptions-item> </el-descriptions>
</el-descriptions> <el-descriptions :column="2" border label-width="160px" size="large">
<el-descriptions :column="2" border label-width="160px" size="large"> <el-descriptions-item label-align="center" label="设计代表" label-class-name="white">{{
<el-descriptions-item label-align="center" label="会签" :span="2" label-class-name="white"> </el-descriptions-item> tableDetail.csupervisorLeader
<el-descriptions-item label-align="center" label="负责人" label-class-name="white"> </el-descriptions-item> }}</el-descriptions-item>
<el-descriptions-item label-align="center" label="日期" label-class-name="white"> </el-descriptions-item> <el-descriptions-item label-align="center" label="日期" label-class-name="white">
</el-descriptions> {{ dayjs(tableDetail.csupervisorDate).format('YYYY-MM-DD') }}
</el-descriptions-item>
</el-descriptions>
<el-descriptions border direction="vertical" size="large">
<el-descriptions-item label-align="center" label="项目监理单位" class-name="none"></el-descriptions-item>
</el-descriptions>
<!-- 单独插入整行占用的内容 -->
<el-descriptions :column="2" border label-width="160px" size="large">
<el-descriptions-item label="总监理工程师" :span="2" label-align="center" label-class-name="white">
{{ tableDetail.dasupervisorLeader }}
</el-descriptions-item>
</el-descriptions>
<!-- 一组完整两列 -->
<el-descriptions :column="2" border label-width="160px" size="large">
<el-descriptions-item label="监理工程师" label-align="center" label-class-name="white">
{{ tableDetail.dsupervisorLeader }}
</el-descriptions-item>
<el-descriptions-item label="日期" label-align="center" label-class-name="white">
{{ dayjs(tableDetail.dsupervisorDate).format('YYYY-MM-DD') }}
</el-descriptions-item>
</el-descriptions>
<el-descriptions border direction="vertical" size="large">
<el-descriptions-item label-align="center" label="建设单位" class-name="none"></el-descriptions-item>
</el-descriptions>
<el-descriptions :column="2" border label-width="160px" size="large">
<!-- <el-descriptions-item label-align="center" label="会签" :span="2" label-class-name="white"> {{ tableDetail.esupervisorLeader }} </el-descriptions-item> -->
<el-descriptions-item label-align="center" label="负责人" label-class-name="white">
{{ tableDetail.esupervisorLeader }}
</el-descriptions-item>
<el-descriptions-item label-align="center" label="日期" label-class-name="white">
{{ dayjs(tableDetail.esupervisorDate).format('YYYY-MM-DD') }}
</el-descriptions-item>
</el-descriptions>
</div>
</div> </div>
<template #footer> <template #footer>
<!-- <span> <!-- <span>
<el-button @click="detailVisible = false">Cancel</el-button> <el-button @click="detailVisible = false">Cancel</el-button>
@ -152,8 +187,9 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { listByIds } from '@/api/system/oss';
import { dayjs } from 'element-plus'; import { dayjs } from 'element-plus';
import { saveAs } from 'file-saver';
const form = reactive({ const form = reactive({
projectName: '', projectName: '',
unitName: '', unitName: '',
@ -180,6 +216,14 @@ const form = reactive({
ownerDate: '' ownerDate: ''
}); });
const props = defineProps({
data: {
type: Array,
default: () => []
}
});
const tableDetail = ref<any>({});
const exportRef = ref<HTMLElement>();
const radioList = ref([ const radioList = ref([
{ value: 0, label: '设计漏项' }, { value: 0, label: '设计漏项' },
{ value: 1, label: '设计改进' }, { value: 1, label: '设计改进' },
@ -193,15 +237,70 @@ const radioList = ref([
const detailVisible = ref(false); const detailVisible = ref(false);
const formatDate = (val: string | Date) => (val ? dayjs(val).format('YYYY-MM-DD') : ''); const formatDate = (val: string | Date) => (val ? dayjs(val).format('YYYY-MM-DD') : '');
const handleDetail = (row) => { const handleDetail = async (row) => {
const res = await listByIds(row.hasAttachment);
tableDetail.value = {
...row,
hasAttachmentList: res.data
};
console.log(tableDetail.value);
detailVisible.value = true; detailVisible.value = true;
}; };
/** 多选框选中数据 */ /** 多选框选中数据 */
const emit = defineEmits(['selection-change']); const emit = defineEmits(['selection-change', 'delete']);
const handleSelectionChange = (selection: any) => { const handleSelectionChange = (selection: any) => {
emit('selection-change', selection); emit('selection-change', selection);
}; };
const handleDelete = (row) => {}; const handleDelete = (row) => {
emit('delete', row.id);
};
const handleDownload = () => {
const style = `
<style>
.white { background: #fff !important; }
.none { display: none !important; }
.zebra { background: #f5f7fa !important; }
.el-descriptions__table { table-layout: fixed !important; }
table { border-collapse: collapse; width: 100%; }
th, td { border: 1px solid #333; padding: 6px; font-size: 14px; }
</style>
`;
const el = exportRef.value;
if (!el) return;
// 拷贝 DOM避免修改原内容
const clone = el.cloneNode(true) as HTMLElement;
applyInlineTableStyles(clone);
// 包裹 HTML 内容
const html = `
<html>
<head>
<meta charset="utf-8">
${style}
</head>
<body>
${clone.innerHTML}
</body>
</html>
`;
const blob = (window as any).htmlDocx.asBlob(html);
saveAs(blob, '工程变更申请单.docx');
};
const applyInlineTableStyles = (rootEl: HTMLElement) => {
rootEl.querySelectorAll('table').forEach((table) => {
table.setAttribute('style', 'width:100%; border-collapse:collapse; table-layout:fixed; border:1px solid #333;');
});
rootEl.querySelectorAll('th, td').forEach((cell) => {
cell.setAttribute('style', 'border:1px solid #333; padding:6px; font-size:14px; word-break:break-all;');
});
};
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@ -216,4 +315,34 @@ const handleDelete = (row) => {};
:deep(.zebra) { :deep(.zebra) {
background: #f5f7fa; background: #f5f7fa;
} }
:deep(.el-descriptions__table) {
table-layout: fixed !important;
}
.word-export-wrapper {
table {
width: 100% !important;
border-collapse: collapse;
table-layout: fixed;
word-break: break-all;
}
th,
td {
border: 1px solid #333;
padding: 8px;
font-size: 14px;
text-align: left;
vertical-align: middle;
}
/* 确保不超出 Word 页边距 */
margin: 0 auto;
max-width: 100%;
overflow: hidden;
}
.el-descriptions__label {
font-weight: bold;
background-color: #f2f2f2;
}
</style> </style>

View File

@ -5,14 +5,14 @@
<el-card shadow="hover"> <el-card shadow="hover">
<el-form ref="queryFormRef" :model="queryParams" :inline="true"> <el-form ref="queryFormRef" :model="queryParams" :inline="true">
<el-form-item label="模板类型" prop="projectType"> <el-form-item label="模板类型" prop="projectType">
<el-select v-model="queryParams.projectType" value-key="" placeholder="请选择模板类型" clearable filterable @change=""> <el-select v-model="queryParams.projectType" placeholder="请选择模板类型" clearable filterable @change="selectType">
<el-option v-for="item in projectTypeOptions" :key="item.value" :label="item.label" :value="item.value"> </el-option> <el-option v-for="item in projectTypeOptions" :key="item.name" :label="item.name" :value="item.name"> </el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item> <!-- <el-form-item>
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button> <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
<el-button icon="Refresh" @click="resetQuery">重置</el-button> <el-button icon="Refresh" @click="resetQuery">重置</el-button>
</el-form-item> </el-form-item> -->
</el-form> </el-form>
</el-card> </el-card>
</div> </div>
@ -25,11 +25,11 @@
>新增</el-button >新增</el-button
> >
</el-col> </el-col>
<el-col :span="1.5"> <!-- <el-col :span="1.5">
<el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['quality:qualityInspection:edit']" <el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['quality:qualityInspection:edit']"
>修改</el-button >修改</el-button
> >
</el-col> </el-col> -->
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button
type="danger" type="danger"
@ -48,23 +48,29 @@
</el-row> </el-row>
</template> </template>
<!-- card body --> <!-- card body -->
<Contactform v-if="queryParams.projectType == '0'" @selection-change="handleSelectionChange"></Contactform> <Contactform
<EngineeringChangeApplicationForm v-if="queryParams.projectType == '联系单'"
v-if="queryParams.projectType == '1'"
@selection-change="handleSelectionChange" @selection-change="handleSelectionChange"
:data="tableData"
@delete="handleDelete"
></Contactform>
<EngineeringChangeApplicationForm
v-if="queryParams.projectType == '工程变更申请单'"
@selection-change="handleSelectionChange"
:data="tableData"
@delete="handleDelete"
></EngineeringChangeApplicationForm> ></EngineeringChangeApplicationForm>
<Notice v-if="queryParams.projectType == '2'" @selection-change="handleSelectionChange"></Notice> <Notice v-if="queryParams.projectType == '2'" @selection-change="handleSelectionChange" :data="tableData"></Notice>
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
</el-card> </el-card>
<el-dialog title="新增模板" v-model="dialogVisible" width="800"> <el-dialog title="新增模板" v-model="dialogVisible" width="800">
<el-form :model="form" :rules="rules" ref="formRef" label-width="110px"> <el-form :model="form" :rules="rules" ref="formRef" label-width="110px">
<div class="flex"> <div class="flex">
<img <!-- <img :src="thumbnailUrl" alt="" style="width: 150px;" /> -->
src="http://58.17.134.85:9000/xinnengyuan-dev/contactNotice/2025/07/03/2e735c2fda06492bb31342656fde1004.png" <div><image-preview :src="thumbnailUrl" width="150px"></image-preview></div>
alt=""
style="width: 150px" <div v-if="queryParams.projectType == '联系单'">
/>
<div v-if="queryParams.projectType == '0'">
<el-form-item label="工程名称" prop="projectName"> <el-form-item label="工程名称" prop="projectName">
<el-input v-model="form.projectName" placeholder="请输入工程名称" /> <el-input v-model="form.projectName" placeholder="请输入工程名称" />
</el-form-item> </el-form-item>
@ -106,7 +112,7 @@
<el-date-picker v-model="form.ownerDate" type="date" placeholder="选择日期" style="width: 100%" /> <el-date-picker v-model="form.ownerDate" type="date" placeholder="选择日期" style="width: 100%" />
</el-form-item> </el-form-item>
</div> </div>
<div v-if="queryParams.projectType === '1'"> <div v-if="queryParams.projectType === '工程变更申请单'">
<el-form-item label="工程名称"> <el-form-item label="工程名称">
<el-input v-model="form.projectName" /> <el-input v-model="form.projectName" />
</el-form-item> </el-form-item>
@ -156,42 +162,42 @@
<el-input v-model="form.costEstimate" /> <el-input v-model="form.costEstimate" />
</el-form-item> </el-form-item>
<el-divider class="mb-10! mt-10!">施工承包单位</el-divider> <el-divider class="mb-10! mt-10!">施工承包单位</el-divider>
<el-form-item label="项目经理" prop="supervisorLeader"> <el-form-item label="项目经理" prop="asupervisorLeader">
<el-input v-model="form.supervisorLeader" placeholder="请输入项目经理姓名" /> <el-input v-model="form.asupervisorLeader" placeholder="请输入项目经理姓名" />
</el-form-item> </el-form-item>
<el-form-item label="日期" prop="supervisorDate"> <el-form-item label="日期" prop="asupervisorDate">
<el-date-picker v-model="form.supervisorDate" type="date" placeholder="选择日期" style="width: 100%" /> <el-date-picker v-model="form.asupervisorDate" type="date" placeholder="选择日期" style="width: 100%" />
</el-form-item> </el-form-item>
<el-divider class="mb-10! mt-10!">总承包单位</el-divider> <el-divider class="mb-10! mt-10!">总承包单位</el-divider>
<el-form-item label="项目技术负责人" prop="supervisorLeader"> <el-form-item label="项目技术负责人" prop="bsupervisorLeader">
<el-input v-model="form.supervisorLeader" placeholder="请输入项目技术负责人姓名" /> <el-input v-model="form.bsupervisorLeader" placeholder="请输入项目技术负责人姓名" />
</el-form-item> </el-form-item>
<el-form-item label="日期" prop="supervisorDate"> <el-form-item label="日期" prop="bsupervisorDate">
<el-date-picker v-model="form.supervisorDate" type="date" placeholder="选择日期" style="width: 100%" /> <el-date-picker v-model="form.bsupervisorDate" type="date" placeholder="选择日期" style="width: 100%" />
</el-form-item> </el-form-item>
<el-divider class="mb-10! mt-10!">设计单位</el-divider> <el-divider class="mb-10! mt-10!">设计单位</el-divider>
<el-form-item label="设计代表" prop="supervisorLeader"> <el-form-item label="设计代表" prop="csupervisorLeader">
<el-input v-model="form.supervisorLeader" placeholder="请输入设计代表姓名" /> <el-input v-model="form.csupervisorLeader" placeholder="请输入设计代表姓名" />
</el-form-item> </el-form-item>
<el-form-item label="日期" prop="supervisorDate"> <el-form-item label="日期" prop="csupervisorDate">
<el-date-picker v-model="form.supervisorDate" type="date" placeholder="选择日期" style="width: 100%" /> <el-date-picker v-model="form.csupervisorDate" type="date" placeholder="选择日期" style="width: 100%" />
</el-form-item> </el-form-item>
<el-divider class="mb-10! mt-10!">项目监理单位</el-divider> <el-divider class="mb-10! mt-10!">项目监理单位</el-divider>
<el-form-item label="监理工程师" prop="supervisorLeader"> <el-form-item label="监理工程师" prop="dsupervisorLeader">
<el-input v-model="form.supervisorLeader" placeholder="请输入监理工程师姓名" /> <el-input v-model="form.dsupervisorLeader" placeholder="请输入监理工程师姓名" />
</el-form-item> </el-form-item>
<el-form-item label="总监理工程师" prop="supervisorLeader"> <el-form-item label="总监理工程师" prop="dasupervisorLeader">
<el-input v-model="form.supervisorLeader" placeholder="请输入总监理工程师姓名" /> <el-input v-model="form.dasupervisorLeader" placeholder="请输入总监理工程师姓名" />
</el-form-item> </el-form-item>
<el-form-item label="日期" prop="supervisorDate"> <el-form-item label="日期" prop="dsupervisorDate">
<el-date-picker v-model="form.supervisorDate" type="date" placeholder="选择日期" style="width: 100%" /> <el-date-picker v-model="form.dsupervisorDate" type="date" placeholder="选择日期" style="width: 100%" />
</el-form-item> </el-form-item>
<el-divider class="mb-10! mt-10!">建设单位</el-divider> <el-divider class="mb-10! mt-10!">建设单位</el-divider>
<el-form-item label="负责人" prop="supervisorLeader"> <el-form-item label="负责人" prop="esupervisorLeader">
<el-input v-model="form.supervisorLeader" placeholder="请输入负责人姓名" /> <el-input v-model="form.esupervisorLeader" placeholder="请输入负责人姓名" />
</el-form-item> </el-form-item>
<el-form-item label="日期" prop="supervisorDate"> <el-form-item label="日期" prop="esupervisorDate">
<el-date-picker v-model="form.supervisorDate" type="date" placeholder="选择日期" style="width: 100%" /> <el-date-picker v-model="form.esupervisorDate" type="date" placeholder="选择日期" style="width: 100%" />
</el-form-item> </el-form-item>
</div> </div>
<div v-if="queryParams.projectType === '2'"> <div v-if="queryParams.projectType === '2'">
@ -255,6 +261,8 @@ import type { FormInstance, FormRules } from 'element-plus';
import Contactform from './components/contactform.vue'; import Contactform from './components/contactform.vue';
import EngineeringChangeApplicationForm from './components/engineeringChangeApplicationForm.vue'; import EngineeringChangeApplicationForm from './components/engineeringChangeApplicationForm.vue';
import Notice from './components/notice.vue'; import Notice from './components/notice.vue';
import { listContactTypeformtemplate } from '@/api/cory/contactformtemplate';
import { addContactnotice, delContactnotice, listContactnotice } from '@/api/cory/contactnotice';
const { proxy } = getCurrentInstance() as ComponentInternalInstance; const { proxy } = getCurrentInstance() as ComponentInternalInstance;
// 获取用户 store // 获取用户 store
@ -266,6 +274,9 @@ const { safety_inspection_violation_type, safety_inspection_check_type } = toRef
); );
const teamOpt = ref([]); const teamOpt = ref([]);
const foremanOpt = ref([]); const foremanOpt = ref([]);
const thumbnailUrl = ref('');
const tableData = ref([]);
const total = ref(0);
const formRef = ref<FormInstance>(); const formRef = ref<FormInstance>();
const dialogVisible = ref<boolean>(false); const dialogVisible = ref<boolean>(false);
@ -275,7 +286,7 @@ const addSingle = ref<boolean>(false);
const single = ref<boolean>(true); const single = ref<boolean>(true);
const ids = ref<Array<string | number>>([]); const ids = ref<Array<string | number>>([]);
const projectTypeOptions = [ const projectTypeOptions = ref<any>([
{ {
value: '0', value: '0',
label: '联系单' label: '联系单'
@ -296,11 +307,9 @@ const projectTypeOptions = [
value: '4', value: '4',
label: '签证单' label: '签证单'
} }
]; ]);
const initFormData = { const initFormData = {
id: undefined,
projectId: currentProject.value?.id,
projectType: '', projectType: '',
projectName: '', projectName: '',
serialNumber: '', serialNumber: '',
@ -333,8 +342,9 @@ const data = reactive<PageData<any, any>>({
inspectionType: undefined, inspectionType: undefined,
inspectionStatus: undefined, inspectionStatus: undefined,
teamId: undefined, teamId: undefined,
type: undefined,
params: {}, params: {},
projectType: '0' projectType: undefined
}, },
rules: { rules: {
projectName: [{ required: true, message: '请输入工程名称', trigger: 'blur' }], projectName: [{ required: true, message: '请输入工程名称', trigger: 'blur' }],
@ -349,9 +359,21 @@ const data = reactive<PageData<any, any>>({
const { queryParams, form, rules } = toRefs(data); const { queryParams, form, rules } = toRefs(data);
const submitForm = () => { const submitForm = () => {
formRef.value?.validate((valid) => { formRef.value?.validate(async (valid) => {
if (valid) { if (valid) {
let data = {
type: queryParams.value.type,
projectId: currentProject.value?.id,
detail: JSON.stringify(form.value)
};
console.log('提交表单:', form); console.log('提交表单:', form);
const res = await addContactnotice(data);
if (res.code == 200) {
proxy.$modal.msgSuccess('添加成功');
dialogVisible.value = false;
formRef.value.resetFields();
getList();
}
} }
}); });
}; };
@ -371,8 +393,35 @@ const changeForeman = (value: string | number) => {
const handleQuery = () => {}; const handleQuery = () => {};
const resetQuery = () => {}; const resetQuery = () => {};
const getList = () => {}; const getList = async () => {
const handleDelete = () => {}; console.log(queryParams.value.projectType);
if (!queryParams.value.projectType) {
const res = await listContactTypeformtemplate(queryParams.value);
projectTypeOptions.value = res.data;
queryParams.value.projectType = res.data[0].name;
thumbnailUrl.value = res.data[0].thumbnail;
queryParams.value.type = res.data[0].id as string;
}
const res = await listContactnotice(queryParams.value);
res.rows = res.rows.map((item) => {
return {
...item,
...JSON.parse(item.detail)
};
});
tableData.value = res.rows;
total.value = res.total || 0;
};
const handleDelete = async (id?: string) => {
const _ids = id || ids.value;
await proxy?.$modal.confirm('是否确认删除识别记录编号为"' + _ids + '"的数据项?').finally();
const res = await delContactnotice(_ids);
if (res.code == 200) {
proxy.$modal.msgSuccess('删除成功');
getList();
}
};
const handleUpdate = () => {}; const handleUpdate = () => {};
/** 多选框选中数据 */ /** 多选框选中数据 */
@ -382,7 +431,18 @@ const handleSelectionChange = (selection: any) => {
multiple.value = !selection.length; multiple.value = !selection.length;
}; };
const selectType = (value: string) => {
queryParams.value.projectType = value;
thumbnailUrl.value = projectTypeOptions.value.filter((item) => item.name == value)[0].thumbnail;
queryParams.value.type = projectTypeOptions.value.filter((item) => item.name == value)[0].id;
getList();
};
const resetForm = () => { const resetForm = () => {
formRef.value?.resetFields(); formRef.value?.resetFields();
}; };
onMounted(() => {
getList();
});
</script> </script>