From 943324af0326b436a3a843d8c4889c23514f93ea Mon Sep 17 00:00:00 2001 From: YuanFeng <770153798@qq.com> Date: Mon, 25 Nov 2024 23:57:48 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../DraftDesign/components/DesignPropEdit.vue | 177 +++++------------- .../components/DynamicPropConfig.vue | 32 ++-- .../components/layout/LeftPanel.vue | 83 ++++++-- .../DraftDesign/components/layout/index.vue | 69 ++----- .../components/node/ShapeImageNode.vue | 9 +- .../src/components/DraftDesign/index.vue | 19 +- .../productcareitem/ProductCareItemForm.vue | 13 +- .../src/views/oms/productcareitem/index.vue | 47 ++++- .../productcareitem2/ProductCareItemForm.vue | 13 +- .../src/views/oms/productcareitem2/index.vue | 57 ++++-- .../productcareitem3/ProductCareItemForm.vue | 11 +- .../src/views/oms/productcareitem3/index.vue | 82 +++++--- .../src/views/oms/productinfo/index.vue | 3 +- .../DraftDesign/components/DesignPropEdit.vue | 177 +++++------------- .../components/DynamicPropConfig.vue | 32 ++-- .../components/layout/LeftPanel.vue | 83 ++++++-- .../DraftDesign/components/layout/index.vue | 69 ++----- .../components/node/ShapeImageNode.vue | 9 +- .../src/components/DraftDesign/index.vue | 19 +- 19 files changed, 520 insertions(+), 484 deletions(-) diff --git a/hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/DesignPropEdit.vue b/hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/DesignPropEdit.vue index c8b9a15..15f02a1 100644 --- a/hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/DesignPropEdit.vue +++ b/hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/DesignPropEdit.vue @@ -198,18 +198,17 @@ style="box-shadow: 0px 2px 5px 2px #dcdcdc;">
-
+
+
-
{ return []; }) const errorItem = (key, index) => { - console.log("errorKeys", errorKeys) return errorKeys.value.includes(`${key}_${index}`) } const errorInfo = (key, index) => { @@ -490,14 +488,11 @@ const changeIconData = (index: number, key: string) => { if (that.propInfo[key].dataInfo[index].showLabel) { const info = that.propInfo[key]; - console.log("info", that.propInfo[key].dataInfo[index]) const infoList = washingInfoListByType(info.groupType) let mapping = {} for (let i = 0; i < infoList.length; i++) { mapping[infoList[i].label] = infoList[i].langMapping; } - console.log("111", infoList, mapping) - // 多语言变量替换 const allData = [...that.propInfo[key].dataInfo] const fLang = allData[0].locale; @@ -531,24 +526,8 @@ const changeIconData = (index: number, key: string) => { for (let j = 0; j < m1.length; j++) { langObj[m1[j].locale] = m1[j] } - for (let k = i; k < allData.length; k++) { - if (langObj[allData[k].locale]) { - const obj = langObj[allData[k].locale] - if (obj) { - console.log("obj", obj) - let str = ratio; - if (str === null || str === undefined || str === -1) { - str = '' - } - allData[k].label = `${obj.value}`.replaceAll('${r}', `${str}`) - } - - } - } } - } - that.propInfo[key].dataInfo = [...allData]; resetData(); } @@ -566,7 +545,6 @@ const findProcessTypeIndex = (index) => { // 找到最后一个位置 if (that.propOrderByList[i].shape === ShapeType.vueShapeImage) { processType++; - console.log("@@@@@@", index, i) if (index === i) { return processType } @@ -615,9 +593,7 @@ const uploadFile = async (fileName) => { }); }); } -const deleteImgList = (key, index) => { -} const deleteList = (key, index) => { const item = cloneDeep(that.propInfo[key]) @@ -649,37 +625,6 @@ const deleteList = (key, index) => { } } -const appendImageList = (key) => { - // todo 待完成 - // const item = that.propInfo[key] - // console.log("item.dataInfo",item) - // const group = findGroup(key,that.propInfo) - // const keys = Object.keys(group); - // console.log("keys",keys) - // // 有多少组变量 - // if(keys.length >= item.maxSize ){ - // useMessage().notifyWarning("最大数量为:"+item.maxSize) - // return; - // } - // const locale = item.dataInfo[1].locale - // const tmpArr = [...item.dataInfo] - // - // for (let i = 1; i < tmpArr.length; i++) { - // if(i > 1 && tmpArr[i].locale === locale){ - // break; - // } - // item.dataInfo.push( - // { - // label: '', - // url: '', - // ratio: 0, - // ...tmpArr[i] - // } - // ) - // } - // resetData(); -} - const appendList = (key) => { const item = that.propInfo[key] console.log("item.dataInfo", item) @@ -940,11 +885,12 @@ const checkPropInfo = (info) => { let newInfo2 = cloneDeep(info) const keys = []; + // 排序变量 for (let i = 0; i < that.propOrderByList.length; i++) { keys.push(that.propOrderByList[i].key); } - for (let i = 0; i < keys.length; i++) { + endloop: for (let i = 0; i < keys.length; i++) { const key = keys[i]; // 合并相同语言的文字 let newArr = []; @@ -955,8 +901,7 @@ const checkPropInfo = (info) => { const dataInfoArr = newInfo[key].dataInfo; let langList = newInfo[key].langList || []; if (newInfo[key].groupType === GroupTypeEnum.RATIO) { - console.log("GroupTypeEnum.RATIO", newInfo[key]) - + // 成分比例 都进行固定语言组合 // 获取到所以的成分 let langSort = newInfo[key].langSort || []; if (langSort.length === 0) { @@ -1066,81 +1011,55 @@ const checkPropInfo = (info) => { // end } else { + + // 语言对应自己的自动位置 if (newInfo[key].multiLanguage) { - const urlSet = []; - for (let l = 0; l < newInfo[key].dataInfo.length; l++) { - let str = []; - let row = null; - let labelInfo = [] - if (newInfo[key].groupType === GroupTypeEnum.ICON) { - if (newInfo[key].dataInfo[l].url) { - newArr.push({...newInfo[key].dataInfo[l]}); - if (urlSet.includes(newInfo[key].dataInfo[l].url)) { - useMessage().notifyWarning(`${newInfo[key].groupName}中第${labelInfo.length + 1}项重复`) - that.errorList.push({ - key: `${key}_${l}`, - message: "数据重复" - }) - reject("数据重复") - return; - } - urlSet.push(newInfo[key].dataInfo[l].url) - } else { - // 组合语言 - for (let i1 = 1; i1 < newInfo[key].dataInfo.length; i1++) { - if (newInfo[key].dataInfo[l].locale === newInfo[key].dataInfo[i1].locale && !newInfo[key].dataInfo[l].url) { - str.push(newInfo[key].dataInfo[i1].label) - row = { - ...newInfo[key].dataInfo[i1], - url: '' - }; + if (newInfo[key].groupType === GroupTypeEnum.ICON) { + const infoList = washingInfoListByType(newInfo[key].groupType) + const infos = newInfo[key].dataInfo; + for (let j = 1; j < infos.length; j++) { + outerLoop: for (let i = 0; i < infoList.length; i++) { + const row1 = infoList[i]; + for (let k = 0; k < row1.langMapping.length; k++) { + // 跳过icon 类型，因为没有url + if (infos[j].locale === row1.langMapping[k].locale) { + infos[j].label = row1.langMapping[k].value + break outerLoop; + } } } - - } - } else { - for (let i1 = 0; i1 < newInfo[key].dataInfo.length; i1++) { - if (firstLang === newInfo[key].dataInfo[i1].locale && newInfo[key].dataInfo[i1].showLabel) { - if (labelInfo.includes(newInfo[key].dataInfo[i1].showLabel)) { - useMessage().notifyError(`${newInfo[key].groupName}中第${labelInfo.length + 1}项重复`); - that.errorList.push({ - key: `${key}_${i1}`, - message: "数据重复" - }) - reject("数据重复") - return - } - labelInfo.push(newInfo[key].dataInfo[i1].showLabel) - } - if (newInfo[key].dataInfo[i1].locale === allLang[l] && newInfo[key].dataInfo[i1].showLabel) { - str.push(newInfo[key].dataInfo[i1].label) - if (!row) { - row = { - ...newInfo[key].dataInfo[i1], - url: '' - }; + } + console.log("newArr33",infos) + newInfo[key].dataInfo = infos; + break; + }else { + const infoList = washingInfoListByType(newInfo[key].groupType) + const infos = newInfo[key].dataInfo; + for (let j = 0; j < infos.length; j++) { + outerLoop: for (let i = 0; i < infoList.length; i++) { + const row1 = infoList[i]; + for (let k = 0; k < row1.langMapping.length; k++) { + // 跳过icon 类型，因为没有url + if (infos[j].locale === row1.langMapping[k].locale) { + infos[j].label = row1.langMapping[k].value + break outerLoop; } } } } - if (row) { - row.label = str.join(linkChar); - newArr.push(row); - } + console.log("newArr33",infos) + newInfo[key].dataInfo = infos; + break; } - console.log("newArr", newArr) - newInfo[key].dataInfo = newArr; - } else { - // 语言组合成一句话 + // 多种语言组合成一句话 // 文本类型处理 if (newInfo[key].groupType === GroupTypeEnum.TEXT) { let langSort = newInfo[key].langSort || []; if (langSort.length === 0) { langSort = allLang } - let mergeLabel = []; for (let j = 0; j < langSort.length; j++) { const labelInfo = [] @@ -1217,10 +1136,17 @@ const checkPropInfo = (info) => { // 查询所有的icon const dis = []; + const allDataList = []; + let firstLabel = '' + for (let i = 0; i < keys.length; i++) { const tmpKey2 = keys[i] if (that.propInfo[tmpKey2].groupType === GroupTypeEnum.ICON) { + if (that.propInfo[tmpKey2].dataInfo[0].showLabel) { + if (!firstLabel) { + firstLabel = that.propInfo[tmpKey2].dataInfo[0].showLabel + } if (dis.includes(that.propInfo[tmpKey2].dataInfo[0].showLabel)) { useMessage().notifyError(`${that.propInfo[tmpKey2].groupName}中第${i + 1}项重复`); that.errorList.push({ @@ -1232,7 +1158,7 @@ const checkPropInfo = (info) => { } dis.push(that.propInfo[keys[i]].dataInfo[0].showLabel) } - + allDataList.push(that.propInfo[keys[i]].dataInfo[0]) } } const infoList = washingInfoListByType(newInfo[key].groupType) @@ -1272,17 +1198,16 @@ const checkPropInfo = (info) => { } } } + console.log("firstLabel", firstLabel) const mergeLabelStr = mergeLabel.join(linkChar); console.log("组合的一句话", mergeLabelStr) // 其他的label 不显示 const newArr = cloneDeep(newInfo[key].dataInfo); + console.log("newArr", allDataList) let resArr = []; for (let j = 0; j < newArr.length; j++) { - // 如果没有选择的不显示 - if (newArr[j].label && newArr[j].showLabel) { - newArr[j].label = mergeLabelStr - resArr.push(newArr[j]) - } + newArr[j].label = mergeLabelStr + resArr.push(newArr[j]) } newInfo[key].dataInfo = resArr; } diff --git a/hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/DynamicPropConfig.vue b/hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/DynamicPropConfig.vue index a016906..92c5f49 100644 --- a/hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/DynamicPropConfig.vue +++ b/hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/DynamicPropConfig.vue @@ -104,20 +104,24 @@
勾选后语言匹配到对应位置上 - - - - 语言排序 +
+ + + + 语言排序 +
追加 diff --git a/hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/layout/LeftPanel.vue b/hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/layout/LeftPanel.vue index 075a2e7..630d146 100644 --- a/hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/layout/LeftPanel.vue +++ b/hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/layout/LeftPanel.vue @@ -86,12 +86,18 @@ @mousedown.stop="handlerAddNode($event,item)" >
- -
+ + +
{{ item.label }}
@@ -204,7 +210,25 @@ const showPanelList = computed(() => { return item.filterKeyword().toLowerCase().indexOf(layout.searchKeyword.toLowerCase()) !== -1 }) }) - +const placeholderItem = ()=>{ + return { + "key": "vue-node_shape_image", + "shape": "vue-node_shape_image", + "data": { + "label": "", + "width": 20, + "height": 20, + "shape": 10, + "style": { + "shape": { + "href": "" + } + } + }, + "icon": "http://m.silverprinting.com.hk/admin-api/admin-api/infra/file/23/get/92b64f8c3cf664a8e69312bf0777ebc2fa84dc55a078155ae64441d6b33585e1.png", + "label": "占位符" + } +} const imageList = computed(() => { return that.imageUrlList.filter(item => { @@ -225,30 +249,40 @@ const queryImage = async () => { that.imageUrlList = []; that.imageKeySet = []; for (let i = 0; i < data.list.length; i++) { - let config = JSON.parse(data.list[i].initData) - config.filterKeyword = function () { - return this.label - } - config.key = `${config.key}_${data.list[i].id}` - if (that.imageKeySet.includes(config.key)) { - continue; + const d = { + label: '', + filterKeyword:function () { + return this.label || '' + }, + ...JSON.parse(data.list[i].initData) } + that.imageUrlList.push(toShape(data.list[i].id,d,domain)) + } + console.log(toShape('1',placeholderItem(),domain)) + that.imageUrlList.unshift(toShape('1',placeholderItem(),domain)) + that.imgLoading = false + // that.imageUrlList = data.list +} +const toShape =(id,config,domain) =>{ + config.filterKeyword = function () { + return this.label || '' + } + config.key = `${config.key}_${id}` + if (!that.imageKeySet.includes(config.key)) { that.imageKeySet.push(config.key) // 替换域名 config.icon = replaceDomain(domain, config.icon) config.data.style.shape.href = replaceDomain(domain, config.data.style.shape.href) config.data.style.shape.label= config.label - that.imageUrlList.push(config) } - that.imgLoading = false - // that.imageUrlList = data.list + return config } const allList = computed(() => { let arr = []; let typeSet = shapeList.value.map(item => {return item.shape}); for (let i = 0; i < layout.leftBtnList.length; i++) { - if (['shape_image', 'shape_set'].includes(layout.leftBtnList[i].key)) { + if (['shape_image', 'shape_set','vue-node_shape_image_Placeholder'].includes(layout.leftBtnList[i].key)) { continue; } if(typeSet.includes(layout.leftBtnList[i].shape)){ @@ -370,6 +404,27 @@ const layout = reactive({ return this.label } }, + { + shape: ShapeType.vueShapeImage, + "key": "vue-node_shape_image_Placeholder", + "data": { + "label": "", + "width": 20, + "height": 20, + "shape": 10, + "style": { + "shape": { + "href": "", + "label": "" + } + } + }, + icon: "http://m.silverprinting.com.hk/admin-api/admin-api/infra/file/23/get/92b64f8c3cf664a8e69312bf0777ebc2fa84dc55a078155ae64441d6b33585e1.png", + label: 'Placeholder占位符', + filterKeyword: function () { + return this.label + } + }, ] }) onMounted(() => { diff --git a/hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/layout/index.vue b/hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/layout/index.vue index 3799b28..af4c67c 100644 --- a/hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/layout/index.vue +++ b/hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/layout/index.vue @@ -1062,7 +1062,6 @@ const fontFamilyList = computed(() => { icon: 'font-FangSong', label: '仿宋' }, - { value: '黑体', icon: 'font-SimHei', @@ -1143,62 +1142,30 @@ const fontSizeList = computed(() => { const arr = [{ value: 2, label: `2` + },{ + value: 3, + label: `3` }] let i = 4; - while (i < 20) { - i += 2 - arr.push({ - value: i, - label: `${i}` - }) - } - while (i < 80) { - i += 4 - arr.push({ - value: i, - label: `${i}` - }) - } - while (i < 100) { - i += 8 - arr.push({ - value: i, - label: `${i}` - }) - } - while (i < 200) { - i += 20 - arr.push({ - value: i, - label: `${i}` - }) - } - while (i < 300) { - i += 40 - arr.push({ - value: i, - label: `${i}` - }) - } - while (i < 500) { - i += 80 + while (i < 600) { + i ++ arr.push({ value: i, label: `${i}` }) } + return arr }) const sizeModeList = [ - { - value: '15_50', - label: '洗水唛15 *50' + { + value: '30_100', + label: '洗水唛30 *10' }, { - value: '20_50', - label: '洗水唛20 *50' + value: '62_100', + label: '洗水唛62 *100' }, - { value: '75_100', label: '吊牌75 *50' @@ -1211,10 +1178,6 @@ const sizeModeList = [ value: '200_200', label: 'LOGO设计200 * 200' }, - { - value: '200_200', - label: 'LOGO设计200 * 200' - }, { value: '90_54', label: '名片90 * 54' @@ -1273,18 +1236,18 @@ const that = reactive({ color: '' }, editArea: { - width: 100, - height: 300, + width: 30, + height: 100, } }, cellInfo: { size: { - width: 100, - height: 300, + width: 30, + height: 100, }, data: {} }, - testFontSizeVal: 12, + testFontSizeVal: 10, btnState: { canUndo: false, canRedo: false, diff --git a/hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/node/ShapeImageNode.vue b/hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/node/ShapeImageNode.vue index 7db4643..5549ce6 100644 --- a/hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/node/ShapeImageNode.vue +++ b/hangtag-ui/hangtag-ui-admin/src/components/DraftDesign/components/node/ShapeImageNode.vue @@ -3,12 +3,15 @@
-