图片存储之BLOB : get field slot from row

最新推荐文章于 2023-06-06 14:54:40 发布
最新推荐文章于 2023-06-06 14:54:40 发布 · 73 阅读 · 0
文章标签：

#数据库

本文介绍了在使用SQLite时遇到的BLOB字段长度限制问题，并提供了解决方案：使用varchar存储文件路径而非BLOB数据，同时提供了保存和读取图片的具体实现代码。

谷歌了很多网站，全都没回答道正点上，最后还是在国外的一家网站上找到答案。

获得不到BLOB的原因，是因为 SQLite有些版本的限定长度最大为1MB所致。

所以最好不用BLOB字段，可以用vachar存文件地址，把BLOB保存为文件。

大家用的最多的可能是图片，现附上两端源代码

保存图片的

public static void saveMyBitmap(Context context, Bitmap mBitmap, String bitName) throws IOException { OutputStream outStream = context.openFileOutput(bitName + ".png", context.MODE_PRIVATE); mBitmap.compress(Bitmap.CompressFormat.PNG, 100, outStream); try { outStream.flush(); } catch (IOException e) { e.printStackTrace(); } try { outStream.close(); } catch (IOException e) { e.printStackTrace(); } }

获取图片相对简单些

InputStream in = openFileInput(wallpaper + ".png");

iteye_9380
关注
【我的Android进阶之旅】解决sqlcipher库：java.lang.IllegalStateException: get field slot from row 0 col 0 failed.
字节卷动
02-01 1259
一、背景 最近维护公司的大数据SDK，在大数据SDK里面加入了ANR的监控功能，并将ANR的相关信息通过大数据埋点的方式记录到了数据库中，然后大数据上报的时候上报到大数据平台，这样就可以实现ANR性能的监控功能。 但是，最近看友盟的大数据平台错误上， 有一个是调用大数据SDK上报时，查询数据库出现的异常，异常错误信息如下所示： java.lang.IllegalStateException:
【chromium】windows构建base库 3：gn + vs2022 args 设置及debug x86 构建
突围
02-07 909
x86 debug 构建 chromium
查找数据库里的blob字段并保存在文件中
qq_31479277的博客
08-03 633
BOOL CtestDlg::AnalysisFileContent(const CString &strFileName,const CString &strPath) { CppSQLite3DB *pDB=new CppSQLite3DB; pDB->open(ph_convertToUTF8(strPath,CP_ACP1).c_str()); CString strSQL = L
android 访问本地image url_JS在浏览器中base64、url、blob互相转换
weixin_39969143的博客
11-28 673
详细文章请关注公众号：程序员波波。或者点击文章最下方了解更多前往原文地址。在平时开发的时候，我们在处理文件，尤其是图片的时候，经常会跟base64、url、blob(file)这三种形式的内容打交道。base64格式一般都是以data:image/jpeg;base64,这种类似形式打头的一串很长的字符串。url一般以服务器地址或者路径(形如http://xxx.jpg或者/static/xxx....
golang mysql blob_golang: sql 操作插入字节数组([]byte)到BLOB字段类型
weixin_42566424的博客
03-04 1696
下列代码中较为特别的转换就是将字节数组写入到数据库中fmt.Sprintf("X'%x'", t) 注意插入的时候使用占位符x, 再有一个标志Xfunc toInsertSQL(dat map[string]interface{}) string {if nil == dat { return "" }var sql = "INSERT INTO " + tableNamevar keyStr, ...
golang mysql blob_如何往mysql里面存blob
weixin_39978282的博客
02-23 843
func SerialStruct2SqlUpdateParam(any interface{}) (string, error) {tp := reflect.TypeOf(any)if tp == nil {return “”, errors.New(“nil param”)}if tp.Kind() != reflect.Ptr {return "", errors.New("the par...
<!-- 📚📚📚 Pro-Table 文档: https://juejin.cn/post/7166068828202336263 --> <template> <!-- 查询表单 --> <SearchForm v-show="isShowSearch" :search="_search" :reset="_reset" :columns="searchColumns" :search-param="searchParam" :search-col="searchCol" /> <!-- 表格主体 --> <div class="card table-main"> <!-- 表格头部 操作按钮 --> <div class="table-header"> <div class="header-button-lf"> <slot name="tableHeader" :selected-list="selectedList" :selected-list-ids="selectedListIds" :is-selected="isSelected" /> </div> <div v-if="toolButton" class="header-button-ri"> <slot name="toolButton"> <el-button v-if="showToolButton('refresh')" :icon="Refresh" circle @click="refreshData" /> <el-button v-if="showToolButton('setting') && columns.length" :icon="Operation" circle @click="openColSetting" /> <el-button v-if="showToolButton('search') && searchColumns?.length" :icon="Search" circle @click="isShowSearch = !isShowSearch" /> </slot> </div> </div> <!-- 表格上方的提示信息 --> <div v-if="tableTipsFlag"> <slot name="tableTips"></slot> </div> <!-- 表格主体 --> <el-table ref="tableRef" v-bind="$attrs" :data="processTableData" :border="border" :row-key="rowKey" @selection-change="selectionChange" > <!-- 默认插槽 --> <slot /> <template v-for="item in tableColumns" :key="item"> <!-- selection || radio || index || expand || sort --> <el-table-column v-if="item.type && columnTypes.includes(item.type)" v-bind="item" :align="item.align ?? 'center'" :reserve-selection="item.type == 'selection'" :selectable="item.isSelectable"> <template #default="scope"> <!-- expand --> <template v-if="item.type == 'expand'"> <component :is="item.render" v-bind="scope" v-if="item.render" /> <slot v-else :name="item.type" v-bind="scope" /> </template> <!-- radio --> <el-radio v-if="item.type == 'radio'" v-model="radio" :label="scope.row[rowKey]"> <!-- <i></i> --> </el-radio> <!-- sort --> <el-tag v-if="item.type == 'sort'" class="move"> <el-icon> <DCaret /></el-icon> </el-tag> </template> </el-table-column> <!-- other --> <TableColumn v-if="!item.type && item.prop && item.isShow" :column="item"> <template v-for="slot in Object.keys($slots)" #[slot]="scope"> <slot :name="slot" v-bind="scope" /> </template> </TableColumn> </template> <!-- 插入表格最后一行之后的插槽 --> <template #append> <slot name="append" /> </template> <!-- 无数据 --> <template #empty> <div class="table-empty"> <slot name="empty"> <img src="@/assets/images/notData.png" alt="notData" /> <div>暂无数据</div> </slot> </div> </template> </el-table> <!-- 分页组件 --> <slot name="pagination"> <Pagination v-if="pagination" :pageable="pageable" :handle-size-change="handleSizeChange" :handle-current-change="handleCurrentChange" /> </slot> </div> <!-- 列设置 --> <ColSetting v-if="toolButton" ref="colRef" v-model:col-setting="colSetting" /> </template> <script setup lang="ts" name="ProTable"> import { ref, watch, provide, onMounted, unref, computed, reactive } from "vue"; import { ElTable } from "element-plus"; import { useTable } from "@/hooks/useTable"; import { useSelection } from "@/hooks/useSelection"; import { BreakPoint } from "@/components/Grid/interface"; import { ColumnProps, TypeProps } from "@/components/ProTable/interface"; import { Refresh, Operation, Search } from "@element-plus/icons-vue"; import { handleProp } from "@/utils"; import SearchForm from "@/components/SearchForm/index.vue"; import Pagination from "./components/Pagination.vue"; import ColSetting from "./components/ColSetting.vue"; import TableColumn from "./components/TableColumn.vue"; import Sortable from "sortablejs"; export interface ProTableProps { columns: ColumnProps[]; // 列配置项 ==> 必传 data?: any[]; // 静态 table data 数据，若存在则不会使用 requestApi 返回的 data ==> 非必传 requestApi?: (params: any) => Promise<any>; // 请求表格数据的 api ==> 非必传 requestAuto?: boolean; // 是否自动执行请求 api ==> 非必传（默认为true） requestError?: (params: any) => void; // 表格 api 请求错误监听 ==> 非必传 dataCallback?: (data: any) => any; // 返回数据的回调函数，可以对数据进行处理 ==> 非必传 title?: string; // 表格标题 ==> 非必传 pagination?: boolean; // 是否需要分页组件 ==> 非必传（默认为true） initParam?: any; // 初始化请求参数 ==> 非必传（默认为{}） border?: boolean; // 是否带有纵向边框 ==> 非必传（默认为true） toolButton?: ("refresh" | "setting" | "search")[] | boolean; // 是否显示表格功能按钮 ==> 非必传（默认为true） rowKey?: string; // 行数据的 Key，用来优化 Table 的渲染，当表格数据多选时，所指定的 id ==> 非必传（默认为 id） searchCol?: number | Record<BreakPoint, number>; // 表格搜索项 每列占比配置 ==> 非必传 { xs: 1, sm: 2, md: 2, lg: 3, xl: 4 } tableTipsFlag?: boolean; // 表格上方的提示信息 ==> 非必传 （默认为false） } // 接受父组件参数，配置默认值 const props = withDefaults(defineProps<ProTableProps>(), { columns: () => [], requestAuto: true, pagination: true, initParam: {}, border: true, toolButton: true, rowKey: "id", searchCol: () => ({ xs: 1, sm: 3, md: 3, lg: 4, xl: 5 }), tableTipsFlag: false }); // table 实例 const tableRef = ref<InstanceType<typeof ElTable>>(); // column 列类型 const columnTypes: TypeProps[] = ["selection", "radio", "index", "expand", "sort"]; // 是否显示搜索模块 const isShowSearch = ref(true); // 控制 ToolButton 显示 const showToolButton = (key: "refresh" | "setting" | "search") => { return Array.isArray(props.toolButton) ? props.toolButton.includes(key) : props.toolButton; }; // 单选值 const radio = ref(""); // 表格多选 Hooks const { selectionChange, selectedList, selectedListIds, isSelected } = useSelection(props.rowKey); // 表格操作 Hooks const { tableData, pageable, searchParam, searchInitParam, getTableList, search, reset, handleSizeChange, handleCurrentChange } = useTable(props.requestApi, props.initParam, props.pagination, props.dataCallback, props.requestError, tableRef); // 清空选中数据列表 const clearSelection = () => tableRef.value!.clearSelection(); // 初始化表格数据 && 拖拽排序 onMounted(() => { dragSort(); props.requestAuto && getTableList(); props.data && (pageable.value.total = props.data.length); }); // 处理表格数据 const processTableData = computed(() => { if (!props.data) return tableData.value; if (!props.pagination) return props.data; return props.data.slice( (pageable.value.pageNum - 1) * pageable.value.pageSize, pageable.value.pageSize * pageable.value.pageNum ); }); // 监听页面 initParam 改化，重新获取表格数据 watch(() => props.initParam, () => { // 将初始化initParam参数赋值给表单 searchParam.value = { ...searchParam.value, ...props.initParam, }; getTableList() }, { deep: true }); // 接收 columns 并设置为响应式 const tableColumns = reactive<ColumnProps[]>(props.columns); // 扁平化 columns const flatColumns = computed(() => flatColumnsFunc(tableColumns)); // 定义 enumMap 存储 enum 值（避免异步请求无法格式化单元格内容 || 无法填充搜索下拉选择） const enumMap = ref(new Map<string, { [key: string]: any }[]>()); const setEnumMap = async ({ prop, enum: enumValue }: ColumnProps) => { if (!enumValue) return; // 如果当前 enumMap 存在相同的值 return if (enumMap.value.has(prop!) && (typeof enumValue === "function" || enumMap.value.get(prop!) === enumValue)) return; // 当前 enum 为静态数据，则直接存储到 enumMap if (typeof enumValue !== "function") return enumMap.value.set(prop!, unref(enumValue!)); // 为了防止接口执行慢，而存储慢，导致重复请求，所以预先存储为[]，接口返回后再二次存储 enumMap.value.set(prop!, []); // 当前 enum 为后台数据需要请求数据，则调用该请求接口，并存储到 enumMap const { data } = await enumValue(); enumMap.value.set(prop!, data); }; const refreshData = () => { pageable.value.pageNum = 1; getTableList(); }; // 注入 enumMap provide("enumMap", enumMap); // 扁平化 columns 的方法 const flatColumnsFunc = (columns: ColumnProps[], flatArr: ColumnProps[] = []) => { columns.forEach(async col => { if (col._children?.length) flatArr.push(...flatColumnsFunc(col._children)); flatArr.push(col); // column 添加默认 isShow && isFilterEnum 属性值 col.isShow = col.isShow ?? true; col.isFilterEnum = col.isFilterEnum ?? true; // 设置 enumMap await setEnumMap(col); }); return flatArr.filter(item => !item._children?.length); }; // 过滤需要搜索的配置项 && 排序 const searchColumns = computed(() => { return flatColumns.value ?.filter(item => item.search?.el || item.search?.render) .sort((a, b) => a.search!.order! - b.search!.order!); }); // 设置 搜索表单默认排序 && 搜索表单项的默认值 searchColumns.value?.forEach((column, index) => { column.search!.order = column.search?.order ?? index + 2; const key = column.search?.key ?? handleProp(column.prop!); const defaultValue = column.search?.defaultValue; if (defaultValue !== undefined && defaultValue !== null) { searchInitParam.value[key] = defaultValue; searchParam.value[key] = defaultValue; } }); // 列设置 ==> 需要过滤掉不需要设置的列 const colRef = ref(); const colSetting = tableColumns!.filter(item => { const { type, prop, isShow } = item; return !columnTypes.includes(type!) && prop !== "operation" && isShow; }); const openColSetting = () => colRef.value.openColSetting(); // 定义 emit 事件 const emit = defineEmits<{ search: []; reset: []; dargSort: [{ newIndex?: number; oldIndex?: number }]; }>(); const _search = () => { search(); emit("search"); }; const _reset = () => { reset(); emit("reset"); }; // 拖拽排序 const dragSort = () => { const tbody = document.querySelector(".el-table__body-wrapper tbody") as HTMLElement; Sortable.create(tbody, { handle: ".move", animation: 300, onEnd({ newIndex, oldIndex }) { const [removedItem] = processTableData.value.splice(oldIndex!, 1); processTableData.value.splice(newIndex!, 0, removedItem); emit("dargSort", { newIndex, oldIndex }); } }); }; // 暴露给父组件的参数和方法 (外部需要什么，都可以从这里暴露出去) defineExpose({ element: tableRef, tableData: processTableData, radio, pageable, searchParam, searchInitParam, getTableList, search, reset, handleSizeChange, handleCurrentChange, clearSelection, enumMap, isSelected, selectedList, selectedListIds, refreshData: getTableList // 暴露刷新方法 }); </script> import { ref, computed } from "vue"; /** * @description 表格多选数据操作 * @param {String} rowKey 当表格可以多选时，所指定的 id * */ export const useSelection = (rowKey: string = "id") => { const isSelected = ref<boolean>(false); const selectedList = ref<{ [key: string]: any }[]>([]); // 当前选中的所有 ids 数组 const selectedListIds = computed((): string[] => { let ids: string[] = []; selectedList.value.forEach(item => ids.push(item[rowKey])); return ids; }); /** * @description 多选操作 * @param {Array} rowArr 当前选择的所有数据 * @return void */ const selectionChange = (rowArr: { [key: string]: any }[]) => { rowArr.length ? (isSelected.value = true) : (isSelected.value = false); selectedList.value = rowArr; }; return { isSelected, selectedList, selectedListIds, selectionChange }; }; <template> <div class="table-box"> <ProTable ref="proTable" :columns="columns" :request-api="getTableList" :data-callback="dataCallback"> <!-- 表格 header 按钮 --> <template #tableHeader="scope"> <el-button type="primary" v-if="hasBtnPermission('asset:inventory:save')" @click="addNewData('新增资产','add',{})">新增资产</el-button> <el-button type="primary" v-if="hasBtnPermission('asset:inventory:update')" @click="batcEdit(scope.selectedListIds)">批量编辑</el-button> <el-button type="primary" v-if="hasBtnPermission('asset:inventory:delete')" @click="batchDelete(scope.selectedListIds)">批量删除</el-button> <el-dropdown style="margin-left: 10px" v-if="hasBtnPermission('asset:inventory:downloadData')" @command="batchExport"> <el-button type="primary"> 批量导出<i class="el-icon-arrow-down el-icon--right"></i> </el-button> <template #dropdown> <el-dropdown-menu> <el-dropdown-item command="1">导出所选数据</el-dropdown-item> <el-dropdown-item command="2">导出全部</el-dropdown-item> </el-dropdown-menu> </template> </el-dropdown> <el-button type="primary" @click="openTagPrint(scope.selectedListIds)" v-if="hasBtnPermission('asset:inventory:printMark')" style="margin-left: 10px">打印资产标签</el-button> </template> <el-table-column type="selection" width="55"></el-table-column> <!-- 图片 --> <el-table-column prop="imageUrl" label="图片" minWidth="100px" class-name="is-center"> <template #default="{ row }"> <div class="more_imgs" v-if="row.imageUrlList && row.imageUrlList.length > 0"> <viewer :images="row.imageUrlList"> <span class="viewImage" v-for="(itemImg, index) in row.imageUrlList" :key="index"> <img v-if="itemImg" :src="itemImg" style="width: 100%; height: 100%" /> </span> </viewer> </div> </template> </el-table-column> <template #expand="scope"> {{ scope.row }} </template> <template #operation="scope" v-if="hasBtnPermission('asset:inventory:update')" > <el-button type="primary" link @click="editData('编辑资产','edit', scope.row)">编辑</el-button> </template> </ProTable> <!-- 选择新增资产类型 --> <div class="new-Dialog-type" v-if="dialogFormVisible"> <el-dialog v-model="dialogFormVisible" title="选择资产类型" width="450" draggable > <el-form ref="ruleFormRef" :model="form" :rules="rules" label-width="93px"> <el-form-item label="类型" prop="type"> <el-select v-model="form.type" placeholder="请选择"> <el-option v-for="item in assetType" :key="item.value" :label="item.label" :value="item.value"></el-option> </el-select> </el-form-item> <el-form-item label="非标准资产" v-if="form.type === 2" prop="nonStandardAssetsId"> <el-select v-model="form.nonStandardAssetsId" placeholder="请选择"> <el-option v-for="item in nonstandardData" :key="item.id" :label="item.name" :value="item.id" :disabled="item.status == 0" ></el-option> </el-select> </el-form-item> </el-form> <template #footer> <div class="dialog-footer"> <el-button @click="closeDialog">取消</el-button> <el-button type="primary" @click="nextTips('新增资产','add',{})">下一步</el-button> </div> </template> </el-dialog> </div> <!-- 编辑，批量编辑，新增组件 --> <addAsset ref="addAssetRef" @previous-step="handlePreviousStep"/> <!-- 详情公共组件 --> <assetInfo ref="assetInfoRef"></assetInfo> </div> </template> <script setup lang="tsx" name="assetInventory"> import { ref, reactive, inject, onMounted,nextTick } from "vue"; import ProTable from "@/components/ProTable/index.vue"; import { assetListData ,queryGroupList,addAssetList,deleteAssetList,assetListDown,editBatchAssetList,assetListInfo,editAssetList} from "@/api/modules/assetAllocation"; import { ProTableInstance } from "@/components/ProTable/interface"; import { setTreeData,formatToTree } from "@/utils/tools"; import { assetClassificationList,getPositionList,setValueClildList,nonstandardList,getOrgSubjectList,getInstitution } from '@/api/modules/public'; import { getUserDepartment } from "@/api/modules/user"; import { assetListType,assetType,markStatusType } from "@/utils/dict"; import { da, fa, pa } from "element-plus/es/locale"; import addAsset from "./mode/addAsset.vue"; import assetInfo from "./mode/assetInfo.vue"; import { useHandleData } from "@/hooks/useHandleData"; import { ElMessage, FormInstance } from "element-plus"; import { printAssetMark } from "@/api/modules/assetAllocation"; import moment from "moment"; const hasBtnPermission: any = inject('hasBtnPermission'); // ProTable 实例 const proTable = ref<ProTableInstance>(); // 子界面需要用到的设置值 const configuration = reactive({ assetCategory: [], // 资产分类 positionList: [], // 存放地点 departmentList: [], // 使用部门 sourceList: [], // 资产来源 nonstandardList: [], // 非标准资产 unitList:[], // 计量单位 institutionalEntity:[], //机构主体 assentityList:[], // 主体 assinstitutional:[],//机构 }) const selectedIds = ref<string[]>([]); // 在组件顶部定义 // 非标准资产 const nonstandardData = ref([]); const assentityList = ref([]) const assinstitutional = ref([]) // 资产类型弹窗 const dialogFormVisible = ref(false) const form = reactive({ type:'', nonStandardAssetsId:'' }) const rules = reactive({ type: [{ required: true, message: "请选择资产类型", trigger: ["blur", "change"] }], nonStandardAssetsId: [{ required: true, message: "请选择非标准资产", trigger: ["blur", "change"] }], }) const getTableList = (params: any) => { if (params.purchaseDate) { params.purchaseDateStart = params.purchaseDate[0] + ' 00:00:00'; params.purchaseDateEnd= params.purchaseDate[1] + ' 23:59:59'; delete params.purchaseDate; } if (params.maintenanceExpirationDate) { params.maintenanceExpirationDateStart = params.maintenanceExpirationDate[0] + ' 00:00:00'; params.maintenanceExpirationDateEnd = params.maintenanceExpirationDate[1] + ' 23:59:59'; delete params.maintenanceExpirationDate; } if(params.useUserNameData) { params.useUserNameList = params.useUserNameData.split('\n'); delete params.useUserNameData } if(params.assetCodeData) { params.assetCodeList = params.assetCodeData.split('\n'); delete params.assetCodeData } return assetListData(params) } const refreshTable = () => { proTable.value!.pageable.pageNum = 1; proTable.value?.refreshData(); // 清除表格勾选项 if (proTable.value) { proTable.value.clearSelection(); } }; const dataCallback = (data: any) => { const dataList = data?.dataList || []; const processedList = dataList.map(item => { try { return { ...item, imageUrlList: typeof item?.imageUrl === 'string' ? item.imageUrl.split(',') : [], purchaseDate: item.purchaseDate ? item.purchaseDate.split(" ")[0] : '' }; } catch (error) { return { ...item, imageUrlList: [] }; } }); return { list: processedList, total: data?.totalCount, pageNum: data?.page, pageSize: data?.pageSize }; }; // 查询计量单位 const getUnitList = async () => { const response = await setValueClildList({dictCode: 'UNIT_MEASUREMENT'}); const data = response.data || []; configuration.unitList = data } // 查询机构主体 const getOrgSubjectListData = async() => { // 机构 const responseAss = await getInstitution({ id: 'ASS_INSTITUTIONAL' }); const data = responseAss.data || []; if(data && data.length > 0) { configuration.assinstitutional = data assinstitutional.value = data } // 主体 const response = await getInstitution({ id: 'OFFICIAL_SEAL_ORG' }); const data1 = response.data || []; if(data1 && data1.length > 0) { configuration.assentityList = data1 assentityList.value = data1 } // 机构主体（二和一接口），用来把主体，机构以及部门三者关联起来，单独调用上面接口，主要是为了排序好看，无语子...... const res = await getOrgSubjectList({}); const data2 = res.data || []; if(data && data.length > 0) { configuration.institutionalEntity = data2 } } const formatToDepTree = (arr, pid = 0) =>{ let result = []; for (let i = 0; i < arr.length; i++) { if (arr[i].pid === pid) { arr[i].label = arr[i].name let children = formatToDepTree(arr, arr[i].workOADepartmentId); if (children.length > 0) { arr[i].children = children; } result.push(arr[i]); } } return result; } // 表格配置项 const columns = reactive([ { prop: "assetStatus", label: "资产状态", fixed: "left", minWidth:100 , enum: assetListType, search: { el: "select", props: { filterable: true } }, render: scope => { if (scope.row.assetStatus == '1') { return ( <span style="color: #49c625">空闲</span> ); } else if (scope.row.assetStatus == '2') { return ( <span style="color: #ff7f00">在用</span> ); } else if (scope.row.assetStatus == '3') { return ( <span style="color: #1890ff">已处置</span> ); } } }, { prop: "markStatus", label: "资产标记", isShow:false, enum:markStatusType, search: { el: "select", props: { filterable: true } }, fieldNames: { label: "label", value: "value" } }, { prop: "markTagsName", label: "资产标记", fixed: "left", minWidth:100 , render: scope => { if (scope.row.markTags == '0') { return ( <span style="color: #49c625">派发待领用</span> ); } else if (scope.row.markTags == '1') { return ( <span style="color: #ff7f00">领用审批中</span> ); } else if (scope.row.markTags == '2') { return ( <span style="color: #ff7f00">退还审批中</span> ); } else if (scope.row.markTags == '3') { return ( <span style="color: #ff7f00">借用审批中</span> ); } else if (scope.row.markTags == '4') { return ( <span style="color: #1890ff">借用</span> ); } else if (scope.row.markTags == '5') { return ( <span style="color: #ff7f00">调拨审批中</span> ); } else if (scope.row.markTags == '6') { return ( <span style="color: #ff7f00">维修审批中</span> ); } else if (scope.row.markTags == '7') { return ( <span style="color: #ff7f00">处置审批中</span> ); } else if (scope.row.markTags == '8') { return ( <span style="color: #ff0000">待处理</span> ); } else if (scope.row.markTags == '9') { return ( <span style="color: #ff7f00">归还审批中</span> ); } } }, { prop: "assetCodeData", label: "资产编码", isShow:false, search: { el: "input", type: 'textarea', placeholder: '多个编码请换行' } , minWidth:100, }, { prop: "assetCode", label: "资产编码", fixed: "left", minWidth:100, render: (scope) => { return ( <span style="color: #49c625" onClick={() => handleAssetCodeClick(scope.row)}> {scope.row.assetCode} </span> ); } }, { prop: "assetName", label: "资产名称", fixed: "left", search: { el: "input" },minWidth:100 }, { prop: "assetCategoryName", label: "资产分类", minWidth:100 , }, { prop: "assetCategoryIdList", label: "资产分类", isShow:false, enum: async () => { // 获取资产分类数据，扁平数据 const { data } = await assetClassificationList({}); const treeData = formatToTree(data); configuration.assetCategory = treeData; return { data: treeData } }, fieldNames: { label: "categoryName", value: "id" }, search: { el: "tree-select", props: { filterable: true, multiple: true, checkStrictly: true, // 允许选择父节点 nodeKey: "id", // 每个节点的唯一标识字段 props: { label: "label", value: "id", children: "children" } } }, }, { prop: "nonStandardAssetsId", label: "资产类型", minWidth:100 , isShow:false, }, { prop: "type", label: "资产类型", minWidth:100 ,enum: assetType, search: { el: "select", props: { filterable: true } },}, { prop: "useUserName", label: "使用人" }, { prop: "useUserNameData", label: "使用人", isShow:false, search: { el: "input", type: 'textarea', placeholder: '多个使用人请换行' } }, { prop: "useOrgIdList", label: "使用机构", search: { el: "select", props: { filterable: true, multiple: true}}, minWidth:100 , enum: assinstitutional, isShow:false, fieldNames: { label: "name", value: "detailCode" }, }, { prop: "useOrgName", label: "使用机构", minWidth:100 , }, { prop: "useSubjectId", label: "使用主体", search: { el: "select" } , minWidth:100 , enum: assentityList, isShow:false, fieldNames: { label: "remarks", value: "detailCode" }, }, { prop: "useSubjectName", label: "使用主体", minWidth:100 , }, { prop: "useDepartmentId", label: "使用部门", minWidth:100 , enum: async () => { // 获取部门数据 const { data } = await getUserDepartment(); data.forEach(item => { item.pid = item.extMap.parentWorkOADepartmentId item.workOADepartmentId = item.value item.id = item.value item.name = item.label }) const treeData = formatToDepTree(data); configuration.departmentList = treeData return { data: treeData } }, fieldNames: { label: "label", value: "value" }, search: { el: "tree-select", props: { filterable: true, multiple: true, checkStrictly: true, // 允许选择父节点 nodeKey: "value", // 每个节点的唯一标识字段 props: { label: "label", value: "value", children: "children" } } } }, { prop: "useDepartmentName", label: "使用部门", isShow:false, minWidth:100 , }, { prop: "storageLocationIdList", label: "存放地点", minWidth:100 , isShow:false, enum: async () => { // 获取存放地点 const { data } = await getPositionList({ pageNum: 1, pageSize: 9999 }); const deepCopy = JSON.parse(JSON.stringify(data['dataList'])); configuration.positionList = deepCopy; return { data: data['dataList'] }; }, fieldNames: { label: "position", value: "id" }, search: { el: "select", props: { filterable: true , multiple: true} }, }, { prop: "storageLocationName", label: "存放地点", minWidth:100 , }, { prop: "adminName", label: "管理员", search: { el: "input" } }, { prop: "affiliatedInstitutionName", label: "所属机构",minWidth:100 }, { prop: "affiliatedInstitutionIdList", label: "所属机构", isShow:false, search: { el: "select" , props: { filterable: true , multiple: true}},minWidth:100 ,enum: assinstitutional, fieldNames: { label: "name", value: "detailCode" }, }, { prop: "affiliatedSubjectName", label: "所属主体",minWidth:100 }, { prop: "affiliatedSubjectId", label: "所属主体", isShow:false, search: { el: "select" },minWidth:100,enum: assentityList, fieldNames: { label: "remarks", value: "detailCode" } }, { prop: "assetSourceTypeList", label: "资产来源", isShow:false, enum: async () => { // 获取资产来源 const data = await setValueClildList({dictCode:'SOURCE_ASSETS'}); configuration.sourceList = data['data'] return { data: data['data'] } }, fieldNames: { label: "itemLabel", value: "itemValue" }, search: { el: "select", props: { filterable: true , multiple: true}}, }, { prop: "sourceCode", label: "资产来源", minWidth:100 , }, { prop: "brand", label: "品牌", search: { el: "input" }, }, { prop: "specificationModel", label: "规格型号", search: { el: "input" },minWidth:100 }, { prop: "serialNumber", label: "序列号", search: { el: "input" } }, { prop: "measurementUnit", label: "计量单位",minWidth:100 }, { prop: "remarks", label: "备注",search: { el: "input" } }, { prop: "supplierName", label: "供应商", search: { el: "input" }, }, { prop: "inBoundNo", label: "入库单号",minWidth:100 }, { prop: "nonStandardAssetsId", label: "非标准资产", enum: async () => { // 获取非标准资产 const data = await nonstandardList({}); nonstandardData.value = data configuration.nonstandardList = data return { data: data } }, isShow: false, fieldNames: { label: "name", value: "id" }, search: { el: "select", props: { filterable: true } }, }, { prop: "purchaseDate", label: "购入日期", minWidth:148 , search: { el: "date-picker", span: 2, props: { type: "daterange", valueFormat: "YYYY-MM-DD" }, }, }, { prop: "maintenanceExpirationDate", label: "维保到期日期", isShow: false, search: { el: "date-picker", span: 2, props: { type: "daterange", valueFormat: "YYYY-MM-DD" }, }, }, { prop: "operation", label: "操作",fixed: "right", isShow: true, sortable: false } ]) // 批量导出 const batchExport = async (command: any) => { try { const selectedIds = proTable.value?.selectedListIds || []; // 验证选择（如果command不是2，则需要选择数据） if (command != 2 && selectedIds.length === 0) { ElMessage.error({ message: `请选择要操作的数据` }); return; } const params = { idList: command === 2 ? [] : selectedIds // command=2表示导出全部 }; // 1. 获取文件数据（确保response是Blob或ArrayBuffer） const response = await assetListDown(params); // 2. 检查响应数据是否有效 if (!response) { ElMessage.error("导出失败：未获取到文件数据"); return; } // 3. 创建Blob对象（明确指定MIME类型） const blob = new Blob([response], { type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8" }); // 4. 创建下载链接 const url = window.URL.createObjectURL(blob); const link = document.createElement("a"); link.href = url; link.download = `资产清单_${new Date().toLocaleDateString()}.xlsx`; // 添加日期避免重复 // 5. 触发下载 document.body.appendChild(link); link.click(); // 6. 清理 setTimeout(() => { document.body.removeChild(link); window.URL.revokeObjectURL(url); }, 100); } catch (error) { console.error("导出失败:", error); } }; // 批量删除 const batchDelete = async (ids: string[]) => { if(ids && ids.length === 0) { ElMessage.error({ message: `请选择要操作的数据` }); return } await useHandleData(deleteAssetList, { idList: ids }, `确认删除`); refreshTable() } // 批量编辑 const batcEdit = async (ids: string[]) => { if (ids && ids.length === 0) { ElMessage.error({ message: `请选择要操作的数据` }); return; } // 从表格中获取当前所有选中的行数据 const selectedRows = proTable.value?.selectedList || []; const types = selectedRows.map(row => row.type); const uniqueTypes = [...new Set(types)]; if (uniqueTypes.length > 1) { ElMessage.warning("只能选择相同类型的资产进行批量编辑"); return; } selectedIds.value = ids; editBatchData('批量编辑', 'batchEdit', {}); } // 打印标签 const openTagPrint = async (ids: string[]) => { if(ids && ids.length === 0) { ElMessage.error({ message: `请选择要操作的数据` }); return } const data = await printAssetMark({ idList: ids }); if (data.code == 0) { ElMessage.success({ message: data.msg }); refreshTable() } else { ElMessage.error({ message: data.msg }); } } const closeDialog = () => { dialogFormVisible.value = false // 清除表格勾选项 if (proTable.value) { proTable.value.clearSelection(); } } // 子组件的上一步操作 const handlePreviousStep = () => { dialogFormVisible.value = true; // 重新打开对话框 // if( Type.value == 'batchEdit') {} // 回显之前选择的数据（form 已在 openDrawer 时保存） nextTick(() => { ruleFormRef.value?.clearValidate(); // 清除校验状态 }); proTable.value!.setCheckedRows(proTable.value?.selectedList); // console.log('proTable.value',proTable.value?.selectedList) // proTable.value!.toggleRowSelection(proTable.value?.selectedList[0]) // rows.forEach((row) => { // multipleTableRef.value!.toggleRowSelection( // row, // undefined, // ignoreSelectable // ) // }) }; const Title = ref(""); const Type = ref('add') const Row = ref({}) // 新增 const addNewData = (title: string,type:string, row: any = {}) => { Title.value = title Type.value = type Row.value = row // 清空表单值 form.type = ''; form.nonStandardAssetsId = ''; // 重置表单校验状态 nextTick(() => { ruleFormRef.value?.resetFields(); }); dialogFormVisible.value = true } // 编辑 const editData = async(title: string,type:string, row: any = {}) => { const {code , data ,msg} = await assetListInfo({ id: row.id }); if(code == 0) { form.type = row.type form.nonStandardAssetsId = '' let listData = [data] Title.value = title Type.value = type Row.value = listData openDrawer() } else { ElMessage.error(msg); } } // 批量编辑 const editBatchData = (title: string,type:string, row: any = {}) => { Title.value = title Type.value = type Row.value = row // 清空表单值 form.type = ''; form.nonStandardAssetsId = ''; // 重置表单校验状态 nextTick(() => { ruleFormRef.value?.resetFields(); }); dialogFormVisible.value = true } // 查看详情 const assetInfoRef = ref<InstanceType<typeof addAsset> | null>(null); const handleAssetCodeClick = async(row: any) => { const params = { row:{...row}, api:deleteAssetList, configuration:configuration, refreshTable: () => { proTable.value!.pageable.pageNum = 1; proTable.value?.refreshData(); } } assetInfoRef.value?.acceptParams(params) } // 下一步 const nextTips = () => { ruleFormRef.value!.validate(async valid => { if (!valid) return; try { openDrawer() } catch (error) { console.log(error); } }) } // 新增/编辑 const ruleFormRef = ref<FormInstance>(); const addAssetRef = ref<InstanceType<typeof addAsset> | null>(null); const openDialog = () => { // 清空表单值 form.type = ''; form.nonStandardAssetsId = ''; // 重置表单校验状态 nextTick(() => { ruleFormRef.value?.resetFields(); }); dialogFormVisible.value = true } const openDrawer = () => { if(Type.value === 'add') { dialogFormVisible.value = false const params = { title:Title.value, type:Type.value, row:{...Row.value}, form:{...form}, configuration:configuration, isView:false, api: addAssetList, refreshTable: () => { proTable.value!.pageable.pageNum = 1; proTable.value?.refreshData(); } } addAssetRef.value?.acceptParams(params) } else if(Type.value === 'edit'){ const params = { title:Title.value, type:Type.value, configuration:configuration, isView:false, row:{}, form:{...form}, infoRow:{...Row.value}, api: editAssetList, refreshTable: () => { proTable.value!.pageable.pageNum = 1; proTable.value?.refreshData(); } } addAssetRef.value?.acceptParams(params) } else { dialogFormVisible.value = false const params = { title:Title.value, type:Type.value, configuration:configuration, isView:false, form:{...form}, row:{selectedIds:selectedIds.value}, api: editBatchAssetList, refreshTable: () => { proTable.value!.pageable.pageNum = 1; proTable.value?.refreshData(); } } addAssetRef.value?.acceptParams(params) } } onMounted(() => { getUnitList(); getOrgSubjectListData(); }) </script> <style lang="scss" scoped> .more_imgs{ div { display: inline-flex; } .viewImage{ width: 25px; height: 25px; cursor: pointer; } } /* 或仅针对特定列 */ .el-table .el-table__header th.is-center .cell { text-align: center; } /* 确保选择列可见 */ ::v-deep .el-table__fixed-left { .el-table__cell.is-hidden > * { visibility: visible !important; } .el-checkbox { display: inline-block; } } </style>点击handlePreviousStep后，回显勾选的数据
08-26
selectedListIds.value = rows.map(row => row[rowKey]); }; defineExpose({ // ...其他方法 setCheckedRows }); ``` --- ## ✅ 4. 表格中 `el-table` 的 `@selection-change` 事件是否绑定正确 确保 `el-...
<c-search-panel :columns="columns" @search="search" ref="searchForm"> <template #projSlot> <v-project-select :disabled="disabled" v-decorator="[ 'projNo', { rules: [ { required: true, message: $t('maintenance.common.selectValidator'), }, ], }, ]" @change="changeProj" /> </template> </c-search-panel> <v-table filled :dataSource="this.dataList" :columns="columns" :pagination="pagination" :toolbar="toolbar" @toolbar-button-click="onToolbarClick" :proxy-config="proxyConfig" :sort-congfig="sortConfig" ref="vtable" > <template slot="action" slot-scope="{ record }"> <a @click="edit(record)" v-resource="[{ url: '/service-pipeline/cp/mc/package', method: 'POST' }]">{{ $t("pipeControll.mc.edit") }}</a> <a-divider type="vertical" /> <a v-if="record.version != null && record.version >= 0 && record.pageCount != null && record.pageCount > 0" @click="viewPdf(record)">{{ $t("pipeControll.mc.viewPdf") }}</a> <a-divider type="vertical" /> <a @click="handleSign(record)" v-resource="[{ url: '/service-pipeline/cp/mc/package/sign', method: 'POST' }]">{{ $t("pipeControll.mc.signature") }}</a> <a-divider type="vertical" /> <a @click="handleLog(record)">{{ $t("pipeControll.mc.log") }}</a> </template> <template #viewSlot="{ text }"> <div> {{ text }} </div> </template> <template #pressureDesc="{ record }"> <a-input v-model="record.pressureDesc" @blur="pressureDescChange(record)"></a-input> </template> <template #testSlot="{ record }"> <a-input-number v-model="record.testPressure" @blur="testChange(record)"></a-input-number> </template> </v-table> <a-modal :visible="progressModal" @cancel="modalCancel" @ok="modalSubmit" title="关联四级计划" width="1300px" > <c-search-panel :columns="modalTable.columns" @search="modalSearch" ref="modalForm"> <template #projSlot> <v-project-select :disabled="disabled" v-decorator="['projId']" /> </template> </c-search-panel> <v-table :columns="modalTable.columns" :pagination="modalTable.pagination" :proxy-config="modalTable.proxyConfig" :toolbar="false" ref="vtable1" > </v-table> </a-modal> <a-modal :title="this.action === 'add' ? '新增' : '编辑'" v-model="formVisible" :disabled="isSubmitting" @cancel="cancelModal" @ok="submitModal" width="40%"> <a-form :form="saveForm"> <a-row :gutter="24"> <a-col :span="12" :push="1"> <a-form-item label="id" v-show="false" :label-col="{ span: 8 }" :wrapper-col="{ span: 14 }"> <a-input v-decorator="['id']" /> </a-form-item> </a-col> </a-row> <a-row :gutter="24"> <a-col :span="12" :push="1"> <a-form-item :label="$t('pipeControll.mc.project')" :label-col="{ span: 8 }" :wrapper-col="{ span: 14 }"> <v-project-select showSearch optionFilterProp="children" allowClear :disabled="disabled" v-decorator="['projNo', { rules: [{ required: true, message: '请选择项目' }] }]" @change="changeProj" /> </a-form-item> </a-col> <a-col :span="12" :push="1"> <a-form-item :label="$t('pipeControll.mc.sysCode')" :label-col="{ span: 8 }" :wrapper-col="{ span: 14 }"> <a-select v-decorator="['system', { rules: [{ required: true, message: '请选择系统号' }] }]" showSearch allowClear :disabled="disabled" optionFilterProp="children" @change="changeSystem"> <a-select-option v-for="item in systemList" :key="item.sysCode" :value="item.sysCode"> {{ item.sysCode }} </a-select-option> </a-select> </a-form-item> </a-col> </a-row> <a-row :gutter="24"> <a-col :span="12" :push="1"> <a-form-item :label="$t('pipeControll.mc.subSystemNo')" :label-col="{ span: 8 }" :wrapper-col="{ span: 14 }"> <a-select v-decorator="['subSystem', { rules: [{ required: true, message: '请选择子系统号' }] }]" showSearch allowClear :disabled="disabled" optionFilterProp="children"> <a-select-option v-for="item in subSystemList" :key="item.subsysCode" :value="item.subsysCode"> {{ item.subsysName }} </a-select-option> </a-select> </a-form-item> </a-col> <a-col :span="12" :push="1"> <a-form-item :label="$t('pipeControll.mc.packageNo')" :label-col="{ span: 8 }" :wrapper-col="{ span: 14 }"> <a-input :disabled="disabled" v-decorator="['packageNo', { rules: [{ required: true, message: '请输入MC包号' }] }]" /> </a-form-item> </a-col> </a-row> <a-row :gutter="24"> <a-col :span="12" :push="1"> <a-form-item :label="$t('pipeControll.mc.pressDesc')" :label-col="{ span: 8 }" :wrapper-col="{ span: 14 }"> <a-input v-decorator="['pressureDesc']" /> </a-form-item> </a-col> <a-col :span="12" :push="1"> <a-form-item :label="$t('pipeControll.mc.testPressure')" :label-col="{ span: 8 }" :wrapper-col="{ span: 14 }"> <a-input v-decorator="['testPressure']" /> </a-form-item> </a-col> </a-row> <a-row :gutter="24"> <a-col :span="12" :push="1"> <a-form-item :label="$t('pipeControll.mc.pidNo')" :label-col="{ span: 8 }" :wrapper-col="{ span: 14 }"> <a-select v-decorator="['pidNo']" showSearch allowClear mode="multiple" optionFilterProp="children"> <a-select-option v-for="item in pidList" :key="item.pidNo" :value="item.pidNo"> {{ item.pidNo }} </a-select-option> </a-select> </a-form-item> </a-col> <a-col :span="12" :push="1"> <a-form-item :label="$t('pipeControll.mc.isoDrawNo')" :label-col="{ span: 8 }" :wrapper-col="{ span: 14 }"> <a-select v-decorator="['isoDrawNo']" showSearch allowClear mode="multiple" optionFilterProp="children"> <a-select-option v-for="item in isoDrawList" :key="item.isoDrawNo" :value="item.isoDrawNo"> {{ item.isoDrawNo }} </a-select-option> </a-select> </a-form-item> </a-col> </a-row> </a-form> </a-modal> <a-modal :title="pdfModalTitle" v-model="pdfModalVisible" :footer="null" width="50%"> <div> <p><strong>{{ $t("pipeControll.mc.project") }}: {{ selectedRecord.projId }}</strong></p> <p><strong>{{ $t("pipeControll.mc.mcPackageNo") }}: {{ selectedRecord.packageNo }}</strong></p> <p><strong>{{ $t("pipeControll.mc.version") }}: {{ selectedRecord.version }}</strong></p> <div style="margin-top: 10px;"> <a-button @click="downloadPdf" style="margin-right: 10px;">{{ $t("pipeControll.mc.downloadPdf") }}</a-button> <a-button @click="viewPdfContent" style="margin-right: 10px;">{{ $t("pipeControll.mc.view") }}</a-button> <a-button @click="viewHistoryVersions" style="margin-right: 10px;">{{ $t("pipeControll.mc.historyView") }}</a-button> <a-button @click="viewChangeLogs">{{ $t("pipeControll.mc.log") }}</a-button> </div> </div> <v-table :columns="pdfTableColumns" :dataSource="pdfTableData" :pagination="false" height="500" ref="pdfTable"> <template slot="action" slot-scope="{ record }"> <a @click="maintain(record)">{{ $t("pipeControll.mc.maintain") }}</a> <a-divider type="vertical" /> <a @click="viewLog(record)">{{ $t("pipeControll.mc.log") }}</a> <a-divider type="vertical" /> <a v-if="record.createType && record.createType == '系统生成'" @click="updateMcPdf(record)">{{ $t("pipeControll.mc.update") }}</a> <a-divider type="vertical" /> <a v-if="record.nameKey && record.nameKey == 'catalog'" @click="updateIndexRemark(record)">{{ $t("pipeControll.mc.editRemark") }}</a> </template> </v-table> </a-modal> <a-modal :title="pdfModalLogTitle" v-model="pdfModalLogVisible" @cancel="pdfModalLogCancel" width="40%"> <v-table :columns="pdfModalLogColumns" :dataSource="pdfModalLogData" :pagination="false" :height="600" ref="pdfModalLogTable"> </v-table> </a-modal> <a-modal title="查看历史版本" v-model="historyModalVisible" @ok="handleHistoryVersionOk" @cancel="handleHistoryVersionCancel" width="400px"> <a-form-item :label="$t('pipeControll.mc.version')" :label-col="{ span: 8 }" :wrapper-col="{ span: 14 }"> <a-input placeholder="请输入版本号" v-model="historyVersion" /> </a-form-item> </a-modal> <a-modal :title="`维护 - ${selectedSection.name}`" v-model="maintainModalVisible" :footer="null" width="50%"> <div> <p><strong>{{ $t("pipeControll.mc.project") }}: {{ selectedRecord.projId }}</strong></p> <p><strong>{{ $t("pipeControll.mc.mcPackageNo") }}: {{ selectedRecord.packageNo }}</strong></p> <p><strong>{{ $t("pipeControll.mc.catalog") }}: {{ selectedSection.name }}</strong></p> <div style="margin-top: 10px;"> <a-button @click="handleAddContent" style="margin-right: 10px;">{{ $t("pipeControll.mc.addContent") }}</a-button> </div> </div> <v-table :columns="maintainTableColumns" :dataSource="maintainTableData" :pagination="false" ref="maintainTable"> <template slot="action" slot-scope="{ record }"> <a @click="handleViewAttachment(record)">{{ $t("pipeControll.mc.view") }}</a> <a-divider type="vertical" /> <a @click="handleDelete(record)">{{ $t("pipeControll.mc.delete") }}</a> <a-divider type="vertical" /> <a @click="handleReplace(record)">{{ $t("pipeControll.mc.replace") }}</a> <a-divider type="vertical" /> <a @click="handleAdjustPage(record)">{{ $t("pipeControll.mc.adjustPage") }}</a> </template> </v-table> </a-modal> <a-modal title="新增/调整" v-model="addContentModalVisible" @ok="handleInsertPage" @cancel="addContentModalVisible = false" width="20%"> <a-form :form="contentForm" :label-col="{ span: 5 }" :wrapper-col="{ span: 12 }"> <a-form-item v-if="isUpload" label="上传文件"> <a-upload class="common-upload-icontop" action="/api/service-file/files" :headers="Headers" :file-list="fileList" list-type="pdf" :showUploadList="true" :max-count="1" accept=".pdf,application/pdf" @change="handleUpload" > <a-button> <a-icon type="upload" /> {{ $t("pipeControll.mc.upload") }} </a-button> </a-upload> </a-form-item> <a-form-item v-if="isPage" label="页数"> <a-input v-model="insertPageNumber" style="margin-top: 10px; width: 60%;" /> </a-form-item> </a-form> </a-modal> <a-modal :title="$t('pipeControll.mc.signature')" :okText="$t('pipeControll.mc.signature')" v-model="signModalVisible" @ok="handleSignSubmit" @cancel="handleSignCancel" width="20%"> <a-form :form="signForm"> <a-row :gutter="16"> <a-col :span="10" style="text-align: right;"> <p><strong>{{ $t("pipeControll.mc.project") }}:</strong></p> </a-col> <a-col :span="12"> <p>{{ selectedRecord.projId }}</p> </a-col> </a-row> <a-row :gutter="16"> <a-col :span="10" style="text-align: right;"> <p><strong>{{ $t("pipeControll.mc.mcPackageNo") }}:</strong></p> </a-col> <a-col :span="12"> <p>{{ selectedRecord.packageNo }}</p> </a-col> </a-row> <a-form-item :label="$t('pipeControll.mc.signRole')" :label-col="{ span: 8 }" :wrapper-col="{ span: 14 }"> <a-select v-decorator="['role', { rules: [{ required: true, message: '请选择签名角色' }] }]"> <a-select-option v-for="item in signRoleList" :key="item.name" :value="item.name"> {{ item.name }} </a-select-option> </a-select> </a-form-item> <a-form-item :label="$t('pipeControll.mc.signNode')" :label-col="{ span: 8 }" :wrapper-col="{ span: 14 }"> <a-select v-decorator="['node', { rules: [{ required: true, message: '请选择签名节点' }] }]"> <a-select-option v-for="item in signNodeList" :key="item.name" :value="item.name"> {{ item.name }} </a-select-option> </a-select> </a-form-item> </a-form> </a-modal> <a-modal :title="logModalTitle" v-model="logModalVisible" @cancel="logModalCancel" width="40%"> <v-table :columns="logTableColumns" :dataSource="logTableData" :pagination="false" :height="400" ref="logTable"> </v-table> </a-modal> <a-modal title="维护备注" v-model="remarkModalVisible" @ok="saveRemarks" @cancel="remarkModalVisible = false" width="50%"> <v-table :columns="remarkModalColumns" :dataSource="remarkModalData" :pagination="false"> <template #remark="{ record }"> <a-input v-model="record.remark" placeholder="请输入备注" /> </template> </v-table> </a-modal> </section> </template> <script> import { floatObj, toLine } from "~/utils/dataUtils"; import moment from "moment"; import * as Serve from "~/api/modules/Pipe/mc/cpMcPackage"; import { adjustPage, generatePdf, getMcPackageLogList, getPackageIsoList, getPackagePidList, getPidDropList, getTemplateSectionList, updateMcPackageData, } from "~/api/modules/Pipe/mc/cpMcPackage"; import { findDataByName as cByName, getDropList as cDeopList } from "~/api/modules/Pipe/mc/cpMcCleanFactor"; import ImportDataModal from "@/components/mc/ImportDataModal"; import { getDictionary, majorAll } from "~api/modules/common"; import { fileSaver } from "@/utils"; import { preview } from "~api/modules/CommissioningManagement/RecordSave/CheckRecord"; import { Modal } from "ant-design-vue"; // 类型详情 export default { components: { ImportDataModal, }, data() { return { Headers: { authorization: `Bearer${localStorage.getItem("token")}`, }, isGeneratingPdf: false, isSubmittingSign: false, fileList: [], fileId: "", isSubmitting: false, test: Serve.imp, pdfUrl: "", isPage: true, isUpload: true, insertPageNumber: "", originPageNumber: "", version: "", pageNum: "", dataPageId: "", historyModalVisible: false, historyVersion: '', disabled: false, systemList: [], subSystemList: [], pipeLineList: [], isoDrawList: [], pidList: [], majorList: [], flushingTypeList: [], projectId: null, packageNo: "", isoDrawNo: "", action: "", visible: false, formVisible: false, columns: [ {type: "checkbox", width: 50 }, { //title: "项目号", title: this.$t("pipeControll.mc.project"), align: "left", width: 110, visible: false, scopedSlots: { customRender: "projSlot" }, condition: true, }, { //title: "项目号", title: this.$t("pipeControll.mc.project"), align: "left", dataIndex: "projNo", rules: [{ required: true }], sorter: false, type: "project", verification: true, width: 120, }, { //title: "系统号", title: this.$t("pipeControll.mc.sysCode"), align: "left", dataIndex: "system", condition: true, rules: [{ required: true }], verification: true, width: 120, }, { //title: "子系统号", title: this.$t("pipeControll.mc.subSystemNo"), align: "left", width: 120, condition: true, rules: [{ required: true }], verification: true, dataIndex: "subSystem", }, { // title: "MC包号", title: this.$t("pipeControll.mc.mcPackageNo"), align: "left", width: 120, condition: true, rules: [{ required: true }], verification: true, dataIndex: "packageNo", }, { // title: "介质", title: this.$t("pipeControll.mc.medium"), align: "left", width: 120, rules: [{ required: true }], verification: true, dataIndex: "testMedium", }, { // title: "压力描述", title: this.$t("pipeControll.mc.pressDesc"), align: "left", width: 120, scopedSlots: { customRender: "viewSlot", customEditorRender: "pressureDesc", }, dataIndex: "pressureDesc", }, { // title: "试验压力", title: this.$t("pipeControll.mc.testPressure"), align: "left", width: 120, scopedSlots: { customRender: "viewSlot", customEditorRender: "testSlot", }, dataIndex: "testPressure", }, { // title: "压力系数", title: this.$t("pipeControll.mc.pressureFactor"), align: "left", width: 120, verification: true, dataIndex: "testPressureFactor", }, { // title: "清洗内容", title: this.$t("pipeControll.mc.cleanContent"), align: "left", width: 120, rules: [{ required: true }], type: "select", options: { options: [], fieldNames: { label: "name", value: "name" }, ajax: cDeopList(), }, verification: true, dataIndex: "flushingType", }, { // title: "清洗系数", title: this.$t("pipeControll.mc.cleanFactor"), align: "left", width: 120, verification: true, dataIndex: "flushingFactor", }, { // title: "外观权重", title: this.$t("pipeControll.mc.appearWeight"), align: "left", width: 120, rules: [{ required: true }], type: "number", options: { min: 0, }, formatter: v => (v.cellValue ? `${v.cellValue}%` : ""), verification: true, dataIndex: "appearWeight", }, { // title: "压力权重", title: this.$t("pipeControll.mc.pressureWeight"), align: "left", width: 120, rules: [{ required: true }], type: "number", options: { min: 0, }, formatter: v => (v.cellValue ? `${v.cellValue}%` : ""), verification: true, dataIndex: "pressureWeight", }, { // title: "串洗权重", title: this.$t("pipeControll.mc.washWeight"), align: "left", width: 120, rules: [{ required: true }], type: "number", options: { min: 0, }, formatter: v => (v.cellValue ? `${v.cellValue}%` : ""), verification: true, dataIndex: "flushingWeight", }, { // title: "复位权重", title: this.$t("pipeControll.mc.resetWeight"), align: "left", width: 120, rules: [{ required: true }], type: "number", options: { min: 0, }, formatter: v => (v.cellValue ? `${v.cellValue}%` : ""), verification: true, dataIndex: "reinstatementWeight", }, { // title: "配合调试权重", title: this.$t("pipeControll.mc.matchDebugWeight"), align: "left", width: 160, rules: [{ required: false }], type: "number", options: { min: 0, }, formatter: v => (v.cellValue ? `${v.cellValue}%` : ""), verification: true, dataIndex: "commissionWeight", }, { // title: "总定额", title: this.$t("pipeControll.mc.totalQuota"), align: "left", width: 120, dataIndex: "quotaMh", }, { // title: "外观定额", title: this.$t("pipeControll.mc.appearQuota"), align: "left", width: 120, dataIndex: "appearQuotaMh", }, { // title: "压力定额", title: this.$t("pipeControll.mc.pressureQuota"), align: "left", width: 120, dataIndex: "pressureQuotaMh", }, { // title: "串洗定额", title: this.$t("pipeControll.mc.washQuota"), align: "left", width: 120, dataIndex: "flushingQuotaMh", }, { // title: "复位定额", title: this.$t("pipeControll.mc.resetQuota"), align: "left", width: 120, dataIndex: "reinstatementQuotaMh", }, { // title: "配合调试定额", title: this.$t("pipeControll.mc.matchDebugQuota"), align: "left", width: 160, dataIndex: "commissionQuotaMh", }, { // title: "汇总实动工时", title: this.$t("pipeControll.mc.sumActualWorkHour"), align: "left", width: 160, dataIndex: "hzHours", }, { // title: "外观实动工时", title: this.$t("pipeControll.mc.appearActualWorkHour"), align: "left", width: 120, dataIndex: "appearHours", }, { // title: "压力实动工时", title: this.$t("pipeControll.mc.pressureActualWorkHour"), align: "left", width: 120, dataIndex: "pressureHours", }, { // title: "串洗实动工时", title: this.$t("pipeControll.mc.washActualWorkHour"), align: "left", width: 120, dataIndex: "flushingHours", }, { // title: "复位实动工时", title: this.$t("pipeControll.mc.resetActualWorkHour"), align: "left", width: 120, dataIndex: "reinstatementHours", }, { // title: "配合调试实动工时", title: this.$t("pipeControll.mc.matchDebugActualWorkHour"), align: "left", width: 160, dataIndex: "commissionHours", }, { // title: "外观状态", title: this.$t("pipeControll.mc.appearStatus"), align: "left", width: 120, formatter: ({ cellValue }) => { let obj = { 0: "新建", 1: "进行中", 2: "已完成", }; return obj[cellValue]; }, verification: true, dataIndex: "appearDispatchStatus", }, { // title: "压力状态", title: this.$t("pipeControll.mc.pressureStatus"), align: "left", width: 120, formatter: ({ cellValue }) => { let obj = { 0: "新建", 1: "进行中", 2: "已完成", }; return obj[cellValue]; }, verification: true, dataIndex: "pressureDispatchStatus", }, { // title: "串洗状态", title: this.$t("pipeControll.mc.washStatus"), align: "left", width: 120, formatter: ({ cellValue }) => { let obj = { 0: "新建", 1: "进行中", 2: "已完成", }; return obj[cellValue]; }, verification: true, dataIndex: "flushingDispatchStatus", }, { // title: "复位状态", title: this.$t("pipeControll.mc.resetStatus"), align: "left", width: 120, formatter: ({ cellValue }) => { let obj = { 0: "新建", 1: "进行中", 2: "已完成", }; return obj[cellValue]; }, verification: true, dataIndex: "reinstatementDispatchStatus", }, { // title: "配合调试状态", title: this.$t("pipeControll.mc.matchDebugStatus"), align: "left", width: 160, formatter: ({ cellValue }) => { let obj = { 0: "新建", 1: "进行中", 2: "已完成", }; return obj[cellValue]; }, verification: true, dataIndex: "commissionDispatchStatus", }, { // title: "MC包状态", title: this.$t("pipeControll.mc.mcStatus"), align: "left", width: 120, formatter: ({ cellValue }) => { let obj = { 0: "新建", 1: "进行中", 2: "已完成", }; return obj[cellValue]; }, verification: true, dataIndex: "status", }, { // title: "创建时间", title: this.$t("pipeControll.mc.createDate"), align: "left", width: 180, verification: true, dataIndex: "createDate", formatter: data => (data.cellValue ? moment(data.cellValue).format("YYYY-MM-DD") : ""), }, { // title: "创建人", title: this.$t("pipeControll.mc.creator"), align: "left", width: 100, dataIndex: "createUserName", }, { // title: "修改时间", title: this.$t("pipeControll.mc.updateDate"), align: "left", width: 180, dataIndex: "updateDate", formatter: data => (data.cellValue ? moment(data.cellValue).format("YYYY-MM-DD") : ""), }, { //title: "更新人", title: this.$t("pipeControll.mc.updater"), align: "left", width: 100, dataIndex: "updateUserName", }, { //title: "专业", title: this.$t("pipeControll.mc.major"), align: "left", width: 100, dataIndex: "majorCode", type: "select", options: { options: [], fieldNames: { label: "name", value: "code" }, ajax: majorAll(), }, }, { //title: "PID图号", title: this.$t("pipeControll.mc.pidNo"), align: "left", width: 100, dataIndex: "pidNo", }, { //title: "ISO图号", title: this.$t("pipeControll.mc.isoDrawNo"), align: "left", width: 100, dataIndex: "isoDrawNo", }, { //title: "操作", title: this.$t("column.operation"), scopedSlots: { customRender: "action" }, width: 210, fixed: "right", sortable: false, }, { // title: "MC包状态", title: this.$t("pipeControll.mc.mcStatus"), dataIndex: "planStatus", condition: true, type: "select", visible: false, options: { options: [ { label: "新建", value: "0" }, { label: "进行中", value: "1" }, { label: "已完成", value: "2" }, ], fieldNames: { label: "label", value: "value" }, }, decorator: [ "planStatus", { initialValue: "0", }, ], }, ], toolbar: { buttons: [ { code: "insertData", //name: "新增", name: this.$t("pipeControll.mc.add"), resource: [{ url: "/service-pipeline/cp/mc/package", method: "POST" }], }, { code: "delete", //name: "删除", name: this.$t("pipeControll.mc.delete"), resource: [{ url: "/service-pipeline/cp/mc/clean/factor", method: "DELETE" }], }, // { // code: "check", // //name: "保存", // name: this.$t("crud.save"), // resource: [{ url: "/service-pipeline/cp/mc/clean/factor", method: "POST" }], // }, { code: "template", // name: "下载导入模板", name: this.$t("pipeControll.mc.importTemplate"), }, { code: "importData", //name: '导入', name: this.$t("pipeControll.mc.import"), }, { code: "exp", // name: "导出", name: this.$t("pipeControll.mc.export"), resource: [ { url: "/service-pipeline/cp/mc/clean/factor/excels", method: "GET", }, ], }, { code: "generatePdf", // name: "生成/更新pdf", name: this.$t("pipeControll.mc.generatePdf"), resource: [ { url: "/service-pipeline/cp/mc/package/generatePdf", method: "POST", }, ], }, ], }, pagination: { total: 0, }, dataList: [], sortConfig: { default: "id", sort: "asc" }, proxyConfig: { autoLoad: false, ajax: { query: ({ page, sort, filters }, ...args) => { let sorter = ""; if (sort && sort.field && sort.order) { sorter = toLine(sort.field) + "," + sort.order; } return Serve.page({ ...this.conditionData, ...this.$vtable.pagination(page), sort: sorter, }); }, // save: ({ body }) => Serve.save(this.$vtable.updateRecords(body, "id")), delete: ({ body }) => { return Serve.del({ ids: this.$vtable.removeRecords(body, "id").join(","), }); }, }, }, modalTable: { columns: [ { type: "radio", width: 50 }, { //title: "项目号", title: this.$t("pipeControll.common.projectNumber"), align: "left", width: 110, visible: false, scopedSlots: { customRender: "projSlot" }, condition: true, }, { //title: "项目号", title: this.$t("pipeControll.common.projectNumber"), align: "left", dataIndex: "projId", }, { //title: '建造地', title: this.$t("pipeControll.common.builtPlace"), align: "left", dataIndex: "orgName", }, { title: "任务ID", align: "left", condition: true, dataIndex: "wbsCode", }, { title: "任务描述", align: "left", condition: true, dataIndex: "wbsName", }, { title: "任务对象", align: "left", condition: true, dataIndex: "objectCode", }, ], pagination: { pageSize: 10, total: 0, }, proxyConfig: { autoLoad: false, ajax: { query: ({ page, sort, filters }, ...args) => { let sorter = ""; if (sort && sort.field && sort.order) { sorter = toLine(sort.field) + "," + sort.order; } return Serve.getProjectCyc({ ...this.conditionData1, ...this.$vtable.pagination(page), sort: sorter, }); }, }, }, }, progressModal: false, pdfModalVisible: false, pdfModalTitle: '', selectedRecord: {}, pdfTableColumns: [ { // title: '目录名称', title: this.$t("pipeControll.mc.catalogName"), dataIndex: 'name' }, { // title: '维护方式', title: this.$t("pipeControll.mc.maintainMethod"), dataIndex: 'createType' }, { // title: '最后维护时间', title: this.$t("pipeControll.mc.lastMaintainDate"), dataIndex: 'updateDate' }, { // title: '最后维护人', title: this.$t("pipeControll.mc.lastMaintainPerson"), dataIndex: "updateUserName", type: "employeeDescription", options: { fieldNames: { label: "updateUserName", value: "updateUserId", }, }, }, { // title: '操作', title: this.$t("pipeControll.mc.operation"), width: 200, scopedSlots: { customRender: 'action' } }, ], pdfTableData: [], pdfModalLogVisible: false, pdfModalLogTitle: '', pdfModalLogColumns: [ { // title: '操作时间', title: this.$t("pipeControll.mc.operateDate"), dataIndex: 'operateDate' }, { // title: '操作类型', title: this.$t("pipeControll.mc.operateType"), dataIndex: 'operateType' }, { // title: '操作人', title: this.$t("pipeControll.mc.operator"), dataIndex: 'operatorName', type: "employeeDescription", options: { fieldNames: { label: "operatorName", value: "operatorCode", }, }}, { // title: '操作详情', title: this.$t("pipeControll.mc.operateDetail"), dataIndex: 'operateDetail' } ], pdfModalLogData: [], maintainModalVisible: false, addContentModalVisible: false, selectedSection: {}, maintainTableColumns: [ { // title: '描述', title: this.$t("pipeControll.mc.desc"), dataIndex: 'linkObject' }, { // title: '页数', title: this.$t("pipeControll.mc.pageNum"), dataIndex: 'pageNum' }, { // title: '操作', title: this.$t("pipeControll.mc.operation"), scopedSlots: { customRender: 'action' } } ], maintainTableData: [], signModalVisible: false, signRoleList: [], signNodeList: [], signRole: '', signNode: '', logModalVisible: false, logModalTitle: '', logTableColumns: [ { title: "操作类型", dataIndex: "operateType", sorter: false }, { title: "操作详情", dataIndex: "operateDetail", sorter: false }, { title: "操作时间", dataIndex: "operateDate", type: "datetime", sorter: false }, { title: "操作人", dataIndex: "operateUserName", type: "employeeDescription", sorter: false, options: { fieldNames: { label: "operateUserName", value: "operateUserId" } } } ], logTableData: [], remarkModalVisible: false, remarkModalData: [], mcPackageDataId: '', templateNameKey: '', remarkModalColumns: [ { title: '目录Key', dataIndex: 'nameKey', visible: false, }, { // title: '目录名称', title: this.$t("pipeControll.mc.catalogName"), dataIndex: 'name', }, { // title: '备注', title: this.$t("pipeControll.mc.remark"), dataIndex: 'remark', scopedSlots: { customRender: 'remark' }, }, ], }; }, beforeCreate() { this.contentForm = this.$form.createForm(this); this.saveForm = this.$form.createForm(this); this.signForm = this.$form.createForm(this); }, computed: { table() { return this.$refs.vtable.getTable(); }, form() { return this.$refs.searchForm.getForm(); }, table1() { return this.$refs.vtable1.getTable(); }, cycForm() { return this.$refs.modalForm.getForm(); }, }, mounted() { // this.form.setFieldsValue({ cycStatus: "0" }) this.$refs.searchForm.toggle(); this.getMajorList(); this.getFlushingTypeList(); }, methods: { onToolbarClick(target) { switch (target.code) { case "insertData": this.insert(); break; case "exp": this.exp(); break; case "relevance": this.relevance(); break case "template": this.template(); break; case "importData": this.importData(); break; case "asyncData": this.asyncData(); break; case "generatePdf": this.generatePdf(); // case "check": // this.check(); // break; default: break; } }, search(values) { this.conditionData = values; this.table.commitProxy("reload", { page: 0 }); }, modalSearch(values) { this.conditionData1 = values; this.table1.commitProxy("reload", { page: 0 }); }, getMajorList() { majorAll().then(res => { this.majorList = res.data; }); }, getFlushingTypeList() { cDeopList().then(res => { this.flushingTypeList = res.data; }); }, changeProj(val) { this.projectId = val; this.saveForm.setFieldsValue({ system: '' }); this.saveForm.setFieldsValue({ subSystem: '' }); this.saveForm.setFieldsValue({ isoDrawNo: [] }); this.saveForm.setFieldsValue({ pidNo: [] }); this.subSystemList = [] Serve.getSystemDropList({projectId: val}).then(res => { this.systemList = res.status == 200 ? res.data : []; }); Serve.getIsoDrawDropList({projectId: val, topVersionFlag: "Y"}).then(res => { this.isoDrawList = res.status == 200 ? res.data : []; }); Serve.getPidDropList({projectId: val, topVersionFlag: "Y"}).then(res => { this.pidList = res.status == 200 ? res.data : []; }); }, changeSystem(val) { Serve.getSubSystemDropList({projectId: this.projectId, sysCode: val}).then(res => { this.subSystemList = res.status == 200 ? res.data : []; }); }, insert() { this.action = "add"; this.disabled = false; this.formVisible = true; this.saveForm.resetFields(); }, edit(record) { Serve.getPackageIsoList({projectId: record.projNo, packageNo: record.packageNo}).then(res => { const isoValues = res.data.map(item => item.isoDrawNo); this.saveForm.setFieldsValue({ isoDrawNo: isoValues }); }); Serve.getPackagePidList({projectId: record.projNo, packageNo: record.packageNo}).then(res => { const pidValues = res.data.map(item => item.pidNo); this.saveForm.setFieldsValue({ pidNo: pidValues }); }); this.action = "edit"; this.disabled = true; this.saveForm.resetFields(); setTimeout(() => { this.saveForm.setFieldsValue({ id: record.id }); this.saveForm.setFieldsValue({ projNo: record.projNo }); this.saveForm.setFieldsValue({ system: record.system }); this.saveForm.setFieldsValue({ subSystem: record.subSystem }); this.saveForm.setFieldsValue({ majorCode: record.majorCode }); this.saveForm.setFieldsValue({ packageNo: record.packageNo }); this.saveForm.setFieldsValue({ pidNo: record.pidNo }); this.saveForm.setFieldsValue({ isoDrawNo: record.isoDrawNo }); this.saveForm.setFieldsValue({ testMedium: record.testMedium }); this.saveForm.setFieldsValue({ pressureDesc: record.pressureDesc }); this.saveForm.setFieldsValue({ testPressure: record.testPressure }); this.saveForm.setFieldsValue({ flushingType: record.flushingType }); this.saveForm.setFieldsValue({ appearWeight: record.appearWeight }); this.saveForm.setFieldsValue({ pressureWeight: record.pressureWeight }); this.saveForm.setFieldsValue({ flushingWeight: record.flushingWeight }); this.saveForm.setFieldsValue({ reinstatementWeight: record.reinstatementWeight }); this.saveForm.setFieldsValue({ commissionWeight: record.commissionWeight }); }, 0); this.formVisible = true; }, submitModal() { if (this.isSubmitting) return; this.isSubmitting = true; this.saveForm.validateFields((err, values) => { if (!err) { if (values.isoDrawNo) { values.isoDrawNos = values.isoDrawNo.join(',') delete values.isoDrawNo; } if(values.pidNo) { values.pidNos = values.pidNo.join(',') delete values.pidNo; } Serve.savePdcsOrUpdate(values).then(res => { this.$message.success(this.$t("basedata.cecable.saveSuccess")); this.form.validateFields((err, values) => { if (!err) { this.table.commitProxy("reload", { page: 0 }); } }); this.cancelModal(); this.isSubmitting = false; }).catch(() => { this.isSubmitting = false; }); } }) }, cancelModal() { this.disabled = false; this.formVisible = false; this.saveForm.resetFields(); }, //删除数据确认 dataDelete() { if (this.selectedCheck() == false) { //this.$message.error("请选择需要删除的行！"); this.$message.error(this.$t("pipeControll.common.selectRemoveRow")); return; } this.$confirm({ title: this.$t("maintenance.common.SureToDelete"), //title: '确定删除?', onOk: () => { this.del(this.selectedCheck()); }, onCancel() {}, }); }, // 导出 exp() { this.form.validateFields((err, values) => { if (!err) { Serve.exp(values); } }); }, generatePdf() { if (this.isGeneratingPdf) { this.$message.warning("正在生成PDF，请稍候..."); return; } let rows = this.table.getCheckboxRecords(); if (rows.length !== 1) { this.$message.error("请选择一行数据!"); return; } this.isGeneratingPdf = true; this.projectId = rows[0].projNo; this.packageNo = rows[0].packageNo; this.isoDrawNo = rows[0].isoDrawNo; this.signFilePath = rows[0].signFilePath; try { Serve.generatePdf({ projNo: this.projectId, packageNo: this.packageNo, isoDrawNo: this.isoDrawNo, signFilePath: this.signFilePath }).then(res => { this.$message.success('生成成功！'); this.table.commitProxy("reload", { page: 0 }); }).catch(err => { this.$message.error('生成失败: ' + err.message); }).finally(() => { this.isGeneratingPdf = false; }); } catch (err) { this.$message.error('生成失败: ' + err.message); // 异常时也需重置状态 this.isGeneratingPdf = false; } }, // 项目号选择匹配默认权重 projChange(event, value) { Serve.findDataByProjNo({ projNo: value }).then(res => { let { commissionWeight, pressureWeight, flushingWeight, reinstatementWeight,appearWeight } = res.data; event.row.commissionWeight = commissionWeight; event.row.pressureWeight = pressureWeight; event.row.flushingWeight = flushingWeight; event.row.reinstatementWeight = reinstatementWeight; event.row.appearWeight = appearWeight; }); }, // 清洗内容系数匹配 flushChange(event, value) { cByName({ name: value }).then(res => { event.row.flushingFactor = res.data.factor; event.row.flushingType = res.data.name; }); }, //测试压力系数匹配 testChange(record) { let { testPressure } = record; Serve.findTestPressureFactor({ testPressure }).then(res => { record.testPressureFactor = res.data; }); }, pressureDescChange(record) { Serve.findTestPressureFactor({ desc: record.pressureDesc }).then(res => { record.testPressureFactor = res.data; }); }, // 关联四级计划 relevance() { let selectIds = this.getCheckboxIds(); let projNo = this.form.getFieldValue("projNo"); if (!projNo || selectIds.length === 0) { this.$message.error("请勾选要处理的数据"); return; } this.progressModal = true; this.$nextTick(() => { this.cycForm.setFieldsValue({ projId: projNo }); }); }, // 同步MC包数据 asyncData() { let params = {}; let projNo = this.form.getFieldValue("projNo"); let system = this.form.getFieldValue("system"); let subSystem = this.form.getFieldValue("subSystem"); if (!projNo) { this.$message.error(this.$t("pipeControll.common.selectProjectNumber")); return; } else { params.projectNumber = projNo; } if (system) { params.tmSycode = system; } if (subSystem) { params.tmSscode = subSystem; } Serve.asyncData(params).then(res => { this.$message.success("同步数据成功！"); }); }, // 模态框取消 modalCancel() { this.progressModal = false; }, getCheckboxIds() { let selected = this.table.getCheckboxRecords(); let arr = selected.map(e => e.id); return arr; }, // 模态框提交更改四级计划 modalSubmit() { let packageIds = this.getCheckboxIds(); let radioRecord = this.table1.getRadioRecord(); if (!radioRecord) { return; } let taskId = radioRecord.id; Serve.relevance({ taskId, packageIds }).then(res => { this.$message.success("关联成功！"); this.modalCancel(); this.search(this.conditionData); }); }, template() { Serve.pdcsMcTemplate(); }, importData() { this.table.readFile({ types: ["xlsx", "xls"] }).then(response => { const { files } = response; if (files.length < 1) return; let params = { file: files[0] }; Serve.importData(params).then(response => { if (response.data.size > 0) { this.$message.error("上传失败，请查看错误文件"); fileSaver.saveAs(response.data, "导入提示.xlsx"); } else { this.$message.success("导入成功"); this.form.validateFields((err, values) => { if (!err) { this.table.commitProxy("reload", { page: 0 }); } }); } }); }); }, getImportColumns() { let arr = this.columns.filter(res => { return res.verification == true; }); return arr; }, check() { let updateRecords = this.table.getUpdateRecords(); let insertRecords = this.table.getInsertRecords(); let records = [...updateRecords, ...insertRecords]; let flag = true; records.forEach(element => { let a = floatObj.add(element.commissionWeight * 1, element.reinstatementWeight * 1); let b = floatObj.add(element.pressureWeight * 1, element.flushingWeight * 1); let c =floatObj.add(a, b); if (floatObj.add(c, element.appearWeight * 1) != 100) { this.$XModal.message({ status: "error", message: "校验不通过！权重比之和必须为100%", }); flag = false; } if (!element.testPressureFactor) { this.$XModal.message({ status: "error", message: "压力系数不可为空，更改实验压力计算压力系数", }); flag = false; } }); if (flag) { this.table.commitProxy("save"); } }, viewPdf(record) { this.selectedRecord = record; this.pdfModalTitle = `查看PDF`; this.fetchPdfTableData(record.projNo); this.pdfModalVisible = true; }, // 新增签名弹窗 handleSign(record) { this.signForm.resetFields(); this.signModalVisible = true; this.selectedRecord = record; this.getSignRoleList(); this.getSignNodeList(); this.isSubmittingSign = false; }, // 获取签名角色列表 getSignRoleList() { getDictionary({code: "mcTemplateSignRole", state: "1"}).then((res) => { this.signRoleList = res.data; }); }, // 获取签名节点列表 getSignNodeList() { getDictionary({code: "mcTemplateSignNode", state: "1"}).then((res) => { this.signNodeList = res.data; }); }, handleSignSubmit() { if (this.isSubmittingSign) { this.$message.warning("正在提交签名，请稍候..."); return; } this.signForm.validateFields((err, values) => { if (!err) { this.isSubmittingSign = true; const params = { id: this.selectedRecord.id, projNo: this.selectedRecord.projNo, packageNo: this.selectedRecord.packageNo, version: this.selectedRecord.version, ...values }; Serve.submitSign(params) .then(res => { this.$message.success('签名成功！'); this.signModalVisible = false; this.table.commitProxy("reload", { page: 0 }); }) .catch(err => { this.$message.error('签名失败: ' + (err.message || '未知错误')); }) .finally(() => { this.isSubmittingSign = false; }); } }); }, // 签名弹窗取消 handleSignCancel() { this.signModalVisible = false; }, fetchPdfTableData(projectId) { // 调用接口获取表格数据 Serve.getTemplateSectionList({ projectId: projectId }).then(res => { this.pdfTableData = res.data; }); }, downloadPdf() { Serve.downloadPdf({ projNo: this.selectedRecord.projNo, packageNo: this.selectedRecord.packageNo, version: this.selectedRecord.version }).then(res => { const blob = new Blob([res.data], { type: 'application/pdf' }); const url = window.URL.createObjectURL(blob); const link = document.createElement('a'); link.href = url; link.setAttribute('download', `${this.selectedRecord.packageNo}_${this.selectedRecord.version}.pdf`); document.body.appendChild(link); link.click(); document.body.removeChild(link); window.URL.revokeObjectURL(url); }).catch(err => { this.$message.error('下载PDF失败: ' + err.message); }); }, viewPdfContent() { Serve.viewPdf({ projNo: this.selectedRecord.projNo, packageNo: this.selectedRecord.packageNo, version: this.selectedRecord.version }).then(res => { const blob = new Blob([res.data], { type: 'application/pdf' }); this.pdfUrl = window.URL.createObjectURL(blob); window.open(this.pdfUrl, '_blank'); }).catch(err => { this.$message.error('预览失败: ' + err.message); }); }, viewHistoryVersions() { this.historyModalVisible = true; this.historyVersion = ''; }, handleHistoryVersionOk() { if (!this.historyVersion) { this.$message.error('请输入版本号'); return; } Serve.viewPdf({ projNo: this.selectedRecord.projNo, packageNo: this.selectedRecord.packageNo, version: this.historyVersion, isHistoryVersion: 1 }).then(res => { if (!res.data || res.data.size == 0) { this.$message.error("没有该版本的PDF"); return; } const blob = new Blob([res.data], { type: 'application/pdf' }); this.pdfUrl = window.URL.createObjectURL(blob); window.open(this.pdfUrl, '_blank'); this.historyModalVisible = false; }).catch(err => { this.$message.error('预览失败: ' + err.message); }); }, handleHistoryVersionCancel() { this.historyModalVisible = false; }, viewChangeLogs() { Serve.getMcPackageDataLog({ projectId: this.selectedRecord.projNo, packageNo: this.selectedRecord.packageNo }).then(res => { this.pdfModalLogData = res.data; this.pdfModalLogTitle = '日志详情'; this.pdfModalLogVisible = true; }); }, viewLog(record) { Serve.getMcPackageDataLog({ projectId: this.selectedRecord.projNo, packageNo: this.selectedRecord.packageNo, sectionId: record.id }).then(res => { this.pdfModalLogData = res.data; this.pdfModalLogVisible = true; this.pdfModalLogTitle = '日志详情'; }); }, pdfModalLogCancel() { this.pdfModalLogVisible = false; }, maintain(record) { this.selectedSection = record; this.maintainModalVisible = true; Serve.getMcPackageDataPageList({ projectId: this.selectedRecord.projNo, packageNo: this.selectedRecord.packageNo, version: this.selectedRecord.version, sectionId: record.id }).then(res => { this.maintainTableData = res.data; }); }, handleAddContent() { this.fileList = []; this.insertPageNumber = ''; this.isUpload = true; this.isPage = true; this.addContentModalVisible = true; }, handleUpload({ fileList }) { this.fileList = fileList; this.fileList.forEach(file => { if (file.status === "done") { if (file.response && file.response.id) { this.fileId = file.response.id; } else if (file.id) { this.fileId = file.id; } } }); }, handleInsertPage() { const projectId = this.selectedRecord.projNo; const packageNo = this.selectedRecord.packageNo; const sectionId = this.selectedSection.id; if (this.isUpload == true && this.isPage == true) { const filePath = this.fileId; const pageNum = this.insertPageNumber; if (!filePath) { this.$message.error('请选择要插入的PDF！'); return; } if (!pageNum) { this.$message.error('请输入要插入的页数！'); return; } Serve.add({ projectId, packageNo, sectionId, filePath, pageNum }) .then(res => { this.$message.success('插入页数成功！'); this.addContentModalVisible = false; this.maintain(this.selectedSection); }) } if (this.isUpload == true && this.isPage == false) { const filePath = this.fileId; const version = this.version; const pageNum = this.pageNum; if (!filePath) { this.$message.error('请选择要替换的PDF！'); return; } Serve.replacePage({ projectId, packageNo, sectionId, filePath, version, pageNum }).then(res => { this.$message.success('替换成功！'); this.addContentModalVisible = false; this.maintain(this.selectedSection); }) } if (this.isUpload == false && this.isPage == true){ const pageNum = this.insertPageNumber; const version = this.version; const id = this.dataPageId; const originPageNum = this.originPageNumber; if (!this.insertPageNumber) { this.$message.error('请输入要插入的页数！'); return; } if(this.originPageNumber == this.insertPageNumber) { this.$message.warn('页数相同，无需调整！'); return; } Serve.adjustPage({ projectId, packageNo, sectionId, version, pageNum, id, originPageNum }).then(res => { this.$message.success('成功！'); this.addContentModalVisible = false; this.maintain(this.selectedSection); }) } }, handleViewAttachment(record) { preview(record.filePath).then(res => { if (!res.error) { let fileName = ""; let tmp = res.headers["content-disposition"]; if (tmp != null && tmp != "" && tmp != "undefined") { let startIndex = tmp.indexOf('filename="') + 10; let endIndex = tmp.indexOf('"', startIndex); fileName = tmp.substring(startIndex, endIndex); } let puffix = fileName.split(".")[0]; let suffix = fileName.split(".")[1]; if (suffix == "pdf") { let blob = new Blob([res.data], { type: 'application/pdf' }); let fileUrl = URL.createObjectURL(blob); window.open(fileUrl, '_blank'); } else { fileSaver.saveAs(res.data, puffix + "preview" + suffix); } } }); }, handleDelete(record) { Modal.confirm({ title: '确认框', content: '确定要删除？', okText: '确认', cancelText: '取消', onOk: () => { const projectId = this.selectedRecord.projNo; const packageNo = this.selectedRecord.packageNo; const sectionId = this.selectedSection.id; const pageNum = record.pageNum; const version = record.version; Serve.deletePage({ projectId, packageNo, sectionId, version, pageNum }).then(res => { this.$message.success('删除成功！'); this.maintain(this.selectedSection); }) } }) }, handleReplace(record) { this.isPage = false; this.isUpload = true; this.fileList = []; this.insertPageNumber = ''; this.addContentModalVisible = true; this.version = record.version; this.pageNum = record.pageNum; }, handleAdjustPage(record) { this.isPage = true; this.isUpload = false; this.fileList = []; this.insertPageNumber = ''; this.addContentModalVisible = true; this.version = record.version; this.dataPageId = record.id; this.originPageNumber = record.pageNum }, pdfModalCancel() { this.pdfModalVisible = false; }, handleLog(record) { this.logModalTitle = `日志 - ${record.packageNo}`; this.fetchLogTableData(record.id); this.logModalVisible = true; }, fetchLogTableData(mcPackageId) { Serve.getMcPackageLogList({ mcPackageId: mcPackageId }).then(res => { this.logTableData = res.data; }); }, logModalCancel() { this.logModalVisible = false; }, updateMcPdf(record) { const projectId = this.selectedRecord.projNo; const packageNo = this.selectedRecord.packageNo; const mcPackageId = this.selectedRecord.id; const params = { ...record, projectId, packageNo, mcPackageId }; Serve.updateMcPdf(params).then(res => { this.$message.success('更新成功！'); }); }, updateIndexRemark(record) { this.templateNameKey = record.nameKey; const { projNo, packageNo } = this.selectedRecord; try { // 调用接口获取备注数据 Serve.getMcPackageData({ projNo, packageNo }).then(res => { const indexRemark = res.data.indexRemark; this.mcPackageDataId = res.data?.id || null; const remarkMap = {}; if (indexRemark && indexRemark != "") { JSON.parse(indexRemark).forEach(item => { const key = Object.keys(item)[0]; remarkMap[key] = item[key]; }); } this.remarkModalData = this.pdfTableData.map(item => ({ ...item, remark: item.nameKey ? remarkMap[item.nameKey] || "" : "", })); this.remarkModalVisible = true; }); } catch (error) { console.error("获取备注失败:", error); this.$message.error("获取备注失败"); } }, saveRemarks() { try { const indexRemark = this.remarkModalData.reduce((acc, item) => { if (item.nameKey) { acc.push({ [item.nameKey]: item.remark }); } return acc; }, []); const indexRemarkStr = JSON.stringify(indexRemark); Serve.updateMcPackageData({ id: this.mcPackageDataId, indexRemark: indexRemarkStr, projectId: this.selectedRecord.projNo, packageNo: this.selectedRecord.packageNo,templateNameKey: this.templateNameKey }).then(res => { if (!res.error) { this.$message.success('更新备注成功'); this.remarkModalVisible = false; } }); } catch (error) { console.error('更新备注失败:', error); this.$message.error('更新备注失败'); } }, }, }; </script> vue2示例如上，需要转换成vue3 vue3示例如下 <c-search-panel ref=“searchPanelRef” :columns=“tableState.columns” @search=“onSearch” </c-search-panel> <c-table :columns=“tableState.columns” :proxy-config=“tableState.proxyConfig” :toolbar=“tableState.toolbar” @toolbar-button-click=“onToolbarClick” :pagination=“tableState.pagination” :sortConfig=“{ showIcon: false }” :row-selection=“rowSelection” ref=“tableRef” <template #action="{ record }"> <a-button type="link" @click="editRow(record)">{{ t("pipeControll.mc.edit") }}</a-button> </template> </c-table> <c-modal :title="action === 'add' ? '新增系统' : '编辑系统'" destroyOnClose v-model:open="open" okText="确认" cancelText="取消" @ok="handleOk" width="650px" > <a-form :model="formState" name="basic" :label-col="{ span: 6 }" :wrapper-col="{ span: 16 }" ref="formRef" > <a-row> <a-col> <a-input v-model:value="formState.id" v-if="false"/> </a-col> <a-col span="12"> <a-form-item :label="t('ptwSystem.system.projectId')" name="projectNo" :rules="[{ required: true, message: 'Please Select Project!' }]" > <c-project-select v-model:value="formState.projectNo" :field-names="{ value: 'projId' }" :disabled="isDisabledComputed" /> </a-form-item> </a-col> <a-col span="12"> <a-form-item :label="t('pipeControll.mc.sysCode')" name="sysNo" :rules="[{ required: true, message: 'Please Input!' }]" > <a-input v-model:value="formState.sysNo" :disabled="isDisabledComputed"/> </a-form-item> </a-col> </a-row> <a-row> <a-col :span="colSpan"> <a-form-item :label-col="{ span: 4 }" :wrapper-col="{ span: 19 }" :label="t('pipeControll.mc.systemName')" name="sysName" :rules="[{ required: true, message: 'Please Input!' }]" > <a-input v-model:value="formState.sysName"/> </a-form-item> </a-col> </a-row> <a-card :title="t('pipeControll.mc.subsysInfo')"> <c-table :columns="subTableState.columns" :pagination="false" :dataSource="subTableState.dataSource" height="250" :toolbar="subTableState.toolbar" @toolbar-button-click="onSubToolbarClick" :sortConfig="{ showIcon: false }" :rowSelection="{ selectedRowKeys: subTableState.selectedRowKeys, onChange: onSelectChange }" ref="subTableRef" > </c-table> </a-card> </a-form> </c-modal> </template> <script setup> import * as server from "@/packages/piping/api/cpmc/index" import {computed, createVNode, reactive, ref} from "vue" import {useI18n} from "vue-i18n" import {message, Modal} from "ant-design-vue" import {ExclamationCircleOutlined} from "@ant-design/icons-vue" import {saveAs} from "file-saver" const {t} = useI18n() const action = ref(null) const searchPanelRef = ref(null) const isDisabledComputed = computed(() => { if (action.value == "add") { return false } else { return true } }) const searchForm = computed(() => { if (searchPanelRef.value) { return searchPanelRef.value.getForm() } return null }) const tableState = reactive({ toolbar: { buttons: [ { code: "insert", status: 'primary', icon: 'PlusOutlined', // name: "新增", name: t("pipeControll.mc.add"), resource: [{url: "/service-piping/cp/mc/system", method: "POST"}] }, { code: "deleteData", status: 'danger', icon: 'DeleteOutlined', // name: "删除", name: t("pipeControll.mc.delete"), resource: [{url: "/service-piping/cp/pipe/mc/system/delete", method: "POST"}] }, { name: '模板导入', dropdowns: [ { code: "downloadModal", status: 'warning', icon: 'DownloadOutlined', // name: "下载导入模板", name: t("pipeControll.mc.importTemplate"), resource: [{url: "/service-piping/cp/pipe/mc/system/exportTemplate", method: "GET"}] }, { code: "importModal", status: 'success', icon: 'UploadOutlined', // name: "导入", name: t("pipeControll.mc.import"), resource: [{url: "/service-piping/pipe/cp/mc/system/importData", method: "POST"}] }, ] }, { code: "exportExcel", status: 'warning', icon: 'DownloadOutlined', // name: "导出", name: t("pipeControll.mc.export"), resource: [{url: "/service-piping/cp/mc/system/export", method: "GET"}] } ], }, selectedRowKeys: [], pagination: {pageSize: 20}, proxyConfig: { autoLoad: false, ajax: { query: (pagination) => server.systemPage({...pagination, ...conditionData.value}) } }, columns: [ { // title: "项目", title: t("ptwSystem.system.projectNo"), dataIndex: "projectNo", width: 60, type: "project", condition: true, options: { options: [], fieldNames: {label: "projId", value: "projId"} }, }, { // title: "系统号", title: t("ptwSystem.system.sysCode"), dataIndex: "sysNo", width: 100, condition: true }, { // title: "系统名称", title: t("pipeControll.mc.systemName"), dataIndex: "sysName", width: 180, condition: true }, { // title: "子系统数量", title: t("pipeControll.mc.subSystemQuantity"), dataIndex: "subSysQuantity", width: 130 }, { // title: "创建人", title: t("pipeControll.mc.creator"), dataIndex: "createUserNo", type: "employeeDescription", options: { fieldNames: { label: "createUserName", value: "createUserNo" } } }, { // title: "创建时间", title: t("pipeControll.mc.createDate"), dataIndex: "createDate", width: 100, type: "datetime" }, { // title: "更新人", title: t("pipeControll.mc.updater"), dataIndex: "updateUserNo", type: "employeeDescription", options: { fieldNames: { label: "updateUserName", value: "updateUserNo" } } }, { // title: "更新时间", title: t("pipeControll.mc.updateDate"), dataIndex: "updateDate", width: 100, type: "datetime" }, { // title: "操作", title: t("pipeControll.mc.operation"), key: "action", scopedSlots: {customRender: "action"}, width: 80, fixed: "right", formInvisible: true } ] }) const subTableState = reactive({ selectedRowKeys: [], toolbar: { buttons: [ { code: "insertInfo", status: "primary", icon: "PlusOutlined", // name: "新增" name: t("pipeControll.mc.add") }, { code: "deleteInfo", status: "danger", icon: "DeleteOutlined", // name: "删除" name: t("pipeControll.mc.delete") } ], showFilter: false }, columns: [ { // title: "子系统号", title: t("pipeControll.mc.subSystemNo"), dataIndex: "subsysNo", width: 100, condition: true, editable: true, rules: [{required: true, message: "必填项！"}] }, { // title: "子系统名称", title: t("pipeControll.mc.subSystemName"), dataIndex: "subsysName", width: 200, condition: true, editable: true, rules: [{required: true, message: "必填项！"}] } ], dataSource: [] }) const tableRef = ref(null) const ctable = computed(() => tableRef.value?.getTable()) const subTableRef = ref(null) const cSubTable = computed(() => subTableRef.value?.getTable()) const conditionData = ref() const formState = ref({projectNo: undefined, sysNo: undefined, sysName: undefined}) const colSpan = ref(24) const open = ref(false) const formRef = ref() const selectedRow = ref([]) const deletedRows = ref([]) //搜索 const onSearch = (values) => { conditionData.value = values ctable.value.commitProxy("query", values) } const onToolbarClick = (target) => { switch (target.code) { case "insert": funInsertModal() break case "deleteData": fundeleteModal() break case "downloadModal": funDownloadModal() break case "importModal": funImportModal() break case "exportExcel": funExportModal() break default: break } } const onSubToolbarClick = (target) => { switch (target.code) { case "insertInfo": insertInfo() break case "deleteInfo": deleteInfo() break default: break } } const rowSelection = computed(() => { return { selectedRowKeys: tableState.selectedRowKeys, onChange: (selectedRowKeys, selectedRows) => { tableState.selectedRowKeys = selectedRowKeys selectedRow.value = selectedRows } } }) const onSelectChange = (selectedRowKeys) => { subTableState.selectedRowKeys = selectedRowKeys } const insertInfo = () => { cSubTable.value.insert({ id: undefined, projectNo: undefined, sysNo: undefined, sysName: undefined }) } const deleteInfo = () => { subTableState.selectedRowKeys.forEach((rowKey) => { const row = cSubTable.value.getRowById(rowKey) if (row) { row.status = 0 deletedRows.value.push({...row}) cSubTable.value.deleteRowByRowKey(rowKey) } }) subTableState.selectedRowKeys = [] } const funInsertModal = () => { action.value = "add" open.value = true formState.value = {} subTableState.dataSource = [] } const editRow = (record) => { action.value = "edit" open.value = true formState.value = record subTableState.selectedRowKeys = [] server.getSubsystemDropList({projectNo: record.projectNo, sysNo: record.sysNo}).then((res) => { subTableState.dataSource = res.data }) } const fundeleteModal = () => { if (tableState.selectedRowKeys.length == 0) { message.error("请选择至少一条需要删除的数据") return } Modal.confirm({ title: "请确认是否要进行删除？", icon: createVNode(ExclamationCircleOutlined), content: "该操作一旦执行无法撤回", okText: "确认", okType: "danger", cancelText: "取消", onOk() { let param = tableState.selectedRowKeys.map((item) => { return {id: item} }) server.systemDelete(param).then(() => { message.success("删除成功") ctable.value.commitProxy("query") }) }, onCancel() { console.log("Cancel") } }) } const funDownloadModal = () => { server.systemTemplate() } const funImportModal = () => { ctable.value.readFile({types: ["xlsx", "xls"]}).then((response) => { const {file} = response handleFileChange(file) }) } const handleFileChange = (event) => { const selectedFile = event let param = { file: selectedFile } server.systemImportData(param).then((res) => { const contentType = res.headers["content-type"] if (!contentType) { // 处理数组对象 message.success("导入成功") ctable.value.commitProxy("query") } else if (contentType.includes("application/vnd.ms-excel;charset=utf-8")) { message.error("上传失败，请查看错误文件") saveAs(res.data, "导入提示.xlsx") } }) } const funExportModal = () => { searchForm.value.validateFields().then((values) => { server.systemExport({...values}) }) } const handleOk = () => { formRef.value .validate() .then(() => { let param = { id: formState.value.id, projectNo: formState.value.projectNo, sysNo: formState.value.sysNo, sysName: formState.value.sysName } cSubTable.value.validateEditFields().then(() => { param.mcSubsystemList = [...cSubTable.value.getUpdateRecords(), ...deletedRows.value] server.systemSave(param).then(() => { message.success("保存成功") open.value = false ctable.value.commitProxy("query") }) }) }) .catch((error) => { console.log("error", error) }) } </script>
09-11
- 模板部分：直接使用Vue3的写法，注意一些Vue3中弃用的特性（如`slot`和`slot-scope`改为`v-slot`，过滤器改为方法或计算属性等）。 - 脚本部分：使用`<script setup>`，将数据、方法、计算属性等转换为...
请详细分析下面代码：<template> <div> <a-form-model ref="formRef" :model="searchData" :rules="rules" > <a-card style="margin-top: 20px" title="Applicant Information"> <a-row> <a-col :span="12"> <a-form-model-item prop="caseNo" label="Case NO:" :labelCol="{ span: 6 }" :wrapperCol="{ span: 12, offset: 2 }" :required='required'> <a-input v-model="searchData.caseNo" :disabled="disabled" /> </a-form-model-item> </a-col> <a-col :span="12"> <a-form-model-item prop="status" label="Status:" :labelCol="{ span: 6 }" :wrapperCol="{ span: 12, offset: 2 }" :required='required'> <a-input v-model="searchData.status" :disabled="disabled" /> </a-form-model-item> </a-col> </a-row> <a-row> <a-col :span="12" v-if="false"> <a-form-model-item prop="applicant" label="Applicant:" :labelCol="{ span: 6 }" :wrapperCol="{ span: 12, offset: 2 }" :required='required'> <a-input v-model="searchData.applicant" :disabled="disabled" /> </a-form-model-item> </a-col> <a-col :span="12"> <a-form-model-item prop="applicantName" label="Applicant:" :labelCol="{ span: 6 }" :wrapperCol="{ span: 12, offset: 2 }" :required='required'> <a-textarea v-model="searchData.applicantName" :disabled="disabled" /> </a-form-model-item> </a-col> <a-col :span="12"> <a-form-model-item prop="orgDescription" label="Org Description:" :labelCol="{ span: 6 }" :wrapperCol="{ span: 12, offset: 2 }" :required='required'> <a-textarea v-model="searchData.orgDescription" :disabled="disabled" /> </a-form-model-item> </a-col> </a-row> <a-row> <a-col :span="12"> <a-form-model-item prop="createTime" label="Create Date:" :labelCol="{ span: 6 }" :wrapperCol="{ span: 12, offset: 2 }" :required='required'> <a-input v-model="searchData.createTime" :disabled="disabled" /> </a-form-model-item> </a-col> </a-row> </a-card> <a-card style="margin-top: 20px" title="Base Information"> <a-row> <a-col :span="12"> <a-form-model-item prop="caseType" label="Case Type:" :labelCol="{ span: 6 }" :wrapperCol="{ span: 14, offset: 2 }" :required ='required'> <a-radio-group v-model="searchData.caseType" @change="caseTypeChange" :disabled="signCaseVo.jyStatus!='Applicant'"> <a-radio :value="1">out</a-radio> <a-radio :value="0">inner</a-radio> </a-radio-group> </a-form-model-item> </a-col> <a-col :span="12"> <a-form-model-item prop="realFabBu" label="Real Fab Bu:" :labelCol="{ span: 6 }" :wrapperCol="{ span: 12, offset: 2 }" > <a-select placeholder="请选择" v-model="searchData.realFabBu" style="width: 100%" :disabled="signCaseVo.jyStatus!='Applicant'"> <a-select-option v-for="item in fabList" :key="item">{{ item }}</a-select-option> </a-select> </a-form-model-item> </a-col> </a-row> <a-row> <a-col :span="12"> <a-form-model-item prop="changeStatus" label="Change Status:" :labelCol="{ span: 6 }" :wrapperCol="{ span: 14, offset: 2 }" :required ='required'> <a-radio-group v-model="searchData.changeStatus" @change="changeStatusChange" :disabled="signCaseVo.jyStatus!='Applicant'"> <a-radio :value="1">yes</a-radio> <a-radio :value="0">no</a-radio> </a-radio-group> </a-form-model-item> </a-col> <a-col :span="12"> <a-form-model-item prop="changeCode" label="Change Code:" :labelCol="{ span: 6 }" :wrapperCol="{ span: 12, offset: 2 }" > <a-select placeholder="请选择" v-model="searchData.changeCode" style="width: 100%" :disabled="signCaseVo.jyStatus!='Applicant'"> <a-select-option v-for="item in fabList" :key="item">{{ item }}</a-select-option> </a-select> </a-form-model-item> </a-col> </a-row> <a-row> <a-col :span="12"> <a-form-model-item prop="flowType" label="Flow Type:" :labelCol="{ span: 6 }" :wrapperCol="{ span: 12, offset: 2 }" :required='required'> <a-select placeholder="请选择" v-model="searchData.flowType" style="width: 100%" :disabled="signCaseVo.jyStatus!='Applicant'"> <a-select-option :value="0">Normal</a-select-option> <a-select-option :value="1">Urgent</a-select-option> </a-select> </a-form-model-item> </a-col> <a-col :span="12"> <a-form-model-item prop="equipmentType" label="Equipment Type:" :labelCol="{ span: 6 }" :wrapperCol="{ span: 12, offset: 2 }" :required='required'> <a-select placeholder="请选择" v-model="searchData.equipmentType" style="width: 100%" :disabled="signCaseVo.jyStatus!='Applicant'"> <a-select-option v-for="item in equipmentTypeList" :key="item">{{ item }}</a-select-option> </a-select> </a-form-model-item> </a-col> </a-row> <a-row> <a-col :span="12"> <a-form-model-item prop="expectTime" label="Expect Time:" :labelCol="{ span: 6 }" :wrapperCol="{ span: 12, offset: 2 }" :required='required'> <a-date-picker type="date" valueFormat="YYYY-MM-DD HH:mm:ss" v-model="searchData.expectTime" :disabled="signCaseVo.jyStatus!='Applicant'" :show-time="{ defaultValue: moment('00:00:00', 'HH:mm:ss') }"/> </a-form-model-item> </a-col> <a-col :span="12"> <a-form-model-item prop="expectUsageHours" label="Expect Usage Hours:" :labelCol="{ span: 6 }" :wrapperCol="{ span: 12, offset: 2 }" :required='required'> <a-input v-model="searchData.expectUsageHours" type="number" :disabled="signCaseVo.jyStatus!='Applicant'"/> </a-form-model-item> </a-col> </a-row> <a-row > <a-col :span="12"> <a-form-model-item prop="purposeCode" label="Purpose Code:" :labelCol="{ span: 6 }" :wrapperCol="{ span: 12, offset: 2 }" :required='required'> <a-select placeholder="请选择" v-model="searchData.purposeCode" style="width: 100%" @change="actionChange" :disabled="signCaseVo.jyStatus!='Applicant'"> <a-select-option v-for="item in purposeCodeList" :key="item">{{ item }}</a-select-option> </a-select> </a-form-model-item> </a-col> </a-row> <a-row v-if="isShow2"> <a-col :span="12"> <a-form-model-item prop="projectCode" label="Project Code:" :labelCol="{ span: 6 }" :wrapperCol="{ span: 12, offset: 2 }" :required='required'> <a-input v-model="searchData.projectCode" :disabled="signCaseVo.jyStatus!='Applicant'||disabled2"/> <a-button @click="checkCode()" :disabled="signCaseVo.jyStatus!='Applicant'">check</a-button> <a-button @click="resetCode()" :disabled="signCaseVo.jyStatus!='Applicant'">reset</a-button> </a-form-model-item> </a-col> </a-row> <a-row v-if="isShow2"> <a-col :span="12"> <a-form-model-item prop="projectName" label="project name" :labelCol="{ span: 6 }" :wrapperCol="{ span: 12, offset: 2 }" :required='required'> <a-input v-model="searchData.projectName" :disabled="disabled" /> </a-form-model-item> </a-col> </a-row> <a-row v-if="isShow"> <a-row v-for="(lot, index) in searchData.lotList" :key="index" > <a-col :span="12"> <a-form-model-item :prop="`lotList.${index}.lotId`" label="lotId" :labelCol="{ span: 6 }" :wrapperCol="{span: 12,offset: 2 }" :rules="[{ required: true, message: 'lotId is required', trigger: 'change' }]"> <a-input v-model="lot.lotId" :disabled="signCaseVo.jyStatus!='Applicant'" type="String" @blur="lotBlur(lot.lotId,index)" /> </a-form-model-item> </a-col> <a-col :span="12"> <a-form-model-item label="operation" :labelCol="{ span: 6 }" :wrapperCol="{span: 12,offset: 2 }"> <a-button @click="deleteItem(searchData.lotList, index)" :disabled="signCaseVo.jyStatus!='Applicant'" >Delete {{lot.lotId}}</a-button> </a-form-model-item> </a-col> <a-col :span="12"> <a-form-model-item :prop="`lotList.${index}.vendorId`" label="vendorId" :labelCol="{ span: 6 }" :wrapperCol="{span: 12,offset: 2 }"> <a-input v-model="lot.vendorId" type="String" :disabled="signCaseVo.jyStatus!='Applicant'" /> </a-form-model-item> </a-col> <a-col :span="12"> <a-form-model-item :prop="`lotList.${index}.waferId`" label="waferId" :labelCol="{ span: 6 }" :wrapperCol="{span: 16,offset: 2 }"> <a-input v-model="lot.waferId" :disabled="signCaseVo.jyStatus!='Applicant'" type="String" @click="cliWaferID(index)" @keydown.prevent /> </a-form-model-item> </a-col> </a-row> <a-row class="form-row" > <a-col :span="12"> <a-form-model-item :wrapperCol="{span: 12,offset: 8 }"> <a-button @click="addLotList(searchData.lotList)" :disabled="signCaseVo.jyStatus!='Applicant'"> AddLot </a-button> </a-form-model-item> </a-col> </a-row> </a-row> <a-row v-if="isShow"> <a-col :span="12"> <a-form-model-item prop="po" label="PO/Electronic/E-mail:" :labelCol="{ span: 6 }" :wrapperCol="{ span: 12, offset: 2 }"> <a-input v-model="searchData.po" :disabled="signCaseVo.jyStatus!='Applicant'"/> </a-form-model-item> </a-col> <a-col :span="12"> <a-form-model-item prop="customerRequester" label="Customer Requester:" :labelCol="{ span: 6 }" :wrapperCol="{ span: 12, offset: 2 }"> <a-input v-model="searchData.customerRequester" :disabled="signCaseVo.jyStatus!='Applicant'"/> </a-form-model-item> </a-col> </a-row> <a-row> <a-col :span="24"> <a-form-model-item prop="borrowPurpose" label="Borrow Purpose:" :labelCol="{ span: 3 }" :wrapperCol="{ span: 6, offset: 1 }" :required='required'> <a-textarea v-model="searchData.borrowPurpose" placeholder="borrowPurpose" :rows="8" :disabled="signCaseVo.jyStatus!='Applicant'"/> </a-form-model-item> </a-col> </a-row> <a-row> <a-col :span="12"> <a-form-model-item prop="targetEquipmentId" label="Target Equipment ID:" :labelCol="{ span: 6 }" :wrapperCol="{ span: 12, offset: 2 }" :required='required'> <a-input v-model="searchData.targetEquipmentId" :disabled="signCaseVo.jyStatus!='Applicant'"/> </a-form-model-item> </a-col> </a-row> </a-card> <a-card style="margin-top: 20px" title="Testing Plant Frame/MPC Confirm" v-if="signCaseVo.jyStatus=='MPC'||signCaseVo.jyStatus=='LineSuper'||signCaseVo.jyStatus=='SuperClose'||signCaseVo.jyStatus=='Close'||signCaseVo.jyStatus=='Cancel'" > <a-row> <a-col :span="12"> <a-form-model-item prop="executeTime" label="Permit Execute Time:" :labelCol="{ span: 6 }" :wrapperCol="{ span: 12, offset: 2 }" :required ='required'> <a-date-picker placeholder="具体借机时间" type="date" valueFormat="YYYY-MM-DD HH:mm:ss" v-model="searchData.executeTime" :disabled="signCaseVo.jyStatus!='MPC'" :show-time="{ defaultValue: moment('00:00:00', 'HH:mm:ss') }"/> </a-form-model-item> </a-col> <a-col :span="12"> <a-form-model-item prop="executeHours" label="Permit Execute Hours:" :labelCol="{ span: 6 }" :wrapperCol="{ span: 12, offset: 2 }" :required='required'> <a-input placeholder="具体使用多久(整数)" v-model="searchData.executeHours" :disabled="signCaseVo.jyStatus!='MPC'"/> </a-form-model-item> </a-col> </a-row> <a-row> <a-col :span="12"> <a-form-model-item prop="planEquipmentId" label="Plan Equipment ID:" :labelCol="{ span: 6 }" :wrapperCol="{ span: 12, offset: 2 }" :required='required'> <a-input placeholder="计划借机机台号" v-model="searchData.planEquipmentId" :disabled="signCaseVo.jyStatus!='MPC'"/> </a-form-model-item> </a-col> </a-row> </a-card> <a-card style="margin-top: 20px" title="Line Leader Plant Frame" v-if="signCaseVo.jyStatus=='LineSuper'||signCaseVo.jyStatus=='SuperClose'||signCaseVo.jyStatus=='Close'||signCaseVo.jyStatus=='Cancel'" > <a-row> <a-col :span="12"> <a-form-model-item prop="realEquipmentId" label="Real Equipment ID:" :labelCol="{ span: 6 }" :wrapperCol="{ span: 12, offset: 2 }" :required ='required'> <a-input placeholder="实际使用机台号" v-model="searchData.realEquipmentId" :disabled="signCaseVo.jyStatus!='LineSuper'"/> </a-form-model-item> </a-col> <a-col :span="12"> <a-form-model-item prop="setUpTime" label="Set Up Time:" :labelCol="{ span: 6 }" :wrapperCol="{ span: 12, offset: 2 }" :required='required'> <a-date-picker placeholder="开始时间" type="date" valueFormat="YYYY-MM-DD HH:mm:ss" v-model="searchData.setUpTime" :disabled="signCaseVo.jyStatus!='LineSuper'" :show-time="{ defaultValue: moment('00:00:00', 'HH:mm:ss') }"/> </a-form-model-item> </a-col> </a-row> <a-row> <a-col :span="12"> <a-form-model-item prop="setOffTime" label="Set Off Time:" :labelCol="{ span: 6 }" :wrapperCol="{ span: 12, offset: 2 }" > <a-date-picker placeholder="结束时间" type="date" valueFormat="YYYY-MM-DD HH:mm:ss" v-model="searchData.setOffTime" :show-time="{ defaultValue: moment('00:00:00', 'HH:mm:ss') }" :disabled="signCaseVo.jyStatus!='SuperClose'" @change="changeSetOffTime"/> </a-form-model-item> </a-col> <a-col :span="12"> <a-form-model-item prop="borrowHours" label="Machine Borrow Hours:" :labelCol="{ span: 6 }" :wrapperCol="{ span: 12, offset: 2 }" > <a-input placeholder="实际借用时间" v-model="searchData.borrowHours" :disabled="true" /> </a-form-model-item> </a-col> </a-row> <a-row> <a-col :span="12"> <a-form-model-item prop="checkStatus" label="TMPG Status/Check Items 1:" :labelCol="{ span: 6 }" :wrapperCol="{ span: 12, offset: 2 }" > <a-checkbox v-model="searchData.checkStatus" :disabled="signCaseVo.jyStatus!='SuperClose'">还机时机台/硬件MES状态正常</a-checkbox> </a-form-model-item> </a-col> </a-row> <a-row> <a-col :span="12"> <a-form-model-item prop="returnToTmpgStatus" label="TMPG Status/Check Items 2:" :labelCol="{ span: 6 }" :wrapperCol="{ span: 12, offset: 2 }" > <a-checkbox v-model="searchData.returnToTmpgStatus" :disabled="signCaseVo.jyStatus!='SuperClose'">还机时机台内无物料</a-checkbox> </a-form-model-item> </a-col> </a-row> </a-card> <a-card style="margin-top: 20px" title="File Information" v-if="this.$route.query.id"> <a-row> <a-col :span="12" > <a-upload :show-upload-list="false" :before-upload="(file) => beforeUpload2(file, text)" > <a-button :disabled="signCaseVo.jyStatus!='Applicant'"> 添加文件 </a-button> </a-upload> </a-col> </a-row> <a-table class="ttable" :columns="columns4" :data-source="fileLists" :pagination="false" :rowKey=" (record, index) => { return index; } " :locale="{ emptyText: '暂无数据' }" @change="handleTableChange"> <span slot="delete" slot-scope="text" > <a @click="deleteList(text)" :disabled="signCaseVo.jyStatus!='Applicant'">Delete</a> </span> <span slot="download" slot-scope="text"> <a @click="downloadList(text)">Download</a> </span> </a-table> </a-card> <a-card style="margin-top: 20px" title="Signoff"> <a-row> <a-row> <a-col :span="24"> <a-form-item label="Comment" :labelCol="{ span: 3 }" :wrapperCol="{ span: 12, offset: 1 }" > <a-textarea style="width: 100%; height: 160px" :maxLength=500 v-model="signCaseVo.comment" ></a-textarea> </a-form-item> </a-col> </a-row> <a-row style="margin-top: 20px" justify="center" type="flex"> <template v-for="item of signCaseVo.actionNames"> <a-button style=" margin-right: 80px; border-radius: 8px; font-weight: bolder; " :key="item" @click="signOff" v-bind:disabled=" signCaseVo.comment && signCaseVo.comment.trim() != '' ? false : true " :data-type="item" > {{ item }} </a-button> </template> </a-row> </a-row> </a-card> <a-card style="margin-top: 20px" title="审批意见" class="colora"> <a-table class="ttable" :columns="columns1" :data-source="signOffHistory" :pagination="false" :rowKey=" (record, index) => { return index; } " :locale="{ emptyText: ' ' }" > <span slot="creator" slot-scope="text, value"> <a @click="toAddressBook(text, value)">{{text}}</a> </span> </a-table> </a-card> </a-form-model> <a-modal :width="900" v-model="WaferIDNumber" v-drag-modal title="Wafer List"> <a-input style="display: none;" v-model="this.indexFlag" /> <a-row> <a-col :span="6"> <a-checkbox v-model="isChecked" value="all" @change="checkboxAll" style="color: black; font-weight: 600">all</a-checkbox> </a-col> </a-row> <a-checkbox-group v-model="checkoutValue" :options="plainOption"></a-checkbox-group> <template #footer> <a-button type="primary" @click="isOk">OK</a-button> <a-button type="primary" @click="isCancel">Cancel</a-button> </template> </a-modal> </div> </template> <script> import { getFabList,listPurposeCode,listEquipmentType,queryDetails,signOffOrder,listChangeCode,checkCode,deleteFile,uploadFile, getAllFile,getLotById} from '@/services/mlcs/myConfig' import '@/theme/style.less' import moment from "moment"; import { message } from 'ant-design-vue'; import axios from "axios"; import { MLCS } from "@/services/api"; const columns1 = [ { title: "StepName", width: "100px", dataIndex: "stepName", }, { title: "Signer", width: "100px", dataIndex: "updateUser", scopedSlots: { customRender: "creator" }, }, { title: "Action", width: "100px", dataIndex: "action", }, { title: "comment", width: "100px", dataIndex: "comment", }, { title: "Time", width: "100px", dataIndex: "updateTime", }, ]; const columns4 = [ { title: "File Name", width: "", dataIndex: "fileName", }, { title: "Delete", width: "", dataIndex: "", scopedSlots: { customRender: "delete" }, }, { title: "Download", width: "", dataIndex: "", scopedSlots: { customRender: "download" }, }, ]; const form= { caseNo:"NA", status:"Draft", applicant:"", orgDescription:"", createTime:"", caseType:1, realFabBu:"", changeStatus:0, changeCode:"", flowType:1, equipmentType:"", expectTime:"", expectUsageHours:null, purpose:"", projectCode:"", projectName:"", po:"", customerRequester:"", borrowPurpose:"", targetEquipmentId:"", executeTime:"", executeHours:"", planEquipmentId:"", realEquipmentId:"", setUpTime:"", setOffTime:"", borrowHours:"", returnToTmpgStatus:"", checkStatus:"" }; export default { name: 'process', props: { }, data() { const checkRealFabBu = (rule, value, callback) => { if (!value&&this.searchData.caseType == 1) { return callback(new Error('realFabBu is required')); }else{ return callback(); } } const checkChangeCode = (rule, value, callback) => { if (!value&&this.searchData.changeStatus == 1) { return callback(new Error('changeCode is required')); }else{ return callback(); } } const checkExpectUsageHours = (rule, value, callback) => { if (!value) { return callback(new Error('ExpectUsageHours is required')); }else if(this.searchData.expectUsageHours > 168||this.searchData.expectUsageHours <1){ return callback(new Error('number between 1-168 ')); }else{ return callback(); } } const checkExpectTime = (rule, value, callback) => { if(this.signCaseVo.jyStatus=='Applicant'){ if (!value) { return callback(new Error('ExpectTime is required')); }else if(new Date(this.searchData.expectTime) <= new Date()){ return callback(new Error('ExpectTime need after now ')); }else{ return callback(); } }else{ return callback(); } } const checkExecuteTime = (rule, value, callback) => { if(this.signCaseVo.jyStatus=='MPC'){ if (!value) { return callback(new Error('ExecuteTime is required')); }else if(new Date(this.searchData.executeTime) <= new Date()){ return callback(new Error('ExecuteTime need after now ')); }else{ return callback(); } }else{ return callback(); } } const checkExecuteHours = (rule, value, callback) => { if(this.signCaseVo.jyStatus=='MPC'){ if (!value) { return callback(new Error('executeHours is required')); }else if(this.searchData.executeHours > 168||this.searchData.executeHours <1){ return callback(new Error('number between 1-168 ')); }else{ return callback(); } }else{ return callback(); } } const checkSetUpTime = (rule, value, callback) => { if(this.signCaseVo.jyStatus=='LineSuper'){ if (!value) { return callback(new Error('SetUpTime is required')); }else if(new Date(this.searchData.setUpTime) <= new Date()){ return callback(new Error('SetUpTime need after now ')); }else{ return callback(); } }else{ return callback(); } } const checkSetOffTime = (rule, value, callback) => { if(this.signCaseVo.jyStatus=='SuperClose'){ if (!value) { return callback(new Error('SetOffTime is required')); // }else if(new Date(this.searchData.setOffTime) <= new Date()){ // return callback(new Error('SetUpTime need after now ')); }else{ return callback(); } }else{ return callback(); } } const checkBorrowHours = (rule, value, callback) => { if(this.signCaseVo.jyStatus=='SuperClose'){ if (!value) { return callback(new Error('BorrowHours is required')); }else if(this.searchData.borrowHours > 168||this.searchData.borrowHours <1){ return callback(new Error('number between 1-168 ')); }else{ return callback(); } }else{ return callback(); } } const checkCheckStatus = (rule, value, callback) => { if(this.signCaseVo.jyStatus=='SuperClose'){ if (!value) { return callback(new Error('CheckStatus is required')); }else{ return callback(); } }else{ return callback(); } } const checkReturnToTmpgStatus = (rule, value, callback) => { if(this.signCaseVo.jyStatus=='SuperClose'){ if (!value) { return callback(new Error('returnToTmpgStatus is required')); }else{ return callback(); } }else{ return callback(); } } return { moment, fabList: [""], purposeCodeList:[""], equipmentTypeList:[""], disabled: true, //是否可编辑 disabled2: false, //是否可编辑 required: true, isShow:false, isShow2:false, /********case信息 start*/ columns1, signCaseVo: { jyStatus:"", actionNames: [], comment: "", }, signOffHistory: [], signWorkOrderDTO: { //这边还是的更新form的数据 workCaseId: 0, caseNo: "", tbMlcsFormData:{}, signWorkCaseVo: { actionName: "", jyongStatus: "", comment: "", }, }, /********case信息 end*/ searchData: { fabBu:"", caseNo:"", status:"", applicant:"", orgDescription:"", createTime:"", caseType:"", realFabBu:"", changeStatus:"", changeCode:"", flowType:"", equipmentType:"", expectTime:"", expectUsageHours:null, purposeCode:"", projectCode:"", projectName:"", po:"", customerRequester:"", borrowPurpose:"", targetEquipmentId:"", executeTime:"", executeHours:"", planEquipmentId:"", realEquipmentId:"", setUpTime:"", setOffTime:"", borrowHours:"", returnToTmpgStatus:"", checkStatus:"" }, fileLists:[], checkoutValue: [], columns4, WaferIDNumber: false, indexFlag:"", isChecked: false, plainOption: [ { label: "01", value: "01", disabled: false }, { label: "02", value: "02", disabled: false }, { label: "03", value: "03", disabled: false }, { label: "04", value: "04", disabled: false }, { label: "05", value: "05", disabled: false }, { label: "06", value: "06", disabled: false }, { label: "07", value: "07", disabled: false }, { label: "08", value: "08", disabled: false }, { label: "09", value: "09", disabled: false }, { label: "10", value: "10", disabled: false }, { label: "11", value: "11", disabled: false }, { label: "12", value: "12", disabled: false }, { label: "13", value: "13", disabled: false }, { label: "14", value: "14", disabled: false }, { label: "15", value: "15", disabled: false }, { label: "16", value: "16", disabled: false }, { label: "17", value: "17", disabled: false }, { label: "18", value: "18", disabled: false }, { label: "19", value: "19", disabled: false }, { label: "20", value: "20", disabled: false }, { label: "21", value: "21", disabled: false }, { label: "22", value: "22", disabled: false }, { label: "23", value: "23", disabled: false }, { label: "24", value: "24", disabled: false }, { label: "25", value: "25", disabled: false }, ], rules: { expectUsageHours: [{ validator:checkExpectUsageHours, trigger: "change" }], borrowPurpose: [{ required: true, message: "Please Input this field ", trigger: "change" }, {max:500,message:"最大长度为500", trigger: "change" } ], realFabBu:[{validator:checkRealFabBu,trigger: "change"}], changeCode:[{validator:checkChangeCode,trigger: "change"}], expectTime:[{validator:checkExpectTime,trigger: "change"}], executeTime:[{validator:checkExecuteTime,trigger: "change"}], executeHours:[{validator:checkExecuteHours,trigger: "change"}], setUpTime:[{validator:checkSetUpTime,trigger: "change"}], setOffTime:[{validator:checkSetOffTime,trigger: "change"}], //borrowHours:[{validator:checkBorrowHours,trigger: "change"}], checkStatus:[{validator:checkCheckStatus,trigger: "change"}], returnToTmpgStatus:[{validator:checkReturnToTmpgStatus,trigger: "change"}], targetEquipmentId:[{pattern: /^[a-zA-Z0-9]+$/,message: "Please Input a-z A-Z 0-9 ", trigger: "change"}], planEquipmentId:[{pattern: /^[a-zA-Z0-9]+$/,message: "Please Input a-z A-Z 0-9 ", trigger: "change"}], realEquipmentId:[{pattern: /^[a-zA-Z0-9]+$/,message: "Please Input a-z A-Z 0-9 ", trigger: "change"}] }, } }, computed: {}, activated() { getFabList().then(res => { const data = res.data.data this.fabList=[""]; for (const i in data) { this.fabList.push(data[i]) } }); listPurposeCode(localStorage.getItem('fabName')).then(res => { const data = res.data.data this.purposeCodeList=[""]; for (const i in data) { this.purposeCodeList.push(data[i]) } }); listChangeCode(localStorage.getItem('fabName')).then(res => { const data = res.data.data this.changeCodeList=[""]; for (const i in data) { this.changeCodeList.push(data[i]) } }); listEquipmentType(localStorage.getItem('fabName')).then(res => { const data = res.data.data this.equipmentTypeList=[""]; for (const i in data) { this.equipmentTypeList.push(data[i]) } }); if (this.$route.query.id != undefined && this.$route.query.id != '') { var params = { id: this.$route.query.id } queryDetails(params).then((res) => { if (res.data.code == 0) { let data = res.data.data.signOffVo.tbMlcsFormData; this.signCaseVo = res.data.data.signOffVo.signCaseVo; this.signOffHistory = res.data.data.signOffVo.signOffHistory; this.searchData = data; this.signWorkOrderDTO.workCaseId = res.data.data.signOffVo.workCaseId; this.signWorkOrderDTO.caseNo =res.data.data.signOffVo.tbMlcsFormData.caseNo; this.fileLists=res.data.data.signOffVo.allFiles; // if (this.searchData.purposeCode.includes('Customer borrow')) { // this.isShow=true; // }else{ // this.isShow=false; // } if (this.searchData.purposeCode.includes('Customer borrow')&&this.searchData.purposeCode.includes('(TSD)')) { this.isShow=true; this.isShow2=true; }else if(this.searchData.purposeCode.includes('Customer borrow')&&this.searchData.purposeCode.includes('(TD2)')) { this.isShow=true; this.isShow2=true; }else if(this.searchData.purposeCode.includes('Other borrow')&&this.searchData.purposeCode.includes('(TD2)')) { this.isShow=false; this.isShow2=true; }else if(this.searchData.purposeCode.includes('Customer borrow')){ this.isShow=true; this.isShow2=false; }else if(this.searchData.purposeCode.includes('(TSD)')){ this.isShow=false; this.isShow2=true; }else{ this.isShow=false; this.isShow2=false; } if(!this.searchData.planEquipmentId){ this.searchData.planEquipmentId=this.searchData.targetEquipmentId; } } }); } }, created() {}, beforeDestroy() {}, methods: { actionChange(e) { if (e.includes('Customer borrow')&&e.includes('(TSD)')) { this.isShow=true; this.isShow2=true; }else if(e.includes('(TD2)')&&e.includes('Customer borrow')){ this.isShow=true; this.isShow2=true; }else if(e.includes('(TD2)')&&e.includes('Other borrow')){ this.isShow=true; this.isShow2=true; }else if(e.includes('Customer borrow')){ this.isShow=true; this.isShow2=false; }else if(e.includes('(TSD)')){ this.isShow=false; this.isShow2=true; }else{ this.isShow=false; this.isShow2=false; } }, changeStatusChange(){ if(this.searchData.changeStatus==0){ this.searchData.changeCode=""; } }, caseTypeChange(){ if(this.searchData.caseType==0){ this.searchData.realFabBu=""; } }, changeSetOffTime(){ var dateBegin = new Date(this.searchData.setUpTime); var dateEnd = new Date(this.searchData.setOffTime); var dateDiff = dateEnd.getTime() - dateBegin.getTime(); //时间差的毫秒数 var hours = (dateDiff / (1000 * 60 * 60)).toFixed(2); //计算出小时数 this.searchData.borrowHours=hours; }, toAddressBook(item) { let name=item.substring(0,7); window.open( `http://mysjsemi/extend/addressBookMain.do?method=findLike&retrievalValue=${name}` ); }, signOff: function (ev) { const that = this; this.signWorkOrderDTO.signWorkCaseVo.actionName =ev.target.dataset["type"]; this.signWorkOrderDTO.signWorkCaseVo.jyongStatus =this.signCaseVo.jyStatus; this.signWorkOrderDTO.signWorkCaseVo.comment = this.signCaseVo.comment; this.signWorkOrderDTO.tbMlcsFormData=this.searchData; let signWorkOrderDTO = this.signWorkOrderDTO; if(this.signWorkOrderDTO.signWorkCaseVo.actionName!='reject'){ this.$refs["formRef"].validate((valid) => { if (valid) { this.$confirm({ title: "确认提交吗？", okText: "是", cancelText: "否", onOk: function () { signOffOrder(signWorkOrderDTO).then((res) => { if (res.data.code == 0) { that.$message.success("已提交"); that.$closePage("/detail"); that.$router.push("/todo"); } }); }, }); } else { return false; } }); }else{ this.$confirm({ title: "确认reject吗？", okText: "是", cancelText: "否", onOk: function () { signOffOrder(signWorkOrderDTO).then((res) => { if (res.data.code == 0) { that.$message.success("已提交"); that.$closePage("/detail"); that.$router.push("/todo"); } }); }, }); } // this.$confirm({ // title: "确认签核吗？", // okText: "是", // cancelText: "否", // onOk: function () { // signOffOrder(signWorkOrderDTO).then((res) => { // if (res.data.code == 0) { // that.$message.success("已提交"); // that.$closePage("/detail"); // that.$router.push("/todo"); // } // }); // }, // }); }, checkCode() { this.searchData.projectName=""; checkCode({projectCode:this.searchData.projectCode}).then((res) => { if (res.data.code == 0) { if(!res.data.data.caseDto){ this.$message.warning("找不到对应子项目,请检查并更新子code后，重新提交"); }else{ if(!res.data.data.caseDto.projectName){ this.searchData.projectName="已通过校验，但是项目名为空" }else{ this.searchData.projectName=res.data.data.caseDto.projectName } this.disabled2=true } } }); }, resetCode() { this.searchData.projectCode="" this.searchData.projectName="" this.disabled2=false }, handleTableChange(pagination) { // this.pagination = pagination; // this.getPage(); }, // 删除文件 deleteList(file) { let that = this; that.$confirm({ title: "Are you sure to delete this data?", okText: "YES", okType: "danger", cancelText: "NO", onOk() { deleteFile(file.id).then((res) => { if (res.data.code == 0) { message.success('Delete succeeded'); that.getAllFile(file.mlcsId); } }) }, onCancel() { }, }); }, // 下载文件 downloadList(file) { let that = this; that.$confirm({ title: "Are you sure to Download this data?", okText: "YES", okType: "danger", cancelText: "NO", onOk() { axios({ url: `${MLCS}/file/download/${file.id}`, method: "get", responseType: "blob", }).then((res) => { const url = window.URL.createObjectURL(new Blob([res.data])); const link = document.createElement('a'); link.href = url; const contentDisposition = res.headers["content-disposition"]; const fileName = decodeURI( contentDisposition.split("fileName=")[1] || contentDisposition.split("filename=")[1] ); link.setAttribute('download', fileName); document.body.appendChild(link); link.click(); link.parentNode.removeChild(link); window.URL.revokeObjectURL(url); }); }, onCancel() { }, }); }, // 上传之前 beforeUpload2(file) { const form = new FormData() form.append("file", file) form.append("mlcsId", this.searchData.id) uploadFile(form).then((res) => { if (res.data.code == 0) { message.success('Upload succeeded'); this.getAllFile(this.searchData.id); } }) return false; }, getAllFile(mlcsId) { getAllFile(mlcsId).then((res) => { this.fileLists = res.data.data }) }, addLotList(addLotList) { addLotList.push({lotId: '', vendorId: '',waferId: ''}) }, deleteItem(addLotList, index) { if(addLotList.length>1){ addLotList.splice(index, 1); } else { this.$message.warning("至少保留一组Lot！") } }, cliWaferID(index) { if(this.searchData.lotList[index].lotId&&this.searchData.lotList[index].lotId !='NA'){ let params = new FormData(); params.append("lotId", this.searchData.lotList[index].lotId); getLotById(params).then((res) => { if (res.data.code == 0) { var i=0; //this.searchData.lotList[index].waferId = res.data.data.waferId; if (res.data.data.waferId != null) { let list = res.data.data.waferId.split("#"); this.plainOption.forEach((item) => { if (list.indexOf(item.label) == "-1") { item.disabled = true; }else{ item.disabled = false; i++; } }); //this.searchData.lotList[index].waferId = null; } this.indexFlag=index; if(i==(this.searchData.lotList[index].waferId? this.searchData.lotList[index].waferId.split(",").length : [].length)){ this.isChecked=true; }else{ this.isChecked=false; } this.WaferIDNumber = true; this.checkoutValue = this.searchData.lotList[index].waferId ? this.searchData.lotList[index].waferId.split(",") : []; } }); } // if(this.indexFlag==index){ // this.WaferIDNumber = true; // this.checkoutValue = this.searchData.lotList[index].waferId // ? this.searchData.lotList[index].waferId.split(",") : []; // }else{ // lotBlur(this.searchData.lotList[index].lotId,index); // this.indexFlag=index; // this.WaferIDNumber = true; // this.checkoutValue = this.searchData.lotList[index].waferId // ? this.searchData.lotList[index].waferId.split(",") : []; // } }, isOk() { console.log(this.checkoutValue); this.WaferIDNumber = false; //this.lotList.waferId = this.checkoutValue.toString(); console.log("111111"+this.indexFlag); this.searchData.lotList[this.indexFlag].waferId= this.checkoutValue.toString(); }, isCancel() { this.WaferIDNumber = false; }, lotBlur(e,index) { const counts = {}; let flag=true; this.searchData.lotList.forEach(lot => { if (counts[lot.lotId]&&lot.lotId==e) { this.searchData.lotList[index].lotId =""; this.searchData.lotList[index].waferId = ""; this.searchData.lotList[index].vendorId = ""; flag=false; this.$message.warning("LotID不可重复"); } else { counts[lot.lotId] = 1; } }); if (e&&flag) { this.searchData.lotList[index].lotId = ""; this.searchData.lotList[index].waferId = ""; this.searchData.lotList[index].vendorId = ""; if(e=="NA"){ this.searchData.lotList[index].vendorId ="NA"; return } this.$warning({ title: `System will get LotId：${e} data from MES`, okText: "ok", onOk: () => { let params = new FormData(); params.append("lotId", e); //params.append("system", "CP"); getLotById(params).then((res) => { if (res.data.code == 0) { this.searchData.lotList[index].lotId = res.data.data.lotId; this.searchData.lotList[index].vendorId = res.data.data.vendorId; this.searchData.lotList[index].waferId = res.data.data.waferId; if (res.data.data.waferId != null) { let list = res.data.data.waferId.split("#"); this.plainOption.forEach((item) => { if (list.indexOf(item.label) == "-1") { item.disabled = true; }else{ item.disabled = false; } }); this.searchData.lotList[index].waferId = ""; } } }); }, }); } }, checkboxAll(e) { this.checkoutValue = []; if (e.target.checked) { this.plainOption.forEach((item) => { if (item.disabled == false) { this.checkoutValue.push(item.label); } }); } else { this.checkoutValue = []; } }, } } </script> <style scoped lang="less"> // /deep/ .ant-form-item label { // white-space: normal; // } /deep/ .ant-form-item { color: #000000; // border: 1px solid #fff; // border-left: 0px; } /deep/ .langName .ant-form-item-label { line-height: 18px; white-space: normal; } /deep/ .ant-form-item { border: 1px solid #fff; border-left: 0px; } /deep/ .ant-checkbox-group-item { margin-right: 10px; width: 10%; color: black; font-weight: 500; } .redColorTable { color: red; } </style>
最新发布
09-26
- 使用 `axios` 下载文件（Blob 处理） - 支持文件删除、下载、列表展示 --- ### 5. Wafer ID 多选弹窗 - 使用 `a-modal` + `a-checkbox-group` 实现多选 - 根据 Lot ID 查询 wafer ID 列表 - 支持全选、取消全选...
golang: sqlite sql语句 操作插入字节数组([]byte)到BLOB字段类型
听我一言的博客
12-04 2594
下列代码中较为特别的转换就是将字节数组写入到数据库中 fmt.Sprintf("X'%x'", t) 注意插入的时候使用占位符x, 再有一个标志X func toInsertSQL(dat map[string]interface{}) string { if nil == dat { return "" } var sql = "INSERT INTO " + tableName var keyStr, valueStr = "(", "(" var index = 0 var .
BLOB数据类型文件[PDF]的存取(Spring+Mybatis+Db2+Maven)
匠心1990
12-10 3674
本文的业务需求是将一个html文件以BLOB数据类型存入DB2数据库中，并将其取出存入一个简单的pdf文件中。才疏学浅，大神勿喷！ 1、准备数据库DDL，并展示工程结构。 CREATE TABLE BLOB_FIELD ("ID" VARCHAR(64) NOT NULL, "TAB_NAME" VARCHAR(64)
C++代码库cppsqlite3使用技巧
YMWM_的博客
06-06 2924
C++代码库cppsqlite3使用技巧
golang保存图片到数据库
benben的博客
02-02 9037
图片保存到数据库通常有两种做法：一是把图片转化成二进制形式，然后保存到数据库中；二是将图片保存的路径存储在数据库中。 由于图片一般都在几M，所以当以二进制流的形式保存到数据库中时，在高并发的情况下，会加重数据库的负担。（至于更详细的原因，后期文章会做分享）因此大多数会选择第二种做法。下面就是以第二种方式进行图片保存的。 uploadImg.go package main import
golang mysql blob_往MySQL中存储图片 longBlob类型-Go语言中文社区
weixin_39517546的博客
01-27 1366
往MySQL中存储图片1 介绍在设计到数据库的开发中，难免要将图片或音频文件插入到数据库中的情况。一般来说，我们可以同过插入图片文件相应的存储位置，而不是文件本身，来避免直接向数据库里插入的麻烦。但有些时候，向MySQL中插入图片更加容易管理。那么在MySQL中该怎么存储呢？参考资料[1]中有个相当清晰的例子，不过是基于MySQL图形界面的查询工具Query Brower的，你的机子上没有安装的话...
深入浅析mybatis oracle BLOB类型字段保存与读取
陌子曦的专栏
01-05 8231
一、BLOB字段 　　BLOB是指二进制大对象也就是英文Binary Large Object的所写，而CLOB是指大字符对象也就是英文Character Large Object的所写。其中BLOB是用来存储大量二进制数据的；CLOB用来存储大量文本数据。BLOB通常用来保存图片、文件等二进制类型的数据。 二、使用mybatis操作blob 　　1、表结构如下： create tab
java输出流转blob_请问如何将字节流转换为Blob？（100）
weixin_42300040的博客
02-27 2766
一般是往数据表中存放图象或字符文件。|if(conn==null)thrownewSQLException("databaseconnectionisnotavailble!");StringstrSQLUpdate="updatedemosetblobTest=EMPTY_BLOB()whereid=1";StringstrSQL="selectblob...
java查询blob字段出错_java获取oracle数据库blob图片字节流显示到jsp页面出错bogus marker length...
weixin_36185593的博客
02-26 618
最近在做项目时需要从oracle读取blob图片列表，显示到jsp页面上。使用以下代码实现，大部分图片显示正常，但是有些图片执行BufferedImagebis = ImageIO.read(is);会报错。求高手指教，这个问题该怎么解决？报错信息如下：javax.imageio.IIOException: bogus marker length主要代码如下：ps = con.prepareSta...
MySQL存储图片：使用BLOB类型字段
在实际应用中，为了提高性能和减少磁盘空间占用，有时会将图片存储在文件系统中，只在数据库中存储图片的路径或URL。然而，这种方法可能会带来文件管理和权限控制的复杂性。在选择存储方式时，需要权衡性能、安全性...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值