code

src/App.vue

@@ -9,9 +9,9 @@ import TheWelcome from './components/TheWelcome.vue'
 			<div class="menu" editor-component="menu">
 				<el-button size="small" @click="getHTMLValuea">保存配置</el-button>
 				<el-button size="small" @click="savePdf">保存pdf并上传</el-button>
-				<el-button size="small" @click="confShow = !confShow">隐藏配置</el-button>
+				<el-button size="small" @click="confShow = !confShow">显示/隐藏</el-button>
-				<el-button size="small" @click="getShow">预览</el-button>
+				<el-button size="small" @click="getShow">预览/配置</el-button>
-				<el-button size="small" @click="changeConfig">切换配置</el-button>
+				<!-- <el-button size="small" @click="changeConfig">切换配置</el-button> -->
 				<!-- <el-button @click="getHTMLValue">保存样式</el-button> -->
 				<div class="menu-item">
 					<div class="menu-item__undo" @click="executeUndo">
@@ -378,7 +378,8 @@ import TheWelcome from './components/TheWelcome.vue'
 					<div class="page-scale-minus" title="缩小(Ctrl+-)" @click="executePageScaleMinus">
 						<i></i>
 					</div>
-					<span class="page-scale-percentage" title="显示比例(点击可复原Ctrl+0)" @click="executePageScaleRecovery">100%</span>
+					<span class="page-scale-percentage" title="显示比例(点击可复原Ctrl+0)"
+						@click="executePageScaleRecovery">100%</span>
 					<div class="page-scale-add" title="放大(Ctrl+=)" @click="executePageScaleAdd">
 						<i></i>
 					</div>
@@ -403,7 +404,8 @@ import TheWelcome from './components/TheWelcome.vue'
 						<i title="纸张方向"></i>
 						<div class="options">
 							<ul>
-								<li data-paper-direction="vertical" class="active" @click="executePaperDirection">纵向</li>
+								<li data-paper-direction="vertical" class="active" @click="executePaperDirection">纵向
+								</li>
 								<li data-paper-direction="horizontal" @click="executePaperDirection">横向</li>
 							</ul>
 						</div>
@@ -428,7 +430,6 @@ import TheWelcome from './components/TheWelcome.vue'
 								<el-form-item :label="field[key]" style="margin-bottom: 0;">
 									<el-input @input="isUpdate" v-model="item[key]" size="small"></el-input>
 								</el-form-item>
-
 							</div>
 						</div>
 						<hr>
@@ -465,8 +466,10 @@ import TheWelcome from './components/TheWelcome.vue'
 						单击即复制成功
 					</el-form-item>
 					<div v-for="(value, key, index) in searchField">
-						<el-form-item :label="searchField[key]" @click="copy(searchField[key])" style="margin-bottom: 0;">
+						<el-form-item :label="searchField[key]" @click="copy(searchField[key])"
-							<span @click.stop="copy('{' + searchField[key] + '}')">{{ '{' + searchField[key] + '}' }}</span>
+							style="margin-bottom: 0;">
+							<span @click.stop="copy('{' + searchField[key] + '}')">{{ '{' + searchField[key] + '}'
+								}}</span>
 						</el-form-item>
 					</div>
 				</el-form>
@@ -512,7 +515,7 @@ export default {
 			field: {},
 			nameField: {},
 			saveData: {},
-			updateStatus: false,
+			updateStatus: true,
 			showObj: {},
 			config: {},
 			tableHeight: 42,
@@ -524,7 +527,8 @@ export default {
 			doc: {},
 			myDiv: null,
 			orderType: 0,
-			modeIndex:0
+			modeIndex: 0,
+			id: 0
 		}
 	},
 	mounted() {
@@ -555,13 +559,13 @@ export default {
 			}
 			pdf.addImage(imgData, 'PNG', x, y, options.width, options.height)
 			// 保存生成的PDF
-			pdf.save(pdfName + '.pdf')
 			const blob = pdf.output("blob")
-			this.uoloadFile(blob)
+			this.uploadFile(blob)
+			pdf.save(pdfName + '.pdf')
 		},
-		uoloadFile(blob) {
+		uploadFile(blob) {
 			const formData = new FormData()
-			formData.append('file', blob, 'myPDF.pdf')
+			//formData.append('file', blob, 'myPDF.pdf')
 			let api = '/api/Administrator/file/upload'
 			formData.append('files', blob, 'myPDF.pdf');
 
@@ -604,7 +608,6 @@ export default {
 			console.log(value);
 		},
 		getShow() {
-			this.updateStatus = true
 			this.init()
 		},
 		isUpdate() {
@@ -671,8 +674,13 @@ export default {
 				for (let k = 0; k < orderList.length; k++) {
 					const element = orderList[k]
 					let item = { 'proid': element['pid'], 'prolistid': element['plid'] }
-					proIdData.push(item)
+					//proIdData.push(item)
+					this.getGongXu(item, k)
 				}
+				/* for (let l = 0; l < proIdData.length; l++) {
+					const element = proIdData[l];
+					this.getGongXu(element, l)					
+				}*/
 				this.searchList = data.data.searchExt
 				let order_id = data.data.searchExt['order_id']
 				this.orderType = data.data.searchExt['order_type_id']
@@ -695,10 +703,7 @@ export default {
 					this.searchNameField = searchNameField
 					this.searchField = searchField
 				}
-				for (let l = 0; l < proIdData.length; l++) {
+
-					const element = proIdData[l];
-					this.getGongXu(element, l)					
-				}
 				this.init()
 			}))
 		},
@@ -714,10 +719,19 @@ export default {
 			this.nameField = Object.assign({}, this.nameField, nameField)
 		},
 		getHTMLValuea() {
-			//const aaa = this.instance.command.getHTML()
+			const aaa = this.instance.command.getText()
+			if (aaa.main.indexOf('{') == -1) {
+				ElMessage({
+					message: '预览模式不可保存设置',
+					type: 'error',
+					plain: true,
+				})
+				return false
+			}
 			const ccc = this.instance.command.getValue()
-			//localStorage.setItem('word_data', JSON.stringify(ccc.data))
+			localStorage.setItem('word_data', JSON.stringify(ccc.data))
-			let saveData = {'type':this.orderType, 'field_style':ccc.data}
+			//return false
+			let saveData = { 'id': this.id, 'type': this.orderType, 'field_style': ccc.data }
 			let api = '/api/Administrator/OrderFieldStyle/save'
 			axios.post(api, saveData).then((res) => {
 				ElMessage({
@@ -792,6 +806,18 @@ export default {
 			const srcValue = imgElement.src
 			return srcValue
 		},
+		getFieldValues(field) {
+			let value = ''
+			for (let i = 0; i < this.orderData.length; i++) {
+				const element = this.orderData[i]
+				if (value == '') {
+					value = element[field]
+				} else {
+					value += ',' + element[field]
+				}
+			}
+			return value
+		},
 		replaceData(value) {
 			///console.log('value', value)
 			let start = value.indexOf('{')
@@ -801,18 +827,51 @@ export default {
 			let end = value.indexOf('}')
 			let fieldKey = value.substring(start + 1, end)
 			let field = this.searchNameField[fieldKey]
-			let newValue = this.searchList[field]
+			let newValue = ''
+			if (field == undefined) {
+				field = this.nameField[fieldKey]
+				newValue = this.getFieldValues(field)
+			} else {
+				newValue = this.searchList[field]
+			}
 			value = value.replace('{' + fieldKey + '}', newValue)
 			return this.replaceData(value)
 		},
-	
+		chkTdList(tdList) {
-		fillData(config) {
+			for (let i = 0; i < tdList.length; i++) {
+				const element = tdList[i];
+				if (element.value.length == 0) {
+					continue
+				}
+				let value = element.value[0].value
+				if (value.indexOf("{") != -1) {
+					return true //需要循环数据
+				}
+			}
+			return false //不需要循环数据
+		},
+		handlerMergeTable(list, order) {
+			let trList = JSON.parse(JSON.stringify(list))
+			for (let i = 0; i < trList.tdList.length; i++) {
+				let tdListItem = trList.tdList[i];
+				if (tdListItem.value.length == 0) {
+					continue
+				}
+				let tdValue = tdListItem.value[0].value
+				tdListItem.value[0].value = this.getFieldValue(tdValue, order)
+			}
+			return trList
+		},
+		fillData(data) {
+			let config = JSON.parse(data)
 			let res = []
 			let code = this.getImage('imgCode')
 			for (let i = 0; i < config.length; i++) {
-				let configItem = config[i]//JSON.parse(JSON.stringify(config[i]))
+				let configItem = JSON.stringify(config[i])//
+				configItem = JSON.parse(configItem)
 				if (configItem.hasOwnProperty('type') && configItem['type'] == 'table') {
-					let trList = configItem.trList
+					let trList = JSON.stringify(configItem.trList)
+					trList = JSON.parse(trList)
 					let temTrList = {
 						'colgroup': configItem.colgroup,
 						'height': configItem.height,
@@ -822,43 +881,63 @@ export default {
 						'trList': []
 					}
 					for (let j = 0; j < trList.length; j++) {
-						let trListItem = trList[j]//JSON.parse(JSON.stringify(trList[j]))
+						let trListItem = JSON.stringify(trList[j])//
-						let tdList = trListItem.tdList
+						trListItem = JSON.parse(trListItem)
-						let title = tdList[0].value[0].value
+						let tdList = JSON.stringify(trListItem.tdList)
-						if(title.indexOf('{') != -1) {
+						tdList = JSON.parse(tdList)
+						let chkRes = this.chkTdList(tdList)
+						if (chkRes == false) {
+							temTrList.trList.push(trListItem)
+							continue
+						}
 						trListItem.tdList = []
 						for (let k = 0; k < this.orderData.length; k++) {
 							let tempTdList = []
-								let order = this.orderData[k];
+							let order = this.orderData[k]
+							let hasMergeTable = false
 							for (let l = 0; l < tdList.length; l++) {
-									let tdListItem = tdList[l]//JSON.parse(JSON.stringify(tdList[l]))
+								let tdListItem = JSON.stringify(tdList[l])
-									let tdValue = tdListItem.value[0].value
+								tdListItem = JSON.parse(tdListItem)
-									let newValue = this.getFieldValue(tdValue, order)
+								if (tdListItem.rowspan > 1) {//处理合并的单元格行
-
+									hasMergeTable = true
+									let tempTrList = trList.slice(j, j + tdListItem.rowspan)
+									for (let g = 0; g < tempTrList.length; g++) {
+										const element = tempTrList[g]
+										let packeTrItem = this.handlerMergeTable(element, order)
+										temTrList.trList.push(packeTrItem)
+									}
+									if (k + 1 == this.orderData.length) {//当前合并单元格行数处理完k索引加单元格行数-1 本身循环有++操作
+										j += tdListItem.rowspan - 1
+									}
+									break
+								}
 								let item = {
 									'colspan': tdListItem.colspan,
 									'rowspan': tdListItem.rowspan,
-										'value': [
+									'value': []
-											{
-												'value': newValue,
-												'size': tdListItem.value[0].size
 								}
-										]
+								if(tdListItem.slashTypes != undefined) {
+									item.slashTypes = tdListItem.slashTypes
 								}
-
+								if (tdListItem.value.length == 0) {
+									tempTdList.push(item)
+									continue
+								}
+								let tdValue = tdListItem.value[0].value
+								let newValue = this.getFieldValue(tdValue, order)
+								let tempItem = { 'value': newValue, 'size': tdListItem.value[0].size }
+								item.value.push(tempItem)
 								tempTdList.push(item)
 							}
+							if (hasMergeTable == false) {//不是合并单元格
 								let tempTr = {
 									'height': trListItem.height,
-									'minHeight':trListItem.minHeight ? trListItem.minHeight : trListItem.height,
+									'tdList': [],
-									'tdList':[]
+									'minHeight': trListItem.minHeight ? trListItem.minHeight : trListItem.height
 								}
 								tempTr.tdList = tempTdList
 								temTrList.trList.push(tempTr)
 							}
-						}else{
-							temTrList.trList.push(trListItem)
-							continue
 						}
 					}
 					res.push(temTrList)
@@ -872,6 +951,7 @@ export default {
 					res.push(configItem)
 				}
 			}
+			//.log('config', config)
 			//console.log('res',res)
 			return res
 		},
@@ -883,30 +963,40 @@ export default {
 				let end = value.indexOf('}')
 				let keyStr = value.substring(start + 1, end)
 				let fieldKey = this.nameField[keyStr]
-				return value.replace('{'+ keyStr +'}', orderData[fieldKey])
+				value = value.replace('{' + keyStr + '}', orderData[fieldKey])
+				return this.getFieldValue(value, orderData)
 			}
 			return value
 		},
 
 		init() {
-			//console.log('doc',JSON.parse(JSON.stringify(this.doc)))
+			if (Object.keys(this.doc).length > 0) {
+				let tempDoc = JSON.stringify(this.doc)
+				tempDoc = JSON.parse(tempDoc)
+				this.initDoc(tempDoc)
+				return false
+			}
 			let _this = this
 			let api = '/api/Administrator/OrderFieldStyle/getUserConfig?type=' + this.orderType
 			axios.get(api).then((res) => {
 				res = JSON.parse(JSON.stringify(res))
-				//console.log(res)
 				let doc = {}
 				if (res.data.code == 1) {
 					doc = res.data.data.field_style
-					_this.doc = doc
+					let tempDoc = JSON.stringify(doc)
+					tempDoc = JSON.parse(tempDoc)
+					_this.doc = tempDoc
+					_this.id = res.data.data.id
 				}
 				_this.initDoc(doc)
 			})
 
 		},
 		initDoc(showData) {
+			this.updateStatus = !this.updateStatus
 			//showData = localStorage.getItem('word_data')
 			//showData = JSON.parse(showData)
+			//console.log(showData.main)
 			if (Object.keys(showData).length === 0) {
 				showData = {
 					header: [],
@@ -920,7 +1010,8 @@ export default {
 				}
 			}
 			if (this.updateStatus) {
-				showData.main = this.fillData(showData.main)
+				let data = JSON.stringify(showData.main)
+				showData.main = this.fillData(data)
 			}
 			if (this.instance != null) {
 				this.instance.destroy()
@@ -1498,6 +1589,16 @@ export default {
 			this.instance.command.executePageMode(li.dataset.pageMode)
 		},
 		editorLisener() {
+			this.instance.listener.visiblePageNoListChange = function (payload) {
+				const text = payload.map(i => i + 1).join('、')
+				document.querySelector('.page-no-list').innerText = text
+			}
+			this.instance.listener.intersectionPageNoChange = function (payload) {
+				document.querySelector('.page-no').innerText = `${payload + 1}`
+			}
+			this.instance.listener.pageSizeChange = function (payload) {
+				document.querySelector('.page-size').innerText = `${payload}`
+			}
 			this.instance.listener.contentChange = debounce(this.handleContentChange, 200)
 
 			this.instance.listener.pageScaleChange = function (payload) {

vite.config.js

@@ -18,8 +18,8 @@ export default defineConfig({
       // 在此处编写代理规则
       '/api': {
         secure: false,
-        target: 'https://test.yqt.com',
+        //target: 'https://test.yqt.com',
-        //target: 'https://c.apxly.com',
+        target: 'https://c.apxly.com',
         changeOrigin: true,
         rewrite: (path) => {
           return path.replace(/\/api/, '')