固定列更新

src/views/Need/components/EditView.vue

@@ -1,9 +1,8 @@
 <template>
 	<lay-container fluid="true" class="content-box">
 		<FormulaView :teamId="dataInfoObj.FTeamID" :halfId="dataInfoObj.FMaterialHalfIDs"></FormulaView>		
-		
-		<lay-layer area="90%" v-model="showFreezingColumnSettingBox" title="固定列设置">
-			<FreezingColumnSetting v-if="showFreezingColumnSettingBox" :columns="tmpDataColumn" :freezingColumns="freezingColumnSetting" @cancelClick="setFreezingColumnsSetting"></FreezingColumnSetting>
+		<lay-layer area="90%" v-model="showFreezingColumnSettingBox" title="固定列设置" :end="closeFreezingSetting">
+			<FreezingColumnSetting v-if="showFreezingColumnSettingBox" :columns="originalColumns" :freezingColumns="freezingColumnSetting" @cancelClick="setFreezingColumnsSetting"></FreezingColumnSetting>
 		</lay-layer>
 		<lay-table id="dataTable" v-if="dataColumn.length>0" height="320px" :columns="dataColumn"
 				   :data-source="dataList" :cellStyle="cellStyle" :cellClassName="cellClassName">
@@ -141,6 +140,7 @@
 			};
 			const showFreezingColumnSettingBox = ref(false);
 			const freezingColumnSetting = ref([]);
+			const originalColumns = ref([]);
 			const tmpDataColumn = ref([]);
 			return {
 				dataColumn,
@@ -159,6 +159,7 @@
 				changeVisible2,
 				showFreezingColumnSettingBox,
 				freezingColumnSetting,
+				originalColumns,
 				tmpDataColumn
 			};
 		},
@@ -269,6 +270,7 @@
 				this.editColumn = editColumn;
 				this.dataList = _data.rows;
 				this.dataColumn = dataColumn;
+				this.originalColumns = this.deepCopy(dataColumn);
 
 				setTimeout(function() {
 					layer.close(idx);
@@ -358,52 +360,42 @@
 				}
 			},
 			_clickFreezingColumnSetting() {
-				this.tmpDataColumn = this.dataColumn;
 				this.dataColumn = ref([]);
 				this.showFreezingColumnSettingBox = true;
-				console.log('before', this.tmpDataColumn);
 			},
 			setFreezingColumns() {
+				this.tmpDataColumn = this.deepCopy(this.originalColumns);
 				let freezingColumns = [];
 				if (this.freezingColumnSetting && this.freezingColumnSetting.length > 0) {
 					this.freezingColumnSetting.forEach(column => {
 						let colIndex = this.tmpDataColumn.findIndex(d => d.key === column);
 						if (colIndex >= 0) {
-							let proxyFc = this.tmpDataColumn.splice(colIndex, 1)[0];
-							const {proxy, revoke} = Proxy.revocable(proxyFc, {});
-							const fc = {...proxy};
-							revoke();
-							console.log('fc', fc);
+							let fc = this.tmpDataColumn.splice(colIndex, 1)[0];
 							if (fc) {
 								fc.fixed = "left";
 								freezingColumns.push(fc);
 							}
 						}
 					})
-				}
-
-				if (freezingColumns && freezingColumns.length > 0) {
-					for(let i=freezingColumns.length-1; i>=0; i--) {
-						this.tmpDataColumn.unshift(freezingColumns[i]);
-					}
 
-					// freezingColumns = freezingColumns.concat(this.tmpDataColumn);
-					this.dataColumn = this.tmpDataColumn;
-					console.log('after', this.dataColumn);
+					this.dataColumn = freezingColumns.concat(this.tmpDataColumn);
 				} else {
 					this.dataColumn = this.tmpDataColumn;
 				}
 			},
 			setFreezingColumnsSetting(fcs) {
-				if (fcs && fcs.length > 0) {
 				this.freezingColumnSetting = fcs;
-					// this.freezingColumnSetting = ["FTestCode", "FMaterialGroup", "FWorkCenter"];
-					this.setFreezingColumns();
+				if (fcs && fcs.length > 0) {
 				} else {
-					this.dataColumn = this.tmpDataColumn;
+					this.dataColumn = this.originalColumns;
 				}
-				
 				this.showFreezingColumnSettingBox = false;
+			},
+			closeFreezingSetting() {
+				this.setFreezingColumns();
+			},
+			deepCopy(arr) {
+				return JSON.parse(JSON.stringify(arr))
 			}
 		}
 	}

src/views/Need/components/FreezingColumnSetting.vue

@@ -47,10 +47,10 @@
         methods: {
             initPage() {
                 this.columnList = this.columns;
-                this.checkedItem = this.freezingColumns
+                this.checkedItem = this.freezingColumns.concat();
             },
             cancelClick() {
-                this.$emit('cancelClick');
+                this.$emit('cancelClick', this.freezingColumns);
             },
             submitClick() {
                 this.$emit('cancelClick', this.checkedItem);