质量目标分配优化

src/views/quality/qcGoal/distribution.vue

@@ -1,126 +1,116 @@
 <template>
-  <el-dialog 
+  <div>
-    :title="title"
+		<el-form ref="form1" label-width="80px">
-    :visible.sync="showFlag" 
+			<el-form-item label="目标id" prop="belongGoalId">
-    width="1000px" 
+				<el-input v-model="belongGoalId" disabled />
-    append-to-body
+			</el-form-item>
-    >
+		</el-form>
-			<el-form ref="form1" label-width="80px">
+		<el-tabs type="border-card" v-if="belongGoalId != null">
-				<el-form-item label="目标id" prop="belongGoalId">
+			<el-tab-pane :label="disTitle">
-					<el-input v-model="belongGoalId" disabled />
+        <div>
-				</el-form-item>
+          <div class="query">
-			</el-form>
+            <el-input
-			<el-tabs type="border-card" v-if="belongGoalId != null">
+              style="width: 351px; margin-bottom: 10px"
-				<el-tab-pane :label="title">
+              v-model="leftQueryParams.supplierName"
-          <div>
+              placeholder="请输入内容"
-            <div class="query">
+              clearable
-              <el-input
+              @keyup.enter.native="handleQuery"
-                style="width: 351px; margin-bottom: 10px"
+            />
-                v-model="leftQueryParams.supplierName"
+            <el-input
-                placeholder="请输入内容"
+              style="width: 351px; margin-bottom: 10px"
-                clearable
+              v-model="rightQueryParams.supplierName"
-                @keyup.enter.native="handleQuery"
+              placeholder="请输入内容"
-              />
+              clearable
-              <el-input
+              @keyup.enter.native="handleQuery"
-                style="width: 351px; margin-bottom: 10px"
+            />
-                v-model="rightQueryParams.supplierName"
-                placeholder="请输入内容"
-                clearable
-                @keyup.enter.native="handleQuery"
-              />
-            </div>
-            <el-transfer
-              v-model="rightList"
-              :data="leftList"
-              :titles="titles"
-              :filterable="true"
-              @change="handleChange"
-            >
-              <!-- 左侧栏分页 -->
-              <el-button
-                type="text"
-                style="color: #606266"
-                v-if="leftLength != 0"
-                class="transfer-footer"
-                slot="left-footer"
-                size="small"
-                >共{{ Ltotal }}条</el-button
-              >
-              <el-button
-                v-if="leftLength != 0"
-                class="transfer-footer"
-                slot="left-footer"
-                size="small"
-                @click="leftPageNumChange"
-                :disabled="LPageNum - 1 < 1"
-                >上一页</el-button
-              >
-              <el-input
-                v-if="leftLength != 0"
-                v-model="LPageNum"
-                size="mini"
-                class="transfer-footer"
-                slot="left-footer"
-                :placeholder="LPageNum"
-                style="width: 67px; padding: 1px 3px"
-                disabled
-              ></el-input>
-              <el-button
-                class="transfer-footer"
-                slot="left-footer"
-                size="small"
-                @click="leftAddPageNumChange"
-                v-if="leftLength != 0"
-                :disabled="LNextPage > LPages"
-                >下一页</el-button
-              >
-
-              <!-- 右侧栏分页 -->
-              <el-button
-                type="text"
-                style="color: #606266"
-                v-if="rightLength != 0"
-                class="transfer-footer"
-                slot="right-footer"
-                size="small"
-                >共{{ Rtotal }}条</el-button
-              >
-              <el-button
-                v-if="rightLength != 0"
-                class="transfer-footer"
-                slot="right-footer"
-                size="small"
-                @click="rightPageNumChange"
-                :disabled="RPageNum - 1 < 1"
-                >上一页</el-button
-              >
-              <el-input
-                v-if="rightLength != 0"
-                v-model="RPageNum"
-                size="mini"
-                class="transfer-footer"
-                slot="right-footer"
-                :placeholder="RPageNum"
-                style="width: 43px"
-              ></el-input>
-              <el-button
-                class="transfer-footer"
-                slot="right-footer"
-                size="small"
-                @click="rightAddPageNumChange"
-                v-if="rightLength != 0"
-                :disabled="RNextPage > RPages"
-                >下一页</el-button
-              >
-            </el-transfer>
           </div>
-        </el-tab-pane>
+          <el-transfer
-			</el-tabs>
+            v-model="rightList"
-			<div slot="footer" class="dialog-footer">
+            :data="leftList"
-				<el-button type="primary" @click="submitForm">确 定</el-button>
+            :titles="titles"
-				<el-button @click="cancel">取 消</el-button>
+            :filterable="true"
-			</div>
+            @change="handleChange"
-		</el-dialog>
+          >
+            <!-- 左侧栏分页 -->
+            <el-button
+              type="text"
+              style="color: #606266"
+              v-if="leftLength != 0"
+              class="transfer-footer"
+              slot="left-footer"
+              size="small"
+              >共{{ Ltotal }}条</el-button
+            >
+            <el-button
+              v-if="leftLength != 0"
+              class="transfer-footer"
+              slot="left-footer"
+              size="small"
+              @click="leftPageNumChange"
+              :disabled="LPageNum - 1 < 1"
+              >上一页</el-button
+            >
+            <el-input
+              v-if="leftLength != 0"
+              v-model="LPageNum"
+              size="mini"
+              class="transfer-footer"
+              slot="left-footer"
+              :placeholder="LPageNum"
+              style="width: 67px; padding: 1px 3px"
+              disabled
+            ></el-input>
+            <el-button
+              class="transfer-footer"
+              slot="left-footer"
+              size="small"
+              @click="leftAddPageNumChange"
+              v-if="leftLength != 0"
+              :disabled="LNextPage > LPages"
+              >下一页</el-button
+            >
+            <!-- 右侧栏分页 -->
+            <el-button
+              type="text"
+              style="color: #606266"
+              v-if="rightLength != 0"
+              class="transfer-footer"
+              slot="right-footer"
+              size="small"
+              >共{{ Rtotal }}条</el-button
+            >
+            <el-button
+              v-if="rightLength != 0"
+              class="transfer-footer"
+              slot="right-footer"
+              size="small"
+              @click="rightPageNumChange"
+              :disabled="RPageNum - 1 < 1"
+              >上一页</el-button
+            >
+            <el-input
+              v-if="rightLength != 0"
+              v-model="RPageNum"
+              size="mini"
+              class="transfer-footer"
+              slot="right-footer"
+              :placeholder="RPageNum"
+              style="width: 43px"
+            ></el-input>
+            <el-button
+              class="transfer-footer"
+              slot="right-footer"
+              size="small"
+              @click="rightAddPageNumChange"
+              v-if="rightLength != 0"
+              :disabled="RNextPage > RPages"
+              >下一页</el-button
+            >
+          </el-transfer>
+        </div>
+      </el-tab-pane>
+		</el-tabs>
+	</div>
 </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: {
+  mounted() {  
-    belongGoalId:undefined,
+    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>
-
+		<el-dialog :title="disTitle" :visible.sync="showFlag" width="1000px" append-to-body >
-		<Distribution ref="itemDistribution" :belongGoalId="goalId"  ></Distribution>
+			<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.belongGoalId = row.id;
-			this.$refs.itemDistribution.model = true;
+			this.mode = true;
-			this.$refs.itemDistribution.getRightListFun();
+			this.disTitle = "分配供应商";
-			this.$refs.itemDistribution.getList();
+			this.showFlag = true;
-			this.$refs.itemDistribution.title = "分配供应商";
-			this.$refs.itemDistribution.showFlag = true;
 		},
 		handleProduct(row) {
-			this.goalId = row.id;
+			this.belongGoalId = row.id;
-			this.$refs.itemDistribution.model = false;
+			this.mode = false;
-			this.$refs.itemDistribution.getRightListFun();
+			this.disTitle = "分配产品";
-			this.$refs.itemDistribution.getList();
+			this.showFlag = true;
-			this.$refs.itemDistribution.title = "分配产品";
+		},
-			this.$refs.itemDistribution.showFlag = true;
+		closeDistribution() {
+			this.showFlag = false;
+			this.$refs.itemDistribution.leftList=[];
+			this.$refs.itemDistribution.rightList=[];
 		},
 
 	},