From 6a5bfb80f692ed84b8bce20a9bf3ce11bab61d0c Mon Sep 17 00:00:00 2001
From: lq <13849061902@qq.com>
Date: Tue, 9 Jul 2024 15:03:32 +0800
Subject: [PATCH] add code

---
 src/App.vue    | 797 ++++++++++++++++++++++++++-----------------------
 vite.config.js |   4 +-
 2 files changed, 425 insertions(+), 376 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index e312c67..7dcc582 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -118,12 +118,12 @@ import TheWelcome from './components/TheWelcome.vue'
 					<div class="menu-item__subscript" @click="executeSubscript">
 						<i></i>
 					</div>
-					<div class="menu-item__color" title="字体颜色">
+					<div class="menu-item__color" title="字体颜色" @click="selectColor">
 						<i></i>
 						<span></span>
 						<input type="color" id="color" />
 					</div>
-					<div class="menu-item__highlight" title="高亮">
+					<div class="menu-item__highlight" title="高亮" @click="highlight">
 						<i></i>
 						<span></span>
 						<input type="color" id="highlight">
@@ -167,52 +167,52 @@ import TheWelcome from './components/TheWelcome.vue'
 					<!--<div class="menu-item__justify">
 						<i></i>
 					</div>-->
-					<div class="menu-item__row-margin">
+					<div class="menu-item__row-margin" @click="rowMargin">
 						<i title="行间距"></i>
 						<div class="options">
 							<ul>
-								<li data-rowmargin='1'>1</li>
-								<li data-rowmargin="1.25">1.25</li>
-								<li data-rowmargin="1.5">1.5</li>
-								<li data-rowmargin="1.75">1.75</li>
-								<li data-rowmargin="2">2</li>
-								<li data-rowmargin="2.5">2.5</li>
-								<li data-rowmargin="3">3</li>
+								<li data-rowmargin='1' @click="setRowMargin">1</li>
+								<li data-rowmargin="1.25" @click="setRowMargin">1.25</li>
+								<li data-rowmargin="1.5" @click="setRowMargin">1.5</li>
+								<li data-rowmargin="1.75" @click="setRowMargin">1.75</li>
+								<li data-rowmargin="2" @click="setRowMargin">2</li>
+								<li data-rowmargin="2.5" @click="setRowMargin">2.5</li>
+								<li data-rowmargin="3" @click="setRowMargin">3</li>
 							</ul>
 						</div>
 					</div>
-					<div class="menu-item__list">
+					<div class="menu-item__list" @click="menuList">
 						<i></i>
 						<div class="options">
 							<ul>
-								<li>
+								<!-- <li>
 									<label>取消列表</label>
-								</li>
-								<li data-list-type="ol" data-list-style='decimal'>
+								</li> -->
+								<li data-list-type="ol" data-list-style='decimal' @click="setMenuList">
 									<label>有序列表：</label>
 									<ol>
 										<li>________</li>
 									</ol>
 								</li>
-								<li data-list-type="ul" data-list-style='checkbox'>
+								<li data-list-type="ul" data-list-style='checkbox' @click="setMenuList">
 									<label>复选框列表：</label>
 									<ul style="list-style-type: '☑️ ';">
 										<li>________</li>
 									</ul>
 								</li>
-								<li data-list-type="ul" data-list-style='disc'>
+								<li data-list-type="ul" data-list-style='disc' @click="setMenuList">
 									<label>实心圆点列表：</label>
 									<ul style="list-style-type: disc;">
 										<li>________</li>
 									</ul>
 								</li>
-								<li data-list-type="ul" data-list-style='circle'>
+								<li data-list-type="ul" data-list-style='circle' @click="setMenuList">
 									<label>空心圆点列表：</label>
 									<ul style="list-style-type: circle;">
 										<li>________</li>
 									</ul>
 								</li>
-								<li data-list-type="ul" data-list-style='square'>
+								<li data-list-type="ul" data-list-style='square' @click="setMenuList">
 									<label>空心方块列表：</label>
 									<ul style="list-style-type: square;">
 										<li>________</li>
@@ -239,50 +239,50 @@ import TheWelcome from './components/TheWelcome.vue'
 						<i title="图片"></i>
 						<input @change="selectImage" type="file" id="image" accept=".png, .jpg, .jpeg, .svg, .gif">
 					</div>
-					<div class="menu-item__hyperlink">
+					<div class="menu-item__hyperlink" @click="executeHyperlink">
 						<i title="超链接"></i>
 					</div>
-					<div class="menu-item__separator">
+					<div class="menu-item__separator" @click="separatorDom">
 						<i title="分割线"></i>
 						<div class="options">
 							<ul>
-								<li data-separator='0,0'>
+								<li data-separator='0,0' @click="insertSeparator">
 									<i></i>
 								</li>
-								<li data-separator="1,1">
+								<li data-separator="1,1" @click="insertSeparator">
 									<i></i>
 								</li>
-								<li data-separator="3,1">
+								<li data-separator="3,1" @click="insertSeparator">
 									<i></i>
 								</li>
-								<li data-separator="4,4">
+								<li data-separator="4,4" @click="insertSeparator">
 									<i></i>
 								</li>
-								<li data-separator="7,3,3,3">
+								<li data-separator="7,3,3,3" @click="insertSeparator">
 									<i></i>
 								</li>
-								<li data-separator="6,2,2,2,2,2">
+								<li data-separator="6,2,2,2,2,2" @click="insertSeparator">
 									<i></i>
 								</li>
 							</ul>
 						</div>
 					</div>
-					<div class="menu-item__watermark">
+					<div class="menu-item__watermark" @click="waterMark">
 						<i title="水印(添加、删除)"></i>
 						<div class="options">
 							<ul>
-								<li data-menu="add">添加水印</li>
-								<li data-menu="delete">删除水印</li>
+								<li data-menu="add" @click="setWaterMark">添加水印</li>
+								<li data-menu="delete" @click="setWaterMark">删除水印</li>
 							</ul>
 						</div>
 					</div>
-					<div class="menu-item__codeblock" title="代码块">
+					<!-- <div class="menu-item__codeblock" title="代码块">
+						<i></i>
+					</div> -->
+					<div class="menu-item__page-break" title="分页符" @click="executePageBreak">
 						<i></i>
 					</div>
-					<div class="menu-item__page-break" title="分页符">
-						<i></i>
-					</div>
-					<div class="menu-item__control">
+					<!-- <div class="menu-item__control">
 						<i title="控件"></i>
 						<div class="options">
 							<ul>
@@ -292,32 +292,32 @@ import TheWelcome from './components/TheWelcome.vue'
 								<li data-control="radio">单选框</li>
 							</ul>
 						</div>
-					</div>
-					<div class="menu-item__checkbox" title="复选框">
+					</div> -->
+					<div class="menu-item__checkbox" title="复选框" @click="executeInsertElementList">
 						<i></i>
 					</div>
 					<!---<div class="menu-item__radio" title="单选框">
 						<i></i>
-					</div>-->
+					</div>
 					<div class="menu-item__latex" title="LateX">
 						<i></i>
-					</div>
-					<div class="menu-item__date">
+					</div>-->
+					<div class="menu-item__date" @click="executeDate">
 						<i title="日期"></i>
 						<div class="options">
 							<ul>
-								<li data-format="yyyy-MM-dd"></li>
-								<li data-format="yyyy-MM-dd hh:mm:ss"></li>
+								<li data-format="yyyy-MM-dd" @click="executeSetDate"></li>
+								<li data-format="yyyy-MM-dd hh:mm:ss" @click="executeSetDate"></li>
 							</ul>
 						</div>
 					</div>
-					<div class="menu-item__block" title="内容块">
+					<div class="menu-item__block" title="内容块" @click="executeBlock">
 						<i></i>
 					</div>
 				</div>
 				<div class="menu-divider"></div>
 				<div class="menu-item">
-					<div class="menu-item__search" data-menu="search">
+				<!-- 	<div class="menu-item__search" data-menu="search">
 						<i></i>
 					</div>
 					<div class="menu-item__search__collapse" data-menu="search">
@@ -336,11 +336,11 @@ import TheWelcome from './components/TheWelcome.vue'
 							<input type="text">
 							<button>替换</button>
 						</div>
-					</div>
+					</div>-->
 					<div class="menu-item__print" @click="executePrint" data-menu="print">
 						<i></i>
 					</div>
-				</div>
+				</div> 
 			</div>
 			<!-- <div class="catalog" editor-component="catalog">
 				<div class="catalog__header">
@@ -418,8 +418,8 @@ import TheWelcome from './components/TheWelcome.vue'
 				</div>
 			</div>
 			<div v-if="confShow" class="main_right">
-				<el-form ref="form" label-width="80px">
-					<div v-for="(item, index) in orderList" :key="index">
+				<el-form ref="form" label-width="120px">
+					<div v-for="(item, index) in orderData" :key="index">
 						<div>订单信息{{ index }}:</div>
 						<div v-for="(value, key, index) in field">
 							<div v-if="nameField.hasOwnProperty(field[key])">
@@ -434,7 +434,7 @@ import TheWelcome from './components/TheWelcome.vue'
 				</el-form>
 			</div>
 			<div v-if="confShow" class="main_left">
-				<el-form ref="form" label-width="100px">
+				<el-form ref="form" label-width="120px">
 					<el-form-item label="" style="margin-bottom: 0;">
 						单击即复制成功
 					</el-form-item>
@@ -496,7 +496,7 @@ import Editor, {
 import axios from 'axios'
 import draggable from "vuedraggable"
 import QRCode from 'qrcodejs2-fix'
-import {ref} from 'vue'
+import { Dialog } from './components/dialog/Dialog'
 export default {
 	data() {
 		return {
@@ -513,7 +513,6 @@ export default {
 			nameField: {},
 			saveData: {},
 			updateStatus: false,
-			orderList: [],
 			showObj: {},
 			config: {},
 			tableHeight: 42,
@@ -522,7 +521,7 @@ export default {
 			searchNameField:{},
 			searchList:{},
 			searchField:{},
-			qrCodeValue:'dfdfddgg',
+			doc:{},
 			myDiv: null
 		}
 	},
@@ -557,30 +556,14 @@ export default {
 			this.updateStatus = true
 			this.init([])
 		},
-		onStart() {
-			console.log("开始拖拽")
-		},
-		onEnd() {
-			//console.log(this.fieldArr)
-			console.log("结束拖拽")
-			this.updateStatus = true
-			this.updateDoc(this.orderList)
-		},
 		isUpdate() {
 			if (this.tableCol == '' || this.tableCol == '0') {
 				return false
 			}
 			this.updateStatus = true
-			//this.updateDoc(this.orderList)
-			this.init([])
-		},
-		updateWord() {
-			const ccc = this.instance.command.getValue()
-			this.updateStatus = true
-			//console.log(this.orderList)
-			//this.updateDoc(this.orderList)
 			this.init([])
 		},
+
 		changeConfig() {
 			this.updateStatus = false
 			this.init([])
@@ -624,7 +607,7 @@ export default {
 		},
 		getApiData() {
 			let api = '/api/Administrator/InquiryOrder/getOrderInfo?order_id=E2024060509560254698592'
-			let api2 = '/api/Administrator/OrderFieldStyle/getUserConfig?type=1'
+			
 			let api3 ='/api/Administrator/InquirySearchConfig/getUserConfig'
 			const request1 = axios.get(api)
 			//const request2 = axios.get(api2)
@@ -632,24 +615,20 @@ export default {
 			axios.all([request1, request3]).then(axios.spread((response1, response3) => {
 				//.log(response1, response2)
 				let data = response1.data
-				this.orderList = data.data.orderExt.productList
+				let orderList = data.data.orderExt.productList
+				let proIdData = [];
+				for (let k = 0; k < orderList.length; k++) {
+					const element = orderList[k]
+					let item = {'proid': element['pid'], 'prolistid': element['plid']}
+					proIdData.push(item)
+				}
 				this.searchList = data.data.searchExt
 				let order_id = data.data.searchExt['order_id']
-				console.log('order_id', order_id)
 				this.handleGenerate('imgCode', order_id)
 				let orderData = data.data.orderExt.productList
-				//let data2 = response2.data
 				let data3 = response3.data
 				this.orderData = orderData
-				/* if (data2.code == 1) {
-					this.config = data2.data
-					for (let key in this.showObj) {
-						if (!this.config.hasOwnProperty(key)) {
-							this.showObj[key] = false
-						}
-					}
-					this.sortData(data2.data)
-				} */
+				
 				if(data3.code == 1) {
 					this.searchConfig = data3.data
 					let searchNameField = {}
@@ -664,178 +643,33 @@ export default {
 					this.searchNameField = searchNameField
 					this.searchField = searchField
 				}
-				this.updateDoc(orderData)
+				for (let l = 0; l < proIdData.length; l++) {
+					const element = proIdData[l];
+					this.getGongXu(element, l)					
+				}
+				this.init(orderData)
 			}))
 		},
-		
-		sortData(styleData) {
-			let tempObj = {}
-			for (let i = 0; i < this.fieldArr.length; i++) {
-				tempObj[this.fieldArr[i].field] = this.fieldArr[i]
+		async getGongXu(data, i){
+			let api = '/api/Administrator/FnProList/getCustomField'
+			const resData = await axios.post(api, data)
+			for(let key in resData.data.data.data) {
+				this.orderData[i][key] = resData.data.data.data[key]
 			}
-			let tempArr = [];
-			for (let key in tempObj) {
-				if (!styleData.hasOwnProperty(key)) {
-					tempArr.push(tempObj[key])
-				}
-			}
-			for (let styleKey in styleData) {
-				tempArr.push(tempObj[styleKey])
-			}
-			this.fieldArr = tempArr
-		},
-		getTest(data) {
-			let nArr = data.split('\n')
-			let saveData = {}
-			for (let i = 0; i < nArr.length; i++) {
-				let item = nArr[i].split(' ').filter(it => it !== '')
-				if (item.length > 2) {
-					item = this.packageItem(item)
-				}
-
-				for (let j = 0; j < item.length; j++) {
-					let itemArr = item[j].split(':')
-					if (this.nameField.hasOwnProperty(itemArr[0])) {
-						saveData[this.nameField[itemArr[0]]] = itemArr[1]
-					}
-				}
-			}
-			this.saveData = saveData
-
-			if (this.updateStatus) {
-				this.updateDoc(saveData)
-			}
-		},
-		updateDoc(orderData) {
-			let _this = this
-			//let width = 553 / this.tableCol
-			let width = _this.tableWidth / _this.tableCol
-			let showData = []
-			let cols = []
-			for (let c = 0; c < _this.tableCol; c++) {
-				let widthItem = { "width": width }
-				cols.push(widthItem)
-			}
-			let tableHeight = parseInt(_this.tableHeight)
-			let table = { "value": "", "type": "table", rowFlex: 'center', "trList": [], "width": _this.tableWidth, "height": 126, "colgroup": [] }
-			table.colgroup = cols
-			let trList = [{ "minHeight": tableHeight, "height": tableHeight, "tdList": [{ 'verticalAlign': 'middle', "colspan": _this.tableCol, "rowspan": 1, "value": [{ "value": "订单详情", "size": 18, 'rowFlex': 'center', bold: 'bolder' }] }] }]
-
-			let tdList = []
-			let ind = 1
-			let len = parseInt(_this.tableCol)
-			let temList = []
-			orderData.forEach(function (item) {
-
-				if (tdList.length > 0) {
-					let temLen = len - tdList.length
-					let obj = _this.fillBlank(len, tdList, temList)
-					trList.push(obj.trListItem1)
-					trList.push(obj.trListItem2)
-					tdList = []
-					temList = []
-					ind += temLen
-				}
-
-				let proTitle = { "minHeight": tableHeight, "height": tableHeight, "tdList": [{ 'verticalAlign': 'middle', "colspan": _this.tableCol, "rowspan": 1, "value": [{ "value": "产品名称: " + item['product_name'], "size": 16, bold: 'bolder' }] }] }
-				trList.push(proTitle)
-				//for (let key in _this.field) {
-				for (let j = 0; j < _this.fieldArr.length; j++) {
-					let key = _this.fieldArr[j].field
-					if (!_this.showObj[key]) continue
-
-					let value = {}
-					let temValue = {}
-					if (_this.config.hasOwnProperty(key)) {//
-						let field_style = JSON.parse(JSON.stringify(_this.config[key]['field_style']))
-						//let title = _this.fieldArr[j].name//_this.field[key]
-						field_style.value = _this.fieldArr[j].name
-
-						value = { 'verticalAlign': 'middle', "colspan": 1, "rowspan": 1, "value": [field_style] }
-						let value_style = JSON.parse(JSON.stringify(_this.config[key]['value_style']))
-						//let field_value = item[key]
-						value_style.value = item[key]
-
-						temValue = { 'verticalAlign': 'middle', "colspan": 1, "rowspan": 1, "value": [value_style] }
-					} else {
-						value = { 'verticalAlign': 'middle', "colspan": 1, "rowspan": 1, "value": [{ "value": _this.fieldArr[j].name, "size": 16, 'rowFlex': RowFlex.CENTER }] }
-						temValue = { 'verticalAlign': 'middle', "colspan": 1, "rowspan": 1, "value": [{ "value": item[key], "size": 14, 'rowFlex': RowFlex.CENTER }] }
-					}
-
-					tdList.push(value)
-					temList.push(temValue)
-					if (ind % len == 0) {
-						let trListItem = { "minHeight": tableHeight, "height": tableHeight, "tdList": [] }
-						trListItem.tdList = tdList
-						trList.push(trListItem)
-						tdList = []
-
-						trListItem = { "minHeight": tableHeight, "height": tableHeight, "tdList": [] }
-						for (let index = 0; index < temList.length; index++) {
-							tdList.push(temList[index])
-						}
-						trListItem.tdList = tdList
-						trList.push(trListItem)
-						tdList = []
-						temList = []
-					}
-					ind++
-
-				}
-			})
-
-			if (tdList.length > 0) {
-				let obj = this.fillBlank(len, tdList, temList)
-				trList.push(obj.trListItem1)
-				trList.push(obj.trListItem2)
-			}
-			table.trList = trList
-			showData.push(table)
-			this.init(showData)
-		},
-
-		fillBlank(len, tdList, temList) {
-			let temLen = len - tdList.length
-			let tableHeight = parseInt(this.tableHeight)
-			for (let g = 0; g < temLen; g++) {
-				let value = { "colspan": 1, "rowspan": 1, "value": [{ "value": "", "size": 16 }] }
-				tdList.push(value)
-			}
-			let trListItem1 = { "minHeight": tableHeight, "height": tableHeight, "tdList": [] }
-			trListItem1.tdList = tdList
-			//trList.push(trListItem)
-
-			tdList = []
-			let trListItem2 = { "minHeight": tableHeight, "height": tableHeight, "tdList": [] }
-			for (let index = 0; index < temList.length; index++) {
-				tdList.push(temList[index])
-			}
-			for (let g = 0; g < temLen; g++) {
-				let value = { "colspan": 1, "rowspan": 1, "value": [{ "value": "", "size": 16 }] }
-				tdList.push(value)
-			}
-			trListItem2 = { "minHeight": tableHeight, "height": tableHeight, "tdList": [] }
-			trListItem2.tdList = tdList
-			return { trListItem1: trListItem1, trListItem2: trListItem2 }
-		},
-
-		packageItem(arr) {
-			let k = 0
-			for (let i = 0; i < arr.length; i++) {
-				if (arr[i].split(':').length > 1) {
-					k = i
-
-				} else {
-					arr[k] += arr[i]
-
-				}
-			}
-			return arr.filter(it => it.split(':').length > 1)
+			let field = resData.data.data.field
+			let nameField = resData.data.data.name_field
+			this.field = Object.assign({}, this.field, field)
+			this.nameField = Object.assign({}, this.nameField, nameField)
 		},
 		getHTMLValuea() {
 			const ccc = this.instance.command.getValue()
 			//console.log(ccc)
 			localStorage.setItem('word_data', JSON.stringify(ccc.data))
+			let saveData = {'type':1, 'field_style':ccc.data}
+			let api = '/api/Administrator/OrderFieldStyle/save'
+			axios.post(api, saveData).then((res) => {
+
+			})
 
 			//this.getTest(ccc.data.main[2].value)
 		},
@@ -890,34 +724,14 @@ export default {
 				saveData.push(tempData[key])
 			}
 			//.log(saveData)
-			//return false
+			return false
 			let api = '/api/Administrator/OrderFieldStyle/save'
 			axios.post(api, saveData).then((res) => {
 
 			})
 
 		},
-		getLen(value) {
-			let arr = value.split('')
-			var regexForNumbers = /^\d+$/;
-
-			// 匹配字母
-			var regexForLetters = /^[A-Za-z]+$/;
-			let count = 0
-			for (let i = 0; i < arr.length; i++) {
-				if (regexForNumbers.test(arr[i]) || regexForLetters.test(arr[i]) || arr[i] == ':' || arr[i] == '.' || arr[i] == ' ') {
-					count++
-				} else {
-					count += 2
-				}
-			}
-			if (count > 40) {
-				count = 40
-			}
-			return count
-
-		},
-		getImgage(ele){
+		getImage(ele){
 			const imgElement = document.querySelector(`#${ele} img`)
 			const srcValue = imgElement.src
 			return srcValue
@@ -935,74 +749,12 @@ export default {
 			value = value.replace('{'+ fieldKey +'}', newValue)
 			return this.replaceData(value)
 		},
-		fillDataBak(config) {
-			let code = this.getImgage('imgCode')
-			let result = []
-			let orderData = this.orderData
-			let tempList = []
-			let tempTrList = []
-			let tableIndex = 0
-			let data = JSON.parse(JSON.stringify(config))
-			for (let i = 0; i < config.length; i++) {
-				let temp = JSON.parse(JSON.stringify(config[i]))
-				if (!config[i].hasOwnProperty('type')) {
-					if(config[i].value.indexOf('{') == -1) {
-						result.push(data[i])
-						continue
-					}else{
-						let value = data[i].value
-						/* let start = value.indexOf('{')
-						let end = value.indexOf('}')
-						let fieldKey = value.substring(start + 1, end)
-						let field = this.searchNameField[fieldKey]
-						let newValue = this.searchList[field] */
-						config[i].value = this.replaceData(value)//value.replace('{'+ fieldKey +'}', newValue)
-						
-						result.push(data[i])
-						continue
-					}
-				}else if(config[i].type == 'image') {
-					console.log('image',data[i])
-					config[i].value = code
-					continue
-				}
-				for (let o = 0; o < orderData.length; o++) {
-					{
-						let order = JSON.parse(JSON.stringify(orderData[o]))
-						if (config[i].type == 'table') {
-							data[i].trList = []
-							tableIndex = i
-							let trList = JSON.parse(JSON.stringify(config[i].trList))
-							let list = this.packageTrList(trList, order, o)
-							if(list.length != 0) {
-								temp.trList = list
-								result.push(temp)
-								for (let index = 0; index < list.length; index++) {
-									let element = list[index];
-									tempTrList.push(element)
-								}
-							}
-						}else{
-							let value = temp.value
-							if(value.indexOf('{') == -1) {
-								temp.value = this.getFieldValue(value, order)
-								result.push(temp)
-							}
-							
-						}
-					}
-				}
-				//config[tableIndex].trList = tempTrList
-			}
-			config[tableIndex].trList = tempTrList
-			//config
-			return config
-		},
+	
 		fillData(config) {
 			let res = []
-			let code = this.getImgage('imgCode')
+			let code = this.getImage('imgCode')
 			for (let i = 0; i < config.length; i++) {
-				let configItem = JSON.parse(JSON.stringify(config[i]))
+				let configItem = config[i]//JSON.parse(JSON.stringify(config[i]))
 				if(configItem.hasOwnProperty('type') && configItem['type'] == 'table') {
 					let trList = configItem.trList
 					let temTrList = {
@@ -1014,7 +766,7 @@ export default {
 						'trList': []
 					}
 					for (let j = 0; j < trList.length; j++) {
-						let trListItem = JSON.parse(JSON.stringify(trList[j]))
+						let trListItem = trList[j]//JSON.parse(JSON.stringify(trList[j]))
 						let tdList = trListItem.tdList
 						let title = tdList[0].value[0].value
 						if(title.indexOf('{') != -1) {
@@ -1023,9 +775,10 @@ export default {
 								let tempTdList = []
 								let order = this.orderData[k];
 								for (let l = 0; l < tdList.length; l++) {
-									let tdListItem = JSON.parse(JSON.stringify(tdList[l]))
+									let tdListItem = tdList[l]//JSON.parse(JSON.stringify(tdList[l]))
 									let tdValue = tdListItem.value[0].value
 									let newValue = this.getFieldValue(tdValue, order)
+
 									let wocao = {
 										'colspan': tdListItem.colspan,
 										'rowspan': tdListItem.rowspan,
@@ -1036,6 +789,7 @@ export default {
 											}
 										]
 									}
+
 									tempTdList.push(wocao)
 								}
 								let tempTr = {
@@ -1065,37 +819,7 @@ export default {
 			//console.log('res',res)
 			return res
 		},
-		packageTrList(trList, orderData, o) {
-			let data = trList
-			let falg = false
-			let deleteIndexArr = []
-			for (let i = 0; i < data.length; i++) {
-				let tdList = data[i].tdList
-				for (let j = 0; j < tdList.length; j++) {
-					if(tdList[j].value.length > 0) {
-						let value = tdList[j].value[0].value
-						let start = value.indexOf('{')
-						if(start == -1 && o != 0) {
-							falg = true
-							deleteIndexArr.push(i)
-							//console.log(deleteIndexArr, data[i])
-
-						}
-						let newValue = this.getFieldValue(value, orderData)
-						tdList[j].value[0].value = newValue
-					}
-					
-				}
-			}
-			deleteIndexArr = [...new Set(deleteIndexArr)]
-			if(falg) {
-				//console.log(deleteIndexArr)
-				for (let index = 0; index < deleteIndexArr.length; index++) {
-					data.splice(deleteIndexArr['index'], 1);
-				}
-			}
-			return data
-		},
+	
 		getFieldValue(value, orderData) {
 			if(value == '') return ''
 			let start = value.indexOf('{')
@@ -1104,20 +828,31 @@ export default {
 				let keyStr = value.substring(start + 1, end)
 				let fieldKey = this.nameField[keyStr]
 				return value.replace('{'+ keyStr +'}', orderData[fieldKey])
-				//return field
 			}
 			return value
 		},
+		
 		init(showData) {
-			showData = localStorage.getItem('word_data')
-			showData = JSON.parse(showData)
-			if (showData == null) {
+			let _this = this
+			let api = '/api/Administrator/OrderFieldStyle/getUserConfig?type=1'
+			const res = axios.get(api).then((res) => {
+				let doc = {}
+				if(res.data.code == 1) {
+					doc = res.data.data.field_style
+					_this.doc = doc
+				}
+				_this.initDoc(doc)
+			})
+			
+		},
+		initDoc(showData) {
+			if (Object.keys(showData).length === 0) {
 				showData = {
 					header: [],
 					main: [],
 					footer: [
 						{
-							value: 'canvas-editor',
+							value: '',
 							size: 12
 						}
 					]
@@ -1125,18 +860,19 @@ export default {
 			}
 			if (this.updateStatus) {
 				showData.main = this.fillData(showData.main)
-				//console.log(showData)
 			}
 			if(this.instance != null) {
 				this.instance.destroy()
 			}
+			
 			this.instance = new Editor(
-				document.querySelector('.editor'),
+				document.querySelector('.editor'), 
 				showData,
 				{}
 			)
-			//console.log(this.instance)
+			this.editorLisener()
 		},
+		
 		getSelectImage() {
 			const imageFileDom = document.querySelector('#image')
 			imageFileDom.click()
@@ -1163,6 +899,131 @@ export default {
 				}
 			} 
 		},
+		executeInsertElementList() {
+			this.instance.command.executeInsertElementList([
+				{
+					type: ElementType.CHECKBOX,
+					value: ''
+				}
+			])
+		},
+		executeHyperlink() {
+			let _this = this
+			new Dialog({
+				title: '超链接',
+				data: [
+					{
+						type: 'text',
+						label: '文本',
+						name: 'name',
+						required: true,
+						placeholder: '请输入文本'
+					},
+					{
+						type: 'text',
+						label: '链接',
+						name: 'url',
+						required: true,
+						placeholder: '请输入链接'
+					}
+				],
+				onConfirm: payload => {
+					const name = payload.find(p => p.name === 'name')?.value
+					if (!name) return
+					const url = payload.find(p => p.name === 'url')?.value
+					if (!url) return
+					this.instance.command.executeHyperlink({
+						type: ElementType.HYPERLINK,
+						value: '',
+						url,
+						valueList: name.split('').map(n => ({
+							value: n,
+							size: 16
+						}))
+					})
+				}
+			})
+		},
+		executePageBreak() {
+			this.instance.command.executePageBreak()
+		},
+		executeBlock() {
+			let _this = this
+			new Dialog({
+				title: '内容块',
+				data: [
+					{
+						type: 'select',
+						label: '类型',
+						name: 'type',
+						value: 'iframe',
+						required: true,
+						options: [
+							{
+								label: '网址',
+								value: 'iframe'
+							},
+							{
+								label: '视频',
+								value: 'video'
+							}
+						]
+					},
+					{
+						type: 'number',
+						label: '宽度',
+						name: 'width',
+						placeholder: '请输入宽度（默认页面内宽度）'
+					},
+					{
+						type: 'number',
+						label: '高度',
+						name: 'height',
+						required: true,
+						placeholder: '请输入高度'
+					},
+					{
+						type: 'textarea',
+						label: '地址',
+						height: 100,
+						name: 'value',
+						required: true,
+						placeholder: '请输入地址'
+					}
+				],
+				onConfirm: payload => {
+					const type = payload.find(p => p.name === 'type')?.value
+					if (!type) return
+					const value = payload.find(p => p.name === 'value')?.value
+					if (!value) return
+					const width = payload.find(p => p.name === 'width')?.value
+					const height = payload.find(p => p.name === 'height')?.value
+					if (!height) return
+					const block = {
+						type: type
+					}
+					if (block.type === BlockType.IFRAME) {
+						block.iframeBlock = {
+							src: value
+						}
+					} else if (block.type === BlockType.VIDEO) {
+						block.videoBlock = {
+							src: value
+						}
+					}
+					const blockElement = {
+						type: ElementType.BLOCK,
+						value: '',
+						height: Number(height),
+						block
+					}
+					if (width) {
+						blockElement.width = Number(width)
+					}
+					_this.instance.command.executeInsertElementList([blockElement])
+				}
+			})
+		},
 		executeUndo() {//撤销
 			this.instance.command.executeUndo()
 		},
@@ -1230,6 +1091,193 @@ export default {
 		rowFlexAlignment() {
 			this.instance.command.executeRowFlex(RowFlex.ALIGNMENT)
 		},
+		executeSetDate(evt) {
+			const dateDom = document.querySelector('.menu-item__date')
+			const dateDomOptionDom = dateDom.querySelector('.options')
+			const li = evt.target
+			const dateFormat = li.dataset.format
+			dateDomOptionDom.classList.toggle('visible')
+			this.instance.command.executeInsertElementList([
+				{
+					type: ElementType.DATE,
+					value: '',
+					dateFormat,
+					valueList: [
+						{
+							value: li.innerText.trim()
+						}
+					]
+				}
+			])
+		},
+		executeDate(){
+			const dateDom = document.querySelector('.menu-item__date')
+			const dateDomOptionDom = dateDom.querySelector('.options')
+			dateDomOptionDom.classList.toggle('visible')
+			// 定位调整
+			const bodyRect = document.body.getBoundingClientRect()
+			const dateDomOptionRect = dateDomOptionDom.getBoundingClientRect()
+			if (dateDomOptionRect.left + dateDomOptionRect.width > bodyRect.width) {
+				dateDomOptionDom.style.right = '0px'
+				dateDomOptionDom.style.left = 'unset'
+			} else {
+				dateDomOptionDom.style.right = 'unset'
+				dateDomOptionDom.style.left = '0px'
+			}
+			// 当前日期
+			const date = new Date()
+			const year = date.getFullYear().toString()
+			const month = (date.getMonth() + 1).toString().padStart(2, '0')
+			const day = date.getDate().toString().padStart(2, '0')
+			const hour = date.getHours().toString().padStart(2, '0')
+			const minute = date.getMinutes().toString().padStart(2, '0')
+			const second = date.getSeconds().toString().padStart(2, '0')
+			const dateString = `${year}-${month}-${day}`
+			const dateTimeString = `${dateString} ${hour}:${minute}:${second}`
+			dateDomOptionDom.querySelector('li:first-child').innerText =dateString
+			dateDomOptionDom.querySelector('li:last-child').innerText =dateTimeString
+		
+		},
+		
+		separatorDom() {
+			const separatorDom = document.querySelector('.menu-item__separator')
+			const separatorOptionDom = separatorDom.querySelector('.options')
+			separatorOptionDom.classList.toggle('visible')	
+		},
+		insertSeparator(evt) {
+			let payload = []
+			const li = evt.target
+			const separatorDash = li.dataset.separator?.split(',').map(Number)
+			if (separatorDash) {
+				const isSingleLine = separatorDash.every(d => d === 0)
+				if (!isSingleLine) {
+					payload = separatorDash
+				}
+			}
+			this.instance.command.executeSeparator(payload)
+		},
+		selectColor () {
+			const colorControlDom = document.querySelector('#color')
+			const colorDom = document.querySelector('.menu-item__color')
+			colorControlDom.click()
+			
+			let _this = this
+			colorControlDom.oninput = function () {
+				_this.instance.command.executeColor(colorControlDom.value)
+			}
+		},
+		highlight () {
+			const highlightControlDom = document.querySelector('#highlight')
+			const highlightDom = document.querySelector('.menu-item__highlight')
+			highlightControlDom?.click()
+			
+			let _this = this
+			highlightControlDom.oninput = function () {
+				_this.instance.command.executeHighlight(highlightControlDom.value)
+			}
+			//const highlightSpanDom = highlightDom.querySelector('span')
+		},
+		rowMargin() {
+			const rowMarginDom = document.querySelector('.menu-item__row-margin')
+			const rowOptionDom = rowMarginDom.querySelector('.options')
+			rowOptionDom.classList.toggle('visible')
+			
+		},
+		setRowMargin(evt) {
+			const li = evt.target
+			const rowMargin = li.dataset.rowmargin
+			this.instance.command.executeRowMargin(Number(rowMargin))
+		},
+		menuList() {
+			const listDom = document.querySelector('.menu-item__list')
+			listDom.title = `列表(Ctrl+Shift+U)`
+			const listOptionDom = listDom.querySelector('.options')
+			listOptionDom.classList.toggle('visible')
+			
+			
+		},
+		setMenuList(evt){
+			const li = evt.target 
+			const listType = li.dataset.listType || null
+			const listStyle = (li.dataset.listStyle)
+			this.instance.command.executeList(listType, listStyle)
+		},
+		waterMark () {
+			const watermarkDom = document.querySelector('.menu-item__watermark')
+			const watermarkOptionDom = watermarkDom.querySelector('.options')
+			watermarkOptionDom.classList.toggle('visible')
+			
+		},
+		setWaterMark(evt) {
+			const watermarkDom = document.querySelector('.menu-item__watermark')
+			const watermarkOptionDom = watermarkDom.querySelector('.options')
+			const li = evt.target
+			const menu = li.dataset.menu
+			watermarkOptionDom.classList.toggle('visible')
+			let _this = this
+			if (menu === 'add') {
+				new Dialog({
+					title: '水印',
+					data: [
+						{
+							type: 'text',
+							label: '内容',
+							name: 'data',
+							required: true,
+							placeholder: '请输入内容'
+						},
+						{
+							type: 'color',
+							label: '颜色',
+							name: 'color',
+							required: true,
+							value: '#AEB5C0'
+						},
+						{
+							type: 'number',
+							label: '字体大小',
+							name: 'size',
+							required: true,
+							value: '120'
+						}
+					],
+					onConfirm: payload => {
+						const nullableIndex = payload.findIndex(p => !p.value)
+						if (~nullableIndex) return
+						const watermark = payload.reduce((pre, cur) => {
+							pre[cur.name] = cur.value
+							return pre
+						},{})
+						_this.instance.command.executeAddWatermark({
+							data: watermark.data,
+							color: watermark.color,
+							size: Number(watermark.size)
+						})
+					}
+				})
+			} else {
+				this.instance.command.executeDeleteWatermark()
+			}
+			
+		},
+		editorLisener(){
+			this.instance.listener.rangeStyleChange = function (payload) {
+				//console.log(payload)
+				const colorControlDom = document.querySelector('#color')
+				const colorDom = document.querySelector('.menu-item__color')
+				const colorSpanDom = colorDom.querySelector('span')
+				if (payload.color) {
+					colorDom.classList.add('active')
+					colorControlDom.value = payload.color
+					colorSpanDom.style.backgroundColor = payload.color
+				} else {
+					colorDom.classList.remove('active')
+					colorControlDom.value = '#000000'
+					colorSpanDom.style.backgroundColor = '#000000'
+				}
+			}
+		},
+
 		clickHandle2() {
 			const fontDom = document.querySelector('.menu-item__font')
 			const fontOptionDom = fontDom.querySelector('.options')
@@ -1336,7 +1384,8 @@ export default {
 			// 应用选择
 			this.instance.command.executeInsertTable(this.rowIndex, this.colIndex)
 			this.recoveryTable()
-		}
+		},
+		
 	}
 }
 </script>
diff --git a/vite.config.js b/vite.config.js
index 065dd2c..6b325af 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -18,8 +18,8 @@ export default defineConfig({
       // 在此处编写代理规则
       '/api': {
         secure: false,
-        //target: 'https://192.168.3.198',
-        target: 'https://c.apxly.com',
+        target: 'https://test.yqt.com',
+        //target: 'https://c.apxly.com',
         changeOrigin: true,
         rewrite: (path) => {
           return path.replace(/\/api/, '')