质量目标分配优化

src/views/quality/qcGoal/distribution.vue

@@ -1,17 +1,12 @@
 <template>
-  <el-dialog 
-    :title="title"
-    :visible.sync="showFlag" 
-    width="1000px" 
-    append-to-body
-    >
+  <div>
 		<el-form ref="form1" label-width="80px">
 			<el-form-item label="目标id" prop="belongGoalId">
 				<el-input v-model="belongGoalId" disabled />
 			</el-form-item>
 		</el-form>
 		<el-tabs type="border-card" v-if="belongGoalId != null">
-				<el-tab-pane :label="title">
+			<el-tab-pane :label="disTitle">
         <div>
           <div class="query">
             <el-input
@@ -74,7 +69,6 @@
               :disabled="LNextPage > LPages"
               >下一页</el-button
             >
-
             <!-- 右侧栏分页 -->
             <el-button
               type="text"
@@ -116,11 +110,7 @@
         </div>
       </el-tab-pane>
 		</el-tabs>
-			<div slot="footer" class="dialog-footer">
-				<el-button type="primary" @click="submitForm">确 定</el-button>
-				<el-button @click="cancel">取 消</el-button>
 	</div>
-		</el-dialog>
 </template>
 
 <script>
@@ -128,7 +118,7 @@ import { getLeftList, getRightList, addSupplier, getProductLeftList, getProductR
 
 export default {
   name: "QcGoalDistriBute",
-
+  props: ['belongGoalId','mode','disTitle'],
   data() {
     return {
       // 遮罩层
@@ -200,12 +190,23 @@ export default {
       },
     };
   },
-  props: {
-    belongGoalId:undefined,
-
+  mounted() {  
+    if (this.belongGoalId) { 
+      this.getList();
+      this.getRightListFun();
+    }  
   },
   created() {
     
+  },
+  watch: {
+    belongGoalId(newVal,oldVal) {
+      console.log(newVal);
+      if(newVal !== oldVal) {
+        this.getList();
+        this.getRightListFun();
+      }
+    }
   },
   methods: {
     // // 穿梭框搜索
@@ -222,7 +223,7 @@ export default {
     getList() {
       this.loading = true;
       this.leftQueryParams.belongGoalId = this.belongGoalId;
-      if(this.model) {
+      if(this.mode) {
         getLeftList(this.leftQueryParams).then((response) => {
           this.LPages = Math.ceil(response.total / this.LPageSize);
           this.leftList = response.rows;
@@ -262,7 +263,7 @@ export default {
     getRightListFun() {
       this.loading = true;
       this.rightQueryParams.belongGoalId = this.belongGoalId;
-      if(this.model) {
+      if(this.mode) {
         getRightList(this.rightQueryParams).then((response) => {
           this.RPages = Math.ceil(response.total / this.RPageSize);
           let dataright = [];
@@ -306,11 +307,6 @@ export default {
       this.getRightListFun();
     },
 
-    // 取消按钮
-    cancel() {
-      this.showFlag = false;
-      this.reset();
-    },
     // 表单重置
     reset() {
       this.form = {
@@ -348,11 +344,6 @@ export default {
         
       });
     },
-    /** 提交 */
-    submitForm() {
-			this.showFlag = false;
-			this.getList();
-		},
   },
 };
 </script>

src/views/quality/qcGoal/index.vue

@@ -282,8 +282,17 @@
 				<el-button type="primary" @click="closeGen">确定</el-button>
 			</div>
 		</el-dialog>
-
-		<Distribution ref="itemDistribution" :belongGoalId="goalId"  ></Distribution>
+		<el-dialog :title="disTitle" :visible.sync="showFlag" width="1000px" append-to-body >
+			<Distribution ref="itemDistribution" 
+				:belongGoalId="belongGoalId"
+				:mode="mode"
+				:disTitle="disTitle"
+				v-if="belongGoalId !== null"
+			></Distribution>
+			<div slot="footer" class="dialog-footer">
+				<el-button type="primary" @click="closeDistribution">确 定</el-button>
+			</div>
+		</el-dialog>
 	</div>
 </template>
 
@@ -318,7 +327,10 @@ export default {
 			checkTypes: [],
 			genList: [],
 			checked: false,
-			goalId: null,
+			belongGoalId: null,
+			showFlag: false,
+			mode: null,
+			disTitle: "",
 			// 弹出层标题
 			title: "",
 			genTitle: "",
@@ -524,20 +536,21 @@ export default {
     		return checkTypeBody ? checkTypeBody.checkName : '';
 		},
 		handleSupplier(row) {
-			this.goalId = row.id;
-			this.$refs.itemDistribution.model = true;
-			this.$refs.itemDistribution.getRightListFun();
-			this.$refs.itemDistribution.getList();
-			this.$refs.itemDistribution.title = "分配供应商";
-			this.$refs.itemDistribution.showFlag = true;
+			this.belongGoalId = row.id;
+			this.mode = true;
+			this.disTitle = "分配供应商";
+			this.showFlag = true;
 		},
 		handleProduct(row) {
-			this.goalId = row.id;
-			this.$refs.itemDistribution.model = false;
-			this.$refs.itemDistribution.getRightListFun();
-			this.$refs.itemDistribution.getList();
-			this.$refs.itemDistribution.title = "分配产品";
-			this.$refs.itemDistribution.showFlag = true;
+			this.belongGoalId = row.id;
+			this.mode = false;
+			this.disTitle = "分配产品";
+			this.showFlag = true;
+		},
+		closeDistribution() {
+			this.showFlag = false;
+			this.$refs.itemDistribution.leftList=[];
+			this.$refs.itemDistribution.rightList=[];
 		},
 
 	},