From 401235059061aa567555a391ad4c28c9d6a21f91 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=99=88=E8=A3=95=E8=B4=A2?= <cyc58469@163.com>
Date: Thu, 19 Jan 2023 20:24:32 +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

---
 .../core/components/MdpSelectUserXm/index.vue |  41 ++-
 .../core/xmGroup/XmGroupSelectForProduct.vue  | 293 ++++++++++++++++++
 ...Select.vue => XmGroupSelectForProject.vue} |  16 +-
 3 files changed, 317 insertions(+), 33 deletions(-)
 create mode 100644 src/views/xm/core/xmGroup/XmGroupSelectForProduct.vue
 rename src/views/xm/core/xmGroup/{XmGroupSelect.vue => XmGroupSelectForProject.vue} (95%)

diff --git a/src/views/xm/core/components/MdpSelectUserXm/index.vue b/src/views/xm/core/components/MdpSelectUserXm/index.vue
index 3d2fd721..fa661dff 100644
--- a/src/views/xm/core/components/MdpSelectUserXm/index.vue
+++ b/src/views/xm/core/components/MdpSelectUserXm/index.vue
@@ -23,7 +23,10 @@
                       <el-select v-model="myVal" @change="onSelectChange" :clearable="clearable" filterable value-key="userid" @visible-change="$emit('visible-change',$event)" @focus="$emit('focus',$event)" @blur="$emit('blur',$event)" @clear="$emit('blur',$event)" @click="$emit('click',$event)">  
                             
                             <el-option :value="myVal" disabled v-if="users && users.length>10">
-                                <el-row ><el-button v-if="users && users.length>0" :type="deptUserVisible?'':'primary'" @click.stop="deptUserVisible=false">常用用户</el-button> <el-button :type="deptUserVisible?'primary':''"  @click.stop="deptUserVisible=true">部门用户</el-button><el-button v-if="projectId" :type="projectVisible?'primary':''"  @click.stop="projectVisible=true">项目组</el-button> </el-row>
+                                <el-row ><el-button v-if="users && users.length>0" :type="deptUserVisible?'':'primary'" @click.stop="deptUserVisible=false">常用用户</el-button> <el-button :type="deptUserVisible?'primary':''"  @click.stop="deptUserVisible=true">部门用户</el-button>
+                                  <el-button v-if="projectId" :type="projectVisible?'primary':''"  @click.stop="projectVisible=true">项目组</el-button> 
+                                  <el-button v-if="productId" :type="productVisible?'primary':''"  @click.stop="productVisible=true">产品组</el-button> 
+                                </el-row>
                             </el-option>
                             <el-option class="avatar-container" v-for="(item,index) in users" :key="index" :value="item" :label="item.username">  
                             
@@ -45,12 +48,15 @@
                   </div>
 						</div> 
             <el-dialog v-if="disabled!==true" :visible.sync="deptUserVisible" append-to-body top="20px" width="60%">
-               <users-select :visible="deptUserVisible" :isSingleUser="true"  :isSelectByDept="true" @confirm="onConfirmUsers"></users-select>
+               <users-select :visible="deptUserVisible" :isSingleUser="true"  :isSelectByDept="true" @confirm="onTeamUsersConfirm"></users-select>
             </el-dialog>
             
             <el-dialog v-if="disabled!==true" :visible.sync="projectVisible" append-to-body top="20px" width="60%">
-               <xm-group-select :sel-project="{id:projectId}" :xm-product="{id:productId}" :isSelectSingleUser="true" @user-confirm="onProjectUsersConfirm"></xm-group-select>
-            </el-dialog>
+               <xm-group-select-for-project :sel-project="projectId?{id:projectId}:null" :isSelectSingleUser="true" @user-confirm="onTeamUsersConfirm"></xm-group-select-for-project>
+            </el-dialog> 
+            <el-dialog v-if="disabled!==true" :visible.sync="projectVisible" append-to-body top="20px" width="60%">
+               <xm-group-select-for-product :xm-product="productId?{id:productId}:null" :isSelectSingleUser="true" @user-confirm="onTeamUsersConfirm"></xm-group-select-for-product>
+            </el-dialog> 
     </el-row>
   </template>
   
@@ -58,13 +64,14 @@
   
   import util  from '@/common/js/util';//全局公共库
   import UsersSelect from '@/views/mdp/sys/user/UsersSelectOnly.vue'
-  import XmGroupSelect from '@/views/xm/core/xmGroup/XmGroupSelect.vue'
+  import XmGroupSelectForProject from '@/views/xm/core/xmGroup/XmGroupSelectForProject.vue'
+  import XmGroupSelectForProduct from '@/views/xm/core/xmGroup/XmGroupSelectForProduct.vue'
   var us=localStorage.getItem("mdp-his-users") 
   import imtUtil  from '@/api/imgUtil';//全局公共库
   var users=us?JSON.parse(us):[] 
   export default {
     name: 'mdp-select-user-xm',
-    components: { UsersSelect, XmGroupSelect },
+    components: { UsersSelect, XmGroupSelectForProject,XmGroupSelectForProduct },
     computed: { 
       avaterCpd(){  
         
@@ -108,6 +115,7 @@
             users:[],
             deptUserVisible:false,
             projectVisible:false,
+            productVisible:false,
         }
     },
     watch:{ 
@@ -237,25 +245,11 @@
         onChange(data){   
           this.$emit('change',data)
         },
-        onProjectUsersConfirm(users){
+        onTeamUsersConfirm(users){
           this.onChange(users)
           this.myVal=users[0]
           this.projectVisible=false;
-          var notHad=false;
-           users.forEach(u=>{
-					 if(!this.users.some(k=>k.userid==u.userid)){
-						 notHad=true;
-						 this.users.unshift(u)
-					 }
-				 })
-				 if(notHad){ 
-					 var us=JSON.stringify(this.users)
-				 	localStorage.setItem("mdp-his-users",us)
-				 }
-        },
-        onConfirmUsers(users){ 
-          this.onChange(users)
-          this.myVal=users[0]
+          this.productVisible=false; 
           this.deptUserVisible=false;
           var notHad=false;
            users.forEach(u=>{
@@ -268,7 +262,8 @@
 					 var us=JSON.stringify(this.users)
 				 	localStorage.setItem("mdp-his-users",us)
 				 }
-        }
+        },
+         
     },
     mounted(){  
 			this.users=users
diff --git a/src/views/xm/core/xmGroup/XmGroupSelectForProduct.vue b/src/views/xm/core/xmGroup/XmGroupSelectForProduct.vue
new file mode 100644
index 00000000..5d70d9e5
--- /dev/null
+++ b/src/views/xm/core/xmGroup/XmGroupSelectForProduct.vue
@@ -0,0 +1,293 @@
+<template>
+	<section class="border padding-left">
+		<el-row class="padding-top"> 
+ 
+						<xm-product-select style="display:inline;" v-if="!xmProduct" :auto-select="false" :xm-product="xmProduct"  @row-click="onProductRowClick" @clear="onProductClose"></xm-product-select>
+ 
+							 
+					<el-button   type="primary" @click="userConfirm" icon="el-icon-finished">确认选择</el-button>  
+		</el-row>  
+		<el-row class="padding-top" v-loading="load.list" :style="{height:maxTableHeight+'px'}" ref="table">
+			<el-row v-for="(item,index) in xmGroupFormworkSels" :key="index"> 
+				<h3>
+					<div class="padding-top">{{item.groupName}}
+					</div> 
+				</h3>
+				<el-col :span="24" style="margin-left:30px;display:flex;flex-wrap: wrap;width:100%;">  
+					<div  :class="v.isSelected=='1'?'checkCopyButton':'copyButton'" v-for="(v,valueIndex) in item.groupUsers" :key="valueIndex" @click="toggleSelected(index,valueIndex)">
+							
+						
+						
+						<div class="avatar-container">
+							<div class="avatar-wrapper">
+								<img class="user-avatar" :src="getHeadimgurl(v.userid)" @error="onImgError(v.userid,$event)"></img>		
+								<span class="username">{{v.username}}</span>								
+							</div>
+						</div>
+						
+					</div>  
+				</el-col>
+			</el-row>
+		</el-row>   
+	</section>
+</template>
+
+<script>
+	import util from '@/common/js/util'; //全局公共库
+	import imgUtil from '@/api/imgUtil';
+	//import Sticky from '@/components/Sticky' // 粘性header组件
+	import { initSimpleDicts } from '@/api/mdp/meta/item';//下拉框数据查询
+   	import {  getGroups } from '@/api/xm/core/xmGroup';
+   	import XmProductSelect from '@/views/xm/core/components/XmProductSelect';
+
+	import {mapGetters} from 'vuex'  
+
+	export default {
+		computed: {
+			...mapGetters([
+				'userInfo','userInfo','roles'
+			])
+		},
+		//
+		props: ['visible','isSelectSingleUser','isSelectMultiUser','xmProduct'],
+		watch: {
+			"selGroups": function(selGroups) {
+				if(this.selGroups){
+					this.selGroups.forEach(i=>{
+						if(i.groupUsers){
+							i.groupUsers.forEach(k=>k.isSelected="0")
+						} 
+					})
+					this.xmGroupFormworkSels = JSON.parse(JSON.stringify(this.selGroups));
+				}else{ 
+					this.xmGroupFormworkSels = [];
+				}
+				// this.applyData();
+			},
+			'visible': function(visible) {
+				if (visible == true) {
+					
+				}
+			},
+			xmProduct(xmProduct){
+				this.filters.xmProduct=xmProduct
+			}, 
+ 
+		},
+
+		data() {
+			return { 
+				filters: {
+					key: '', 
+					xmProduct:null,
+				},
+				selGroups:[],
+				load: {list: false,edit: false,del: false,add: false}, //查询中...
+				sels: [], //列表选中数据
+				dicts: {
+					productGroupType:[]
+				}, //下拉选择框的所有静态数据 params=[{categoryId:'0001',itemCode:'sex'}] 返回结果 {'sex':[{optionValue:'1',optionName:'男',seqOrder:'1',fp:'',isDefault:'0'},{optionValue:'2',optionName:'女',seqOrder:'2',fp:'',isDefault:'0'}]}
+
+				/**begin 自定义属性请在下面加 请加备注**/
+				xmGroupFormworkSels: [],
+				selectProductVisible:false, 
+				maxTableHeight:300,
+  				/**end 自定义属性请在上面加 请加备注**/
+			}
+		}, //end data
+		methods: {
+			...imgUtil,
+			toggleSelected(index,valueIndex) {
+				if(this.isSelectSingleUser=='1' || this.isSelectMultiUser=='1'){
+					if(this.xmGroupFormworkSels[index].groupUsers[valueIndex].isSelected == '1'){
+						this.xmGroupFormworkSels[index].groupUsers[valueIndex].isSelected ='0'
+					}else{
+						this.xmGroupFormworkSels[index].groupUsers[valueIndex].isSelected ='1'
+					}
+				}
+				
+			}, 
+			//确认项目团队组成员
+			groupConfirm(){
+				this.$emit("select-confirm",this.xmGroupFormworkSels);
+			},
+			userConfirm(){
+				var users=[];
+				this.xmGroupFormworkSels.forEach(i=>{
+					if(i.groupUsers){
+						i.groupUsers.forEach(k=>{
+							if(k.isSelected=='1'){
+								users.push(k);
+							}
+						})
+					}
+				})
+
+				if(this.isSelectSingleUser=='1'){
+					if(users.length>1){
+						
+						this.$notify({position:'bottom-left',showClose: true,
+							message: '只能选中一个用户',
+							type: 'error'
+						});
+						return 
+					}
+				}
+				this.$emit("user-confirm",users);
+			},
+			getGroups(){
+				var params={};
+				if(this.filters.xmProduct){
+					params.productId=this.filters.xmProduct.id
+				}  
+				
+				if( !params.productId){ 
+					this.$notify({position:'bottom-left',showClose:true,message:'请选择产品',type:'warning'})
+				}
+				getGroups(params).then(res=>{
+					var tips = res.data.tips;
+					if(tips.isOk){
+						this.selGroups=res.data.data;
+					}else{
+						this.$notify({position:'bottom-left',showClose:true,message: tips.msg, type: 'error' });
+					}
+				})
+			},
+			
+			onProductRowClick:function(product){
+				this.filters.xmProduct=product 
+				this.selectProductVisible=false;
+				this.getGroups();
+			}, 
+			onProductClose(){
+				this.filters.xmProduct=null
+				this.getGroups();
+			}, 
+			/**end 自定义函数请在上面加**/
+
+		}, //end methods
+		components: {
+			
+			XmProductSelect			 
+		},
+		mounted() {
+			this.$nextTick(() => { 
+				this.maxTableHeight =  util.calcTableMaxHeight(this.$refs.table.$el);
+				if(this.selGroups){
+					this.selGroups.forEach(i=>{
+						if(i.groupUsers){
+							i.groupUsers.forEach(k=>k.isSelected="0")
+						} 
+					})
+					this.xmGroupFormworkSels = JSON.parse(JSON.stringify(this.selGroups));
+				}
+				if(this.xmProduct){
+					this.filters.xmProduct=this.xmProduct
+				} 
+				this.getGroups(); 
+			});
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+
+@import '@/components/Mdp/index.scss';
+.group-name{ 
+	color: rgb(107, 88, 88);
+}
+	.copyButton {
+		margin-left: 10px;
+		margin-top:2px;
+		border-radius: 20px;
+		padding: 2px 2px;  
+		border: 1px solid rgb(220, 223, 230);
+		/* color:#039; */
+	}
+
+	.copyButton:hover {
+		color: #409eff;
+		border-color: #c6e2ff;
+		background-color: #ecf5ff;
+		cursor: default;
+	}
+
+	.checkCopyButton {
+		/*color: #fff;*/
+		margin-left: 10px;
+		margin-top:2px;
+		border-radius: 20px;
+		padding: 2px 2px;  
+		border: 1px solid #FFA00A;
+		/*background-color: rgba(230, 162, 60, .1);*/
+		/* background-color: #f9f9f9; */
+		background-color: #fff;
+		/*border-color: rgba(230,162,60,.2);*/
+		color: #FFA00A;
+	}
+
+	.add {
+		display: flex;
+		align-items: center;
+		margin-left: 10px;
+		margin-top: 2px;
+	}
+
+	.add:hover {
+		cursor: pointer;
+		animation: myrotate 0.5s linear infinite;
+	}
+
+
+	.input-xmGroupFormwork {
+		margin-left:10px;
+		margin-top: 2px;
+		align-self: center;
+	}
+	.closeStyle {
+		padding: 1px;
+	}
+
+	.closeStyle:hover {
+		cursor: pointer;
+		/* border-color:#f40; */
+		/* border: 1px solid #f40; */
+		background-color: #FFA00A;
+		color: #fff;
+		border-radius: 50%;
+		padding: 1px;
+		animation: myrotate 1s linear;
+	}
+
+	.addXmGroupFormworkSquare {
+		width: 15px;
+		height: 15px;
+		display: inline-block;
+		background-color: #FFA00A;
+		animation: myrotate 2s linear infinite;
+	}
+
+	.closeXmGroupFormworkSquare {
+		width: 15px;
+		height: 15px;
+		display: inline-block;
+		background-color: #fff;
+		animation: myrotate 2s linear infinite;
+	}
+	@keyframes myrotate {
+		0% {
+			transform: rotate(0deg);
+			box-shadow: 0px 0px 10px #fff;
+		}
+
+		50% {
+			transform: rotate(180deg);
+			box-shadow: 0px 0px 45px #fff;
+		}
+
+		100% {
+			transform: rotate(360deg);
+			box-shadow: 0px 0px 10px #fff;
+		}
+	}
+</style>
diff --git a/src/views/xm/core/xmGroup/XmGroupSelect.vue b/src/views/xm/core/xmGroup/XmGroupSelectForProject.vue
similarity index 95%
rename from src/views/xm/core/xmGroup/XmGroupSelect.vue
rename to src/views/xm/core/xmGroup/XmGroupSelectForProject.vue
index 5635b682..1a4a0470 100644
--- a/src/views/xm/core/xmGroup/XmGroupSelect.vue
+++ b/src/views/xm/core/xmGroup/XmGroupSelectForProject.vue
@@ -40,8 +40,7 @@
    	import {  getGroups } from '@/api/xm/core/xmGroup';
    	import XmProjectSelect from '@/views/xm/core/components/XmProjectSelect';
 
-	import {mapGetters} from 'vuex' 
-import XmProductSelect from '@/views/xm/core/components/XmProductSelect.vue'
+	import {mapGetters} from 'vuex'  
 
 	export default {
 		computed: {
@@ -50,7 +49,7 @@ import XmProductSelect from '@/views/xm/core/components/XmProductSelect.vue'
 			])
 		},
 		//
-		props: ['visible','selProject','isSelectSingleUser','isSelectMultiUser','xmProduct'],
+		props: ['visible','selProject','isSelectSingleUser','isSelectMultiUser'],
 		watch: {
 			"selGroups": function(selGroups) {
 				if(this.selGroups){
@@ -80,8 +79,7 @@ import XmProductSelect from '@/views/xm/core/components/XmProductSelect.vue'
 			return { 
 				filters: {
 					key: '',
-					selProject:null,
-					xmProduct:null,
+					selProject:null, 
 				},
 				selGroups:[],
 				load: {list: false,edit: false,del: false,add: false}, //查询中...
@@ -92,8 +90,7 @@ import XmProductSelect from '@/views/xm/core/components/XmProductSelect.vue'
 
 				/**begin 自定义属性请在下面加 请加备注**/
 				xmGroupFormworkSels: [],
-				selectProjectVisible:false,
-				selectProductVisible:false,
+				selectProjectVisible:false, 
 				maxTableHeight:300,
   				/**end 自定义属性请在上面加 请加备注**/
 			}
@@ -158,8 +155,7 @@ import XmProductSelect from '@/views/xm/core/components/XmProductSelect.vue'
 			},
 			
 			onProjectRowClick:function(project){
-				this.filters.selProject=project
-				this.filters.xmProduct=null;
+				this.filters.selProject=project 
 				this.selectProjectVisible=false;
 				this.getGroups();
 			}, 
@@ -172,7 +168,7 @@ import XmProductSelect from '@/views/xm/core/components/XmProductSelect.vue'
 		}, //end methods
 		components: {
 			
-			XmProjectSelect,XmProductSelect			 
+			XmProjectSelect  
 		},
 		mounted() {
 			this.$nextTick(() => {