diff --git a/src/components/DesignForm/app/index.vue b/src/components/DesignForm/app/index.vue index 8f8f378..507bf98 100644 --- a/src/components/DesignForm/app/index.vue +++ b/src/components/DesignForm/app/index.vue @@ -27,7 +27,10 @@ import { checkboxUnit, orgDeptUnit, } from "@/api/DesignForm/fieldUnit"; -import type { FormInstance, FormRules, ElNotification } from "element-plus"; +import type { FormInstance, FormRules } from "element-plus"; +import { ElLoading,ElMessage,ElNotification } from 'element-plus' +import html2canvas from 'html2canvas'; +import JSZip, { forEach } from 'jszip'; import { gainFormPageListCont } from "@/api/DesignForm/requestapi"; import { Picture, InfoFilled, QuestionFilled } from "@element-plus/icons-vue"; import request from "@/utils/request"; @@ -69,6 +72,8 @@ const props = withDefaults( pickAppMenu?: any; versiontitle?: string; viewPage?: viewPageType; + formBasicConfig?: any; + fieldsDetailList?:any; }>(), { showPage: true, @@ -108,6 +113,12 @@ const props = withDefaults( viewPage: () => { return []; }, + formBasicConfig: () => { + return {}; + }, + fieldsDetailList: () => { + return {}; + }, } ); const emits = defineEmits<{ @@ -214,6 +225,235 @@ const resetFields = (formEl: FormInstance | undefined) => { }); } }; + + +//20250117 李文轩 二维码表格 +const qrCodesPrintDialogFlag = ref(false) +let tableRefs = reactive({}); +const tablesData = ref({}) +function getDetailQrCodes(val:any) { + return request({ + url: "/javasys/lowCode/QrCode/getDetailQrCodes", + method: "post", + data: { + cfid: props.formId, + idArray:val, + settings:props.formBasicConfig, + }, + }); +} + +function modifyFieldsMap4(fieldsMap: any): Array<{ key: string, value: string }> { + let result: Array<{ key: string, value: string }> = []; + // 使用 Object.entries 获取键值对数组，保留原始顺序 + for (const [key, value] of Object.entries(fieldsMap)) { + let parts = value.split("!@#@!"); + if (parts.length === 2) { + result.push({ key: parts[0], value: parts[1] }); + } else { + // 如果格式不符合，可进行错误处理，这里暂时不做处理，直接使用原属性名和属性值 + result.push({ key, value }); + } + } + return result; +} + +// 定义两个响应式的布尔值来控制按钮的禁用状态 +const isButton1Disabled = ref(false); +const isButton2Disabled = ref(false); + +async function downloadTables() { + isButton1Disabled.value = true; + isButton2Disabled.value = true; + const loadingInstance = ElLoading.service({ + fullscreen: true, + text: '正在生成图片，请稍候...' // 添加的文字内容，可根据需要修改 + }); + //ElMessage('This is a message.') + const zip = new JSZip(); + //console.log(tableRefs) + for (const [tableKey, element] of Object.entries(tableRefs)) { + try { + const canvas = await html2canvas(element); + const dataUrl = canvas.toDataURL('image/png'); + const byteString = atob(dataUrl.split(',')[1]); + const mimeString = dataUrl.split(',')[0].split(':')[1].split(';')[0]; + const ab = new ArrayBuffer(byteString.length); + const ia = new Uint8Array(ab); + + for (let i = 0; i < byteString.length; i++) { + ia[i] = byteString.charCodeAt(i); + } + + const blob = new Blob([ab], { type: mimeString }); + zip.file(`${props.formBasicConfig.formName}-${tableKey}.png`, blob); + } catch (error) { + console.error(`Error converting ${tableKey} to image:`, error); + } + } + + zip.generateAsync({ type: 'blob' }).then(function(content) { + const now = new Date(); + const formattedDate = `${now.getFullYear()}${String(now.getMonth() + 1).padStart(2, '0')}${String(now.getDate()).padStart(2, '0')}_${String(now.getHours()).padStart(2, '0')}${String(now.getMinutes()).padStart(2, '0')}${String(now.getSeconds()).padStart(2, '0')}`; + const fileName = `${props.formBasicConfig.formName}-${formattedDate}.zip`; + + const link = document.createElement('a'); + link.href = URL.createObjectURL(content); + link.download = fileName; + loadingInstance.close() + link.click(); + tableRefs = {} + // 不管成功与否，最后都要恢复按钮的状态 + isButton1Disabled.value = false; + isButton2Disabled.value = false; + }); +} +function closeQrDownload(){ + qrCodesPrintDialogFlag.value = false + tableRefs = {} + //console.log(tableRefs) + +} + +let asfs: any[] = []; +let radios: any[] = []; +let checkboxs: any[] = []; +let switchs: any[] = []; +let selects: any[] = []; +let tables: any[] = []; +function getAsfs() { + //setTimeout(() => { + let dataList = ref({}); + dataList.value = props.fieldsDetailList + if (dataList && Array.isArray(dataList.value) && dataList.value.length > 0) { + for (let i = 0; i < dataList.value.length; i++) { + if (dataList.value[i].type == "associatedForms") { + asfs.push(dataList.value[i]); + }else if(dataList.value[i].type == "radio"){ + radios.push(dataList.value[i]) + } else if(dataList.value[i].type == "checkbox"){ + checkboxs.push(dataList.value[i]) + } else if(dataList.value[i].type == "switch"){ + switchs.push(dataList.value[i]) + } else if(dataList.value[i].type == "select"){ + selects.push(dataList.value[i]) + } else if ( + dataList.value[i].type == "card" || + dataList.value[i].type == "flex" || + dataList.value[i].type == "div" || + dataList.value[i].type == "table" + ) { + if (dataList.value[i].type == "table") { + tables.push(dataList.value[i]); + } + + dataList.value[i].list.forEach((element: any) => { + if (element.type == "associatedForms") { + asfs.push(element); + }else if(element.type == "radio"){ + radios.push(element) + }else if(element.type == "checkbox"){ + checkboxs.push(element) + }else if(element.type == "switch"){ + switchs.push(element) + }else if(element.type == "select"){ + selects.push(element) + } + }); + } else if (dataList.value[i].type == "grid") { + let columns = JSON.parse(JSON.stringify(dataList.value[i].columns)); + + if (columns.length > 0) { + for (let z = 0; z < columns.length; z++) { + for (let x = 0; x < columns[z].list.length; x++) { + let a = JSON.parse(JSON.stringify(columns[z].list[x])); + + if (a.type == "associatedForms") { + asfs.push(a); + }else if(a.type == "radio"){ + radios.push(a) + }else if(a.type == "checkbox"){ + checkboxs.push(a) + }else if(a.type == "switch"){ + switchs.push(a) + }else if(a.type == "select"){ + selects.push(a) + } + } + } + } + } else if (dataList.value[i].type == "tabs") { + //tabs标签页有可能再嵌套一层flex或者table + let columns = JSON.parse(JSON.stringify(dataList.value[i].columns)); + if (columns.length > 0) { + for (let z = 0; z < columns.length; z++) { + for (let x = 0; x < columns[z].list.length; x++) { + let a = JSON.parse(JSON.stringify(columns[z].list[x])); + + if (a.type == "associatedForms") { + asfs.push(a); + }else if(a.type == "radio"){ + radios.push(a) + }else if(a.type == "checkbox"){ + checkboxs.push(a) + }else if(a.type == "switch"){ + switchs.push(a) + }else if(a.type == "select"){ + selects.push(a) + }else if (a.type == "flex" || a.type == "table") { + if (a.type == "table") { + tables.push(dataList.value[i]); + } + + if (a.list.length > 0) { + for (let m = 0; m < a.list.length; m++) { + let q = JSON.parse(JSON.stringify(a.list[m])); + + if (q.type == "associatedForms") { + asfs.push(q); + }else if(q.type == "radio"){ + radios.push(q) + }else if(q.type == "checkbox"){ + checkboxs.push(q) + }else if(q.type == "switch"){ + switchs.push(q) + }else if(q.type == "select"){ + selects.push(q) + } + } + } + } + } + } + } + } + } + } + //}, 500); +} + + +function convertStringToArray(str: string) { + if (typeof str!== 'string') { + throw new Error('Input must be a string.'); + } + if (str === '') { + return []; + } + // 去除首尾的中括号 + str = str.slice(1, -1); + if (str === '') { + return []; + } + let parts = str.split(','); + return parts.map(part => parseFloat(part)); +} + + +//liwenxuan 20250120 二维码 end + + + /** @ 作者: 秦东 @ 时间: 2024-04-01 11:36:07 @@ -226,8 +466,192 @@ const setUpClick = (val: string, id: string) => { drawerWith.value = container.value?.clientWidth; openTaskDrawer.value = true; } else if(val.key == "showQrCode"){ - //alert(val) - console.log(idList) + + + //liwenxuan 20250114 二维码打印弹窗 start + //在此组装参数,以生成二维码图片 + let idArray = state.selectionChecked.map(item => item.id); + if(idArray.length>0){ + const loadingInstance1 = ElLoading.service({ + fullscreen: true, + text: '正在生成二维码，请稍候...' // 添加的文字内容，可根据需要修改 + }); + //console.log(props.formBasicConfig) + //请求数据 + let getDetailQrCodesData: any = {} + let currentFieldsMapArrObj: any = {} + getDetailQrCodes(idArray).then(({ data }) => { + getDetailQrCodesData = JSON.parse(JSON.stringify(data)); + if(props.formBasicConfig.qrCodePrintStyle&&props.formBasicConfig.qrCodePrintStyle=="2"){ + let asfQueryParams1: any[] = []; + for (let key in getDetailQrCodesData) { + currentFieldsMapArrObj[key] = getDetailQrCodesData[key] + if (getDetailQrCodesData.hasOwnProperty(key)) { + let currentFieldsMap = getDetailQrCodesData[key].fieldsMap + //console.log(currentFieldsMap) + // 遍历对象的属性 + for (let attr_name in currentFieldsMap) { + if (currentFieldsMap.hasOwnProperty(attr_name)) { + //console.log("attr_name------"+attr_name) + //console.log(`属性名: ${attr_name}, 属性值: ${currentFieldsMap[attr_name]}`); + radios.forEach(function(element) { + if(attr_name==element.name){ + //表格属性中存在此单选,将其value根据options替换为可读值 + let toConvertValue = currentFieldsMap[attr_name].split("!@#@!")[1] + let optionsHasCurrentValue = false + element.options.forEach((element1: any) => { + if(toConvertValue==element1.value){ + currentFieldsMap[attr_name] = currentFieldsMap[attr_name].split("!@#@!")[0]+"!@#@!"+element1.label + optionsHasCurrentValue = true + } + }); + if(optionsHasCurrentValue==false){ + currentFieldsMap[attr_name] = currentFieldsMap[attr_name].split("!@#@!")[0]+"!@#@!"+"" + } + } + }); + selects.forEach(function(element) { + if(attr_name==element.name){ + //表格属性中存在此单选,将其value根据options替换为可读值 + let toConvertValue = currentFieldsMap[attr_name].split("!@#@!")[1] + let optionsHasCurrentValue = false + element.options.forEach((element1: any) => { + if(toConvertValue==element1.value){ + currentFieldsMap[attr_name] = currentFieldsMap[attr_name].split("!@#@!")[0]+"!@#@!"+element1.label + optionsHasCurrentValue = true + } + }); + if(optionsHasCurrentValue==false){ + currentFieldsMap[attr_name] = currentFieldsMap[attr_name].split("!@#@!")[0]+"!@#@!"+"" + } + } + }); + switchs.forEach(function(element) { + if(attr_name==element.name){ + //表格属性中存在此单选,将其value根据options替换为可读值 + let toConvertValue = currentFieldsMap[attr_name].split("!@#@!")[1] + if(toConvertValue=="0"){ + currentFieldsMap[attr_name] = currentFieldsMap[attr_name].split("!@#@!")[0]+"!@#@!"+"禁用" + }else{ + currentFieldsMap[attr_name] = currentFieldsMap[attr_name].split("!@#@!")[0]+"!@#@!"+"启用" + } + } + }); + checkboxs.forEach(function(element) { + if(attr_name==element.name){ + //表格属性中存在此单选,将其value根据options替换为可读值 + let toConvertValue = currentFieldsMap[attr_name].split("!@#@!")[1] + let toConvertArr = convertStringToArray(toConvertValue); + let toAddStr = "" + if(toConvertArr.length>0){ + toConvertArr.forEach((element1: any) => { + element.options.forEach((element2: any) => { + if(element1==element2.value){ + toAddStr = toAddStr+element2.label+"," + } + }); + }); + toAddStr = toAddStr.slice(0, -1) + currentFieldsMap[attr_name] = currentFieldsMap[attr_name].split("!@#@!")[0]+"!@#@!"+toAddStr + } + } + }); + asfs.forEach(function(element) { + if(attr_name==element.name){ + //表格属性中存在此关联表单,将其value根据options替换为可读值 + let toConvertValue = currentFieldsMap[attr_name].split("!@#@!")[1] + if(toConvertValue.length>0){ + //console.log(element) + let fieldCount = 0;//如果>0则有此field名 + asfQueryParams1.forEach((item1: any) => { + //如果参数数组中已存在同field的 关联表单asfQueryParamsItem1,则往已存在的如果参数数组中已存在同field的关联表单asfQueryParamsItem1.asfToSelectIds1中新增asfMasterAndAsfId1 + // 不存在则push一个新的关联表单asfQueryParamsItem1 + if(item1.field==element.name){ + fieldCount++ + } + }); + if(fieldCount>0){ + //已存在 + //得到已存在的相关field参数对象 + asfQueryParams1.forEach((item1: any) => { + if(item1.field==element.name){ + let asfMasterAndAsfId1: any = {}; + asfMasterAndAsfId1.asfId = toConvertValue+""; + asfMasterAndAsfId1.asfMasterId = key+""; + item1.asfToSelectIds.push(asfMasterAndAsfId1) + } + }); + }else{ + //不存在 + let asfQueryParamsItem1: any = {}; + asfQueryParamsItem1.formId = element.control.formid; + asfQueryParamsItem1.field = element.name; + let asfToSelectIds1: any[] = []; + asfQueryParamsItem1.asfToSelectIds = asfToSelectIds1; + let asfMasterAndAsfId1: any = {}; + asfMasterAndAsfId1.asfId = toConvertValue+""; + asfMasterAndAsfId1.asfMasterId = key+""; + asfToSelectIds1.push(asfMasterAndAsfId1) + asfQueryParams1.push(asfQueryParamsItem1) + } + } + } + }) + } + } + setTimeout(()=>{ + getDetailQrCodesData[key].fieldsMap = modifyFieldsMap4(currentFieldsMap) + },800) + } + } + + getAsfDataTitlesByIds(asfQueryParams1).then(({ data }) => { + let getAsfDataTitlesByIdsData = JSON.parse(JSON.stringify(data)); + for (let key in currentFieldsMapArrObj) { + if (getDetailQrCodesData.hasOwnProperty(key)) { + let currentFieldsMap = getDetailQrCodesData[key].fieldsMap + getAsfDataTitlesByIdsData.forEach((element1: any) => { + element1.list.forEach((element2: any) => { + if(key==element2.asfMasterId){ + currentFieldsMap[element1.field] = currentFieldsMap[element1.field].split("!@#@!")[0]+"!@#@!"+element2.label + } + }) + }) + } + } + }) + + + + setTimeout(()=>{ + tablesData.value = getDetailQrCodesData + },810) + + + + setTimeout(()=>{ + loadingInstance1.close() + qrCodesPrintDialogFlag.value = true + },820) + + }else if(props.formBasicConfig.qrCodePrintStyle&&props.formBasicConfig.qrCodePrintStyle=="1"){ + //fieldsMap = null + tablesData.value = getDetailQrCodesData + qrCodesPrintDialogFlag.value = true + loadingInstance1.close() + } + + })/* .finally(()=>{ + loadingInstance1.close() + qrCodesPrintDialogFlag.value = true + }) */ + }else{ + alert("未选中任何一条,请先选择") + + } + //liwenxuan 20250114 二维码打印弹窗 end + + }else { if (idList.value.length > 0) { ElMessageBox.confirm("确认删除此数据项?删除后不可恢复！", "警告", { @@ -459,6 +883,13 @@ const getPageData = () => { }) .finally(() => { state.loading = false; + asfs = []; + radios = []; + checkboxs = []; + switchs = []; + selects = []; + tables = []; + getAsfs() }); } }; @@ -623,6 +1054,7 @@ onMounted(() => { nextTick(() => { drawerWith.value = container.value?.clientWidth; }); + getAsfs() }); /** @ 作者: 秦东 @@ -1499,6 +1931,65 @@ const transformOption = (val: string | number, type?: string) => { @searchquery="getListData" /> + + +
+
+ + + + + + + + + +
{{ tablesData[tableKey].appName }}-{{ tablesData[tableKey].formName }}二维码
{{ item.key }}{{ item.value }}
+
+
+
+
+ + + + + + + +
{{ tablesData[tableKey].appName }}-{{ tablesData[tableKey].formName }}-{{ tablesData[tableKey].dataTitle }}
二维码
+
+
+ + + diff --git a/src/components/DesignForm/tableListPage/index.vue b/src/components/DesignForm/tableListPage/index.vue index 28eda11..c734382 100644 --- a/src/components/DesignForm/tableListPage/index.vue +++ b/src/components/DesignForm/tableListPage/index.vue @@ -27,13 +27,13 @@ import { checkboxUnit, orgDeptUnit, } from "@/api/DesignForm/fieldUnit"; -import type { FormInstance, FormRules, ElNotification } from "element-plus"; +import type { FormInstance, FormRules } from "element-plus"; import { gainFormPageListCont } from "@/api/DesignForm/requestapi"; import { Picture, InfoFilled, QuestionFilled } from "@element-plus/icons-vue"; import request from "@/utils/request"; import html2canvas from 'html2canvas'; import JSZip, { forEach } from 'jszip'; -import { ElLoading,ElMessage } from 'element-plus' +import { ElLoading,ElMessage,ElNotification } from 'element-plus' import { softDeletion, retractRunWorkFlow } from "@/api/taskapi/management"; import { formatNumber } from "@/api/DesignForm/utils"; diff --git a/src/views/sysworkflow/lowcodepage/runApp/runAppForm.vue b/src/views/sysworkflow/lowcodepage/runApp/runAppForm.vue index fbd8540..e630a35 100644 --- a/src/views/sysworkflow/lowcodepage/runApp/runAppForm.vue +++ b/src/views/sysworkflow/lowcodepage/runApp/runAppForm.vue @@ -355,6 +355,8 @@ function optionsValue3Get3(data: any, fieldName: string) { :sign-code="appInitData.signCode" :pickAppMenu="props.pickAppMenu" :viewPage="stateList.view" + :form-basic-config="stateForm.formData.form" + :fields-detail-list="stateForm.formData.list" />