315 lines
		
	
	
		
			7.7 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
			
		
		
	
	
			315 lines
		
	
	
		
			7.7 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
| <template>
 | ||
|   <ai-detail>
 | ||
|     <ai-title slot="title" title="三会一课设置" isShowBack @onBackClick="$parent.goBack()" isShowBottomBorder/>
 | ||
|     <template #content>
 | ||
|       <div class="tab-tips">
 | ||
|         <span class="el-icon-warning"/>
 | ||
|         <span class="text">未按照“会议要求”开展三会一课的情况下,支部负责人主要用于接收上级领导的催办消息。</span>
 | ||
|       </div>
 | ||
|       <ai-card title="基本信息">
 | ||
|         <template #content>
 | ||
|           <ai-wrapper>
 | ||
|             <ai-info-item label="党组织" :value="partyName"/>
 | ||
|           </ai-wrapper>
 | ||
| 
 | ||
|         </template>
 | ||
|       </ai-card>
 | ||
|       <ai-card title="支部负责人">
 | ||
|         <template #right>
 | ||
|           <ai-party-member :instance="instance" v-model="peopleList"
 | ||
|                             :action="'/app/appparty/list?partyOrgId='+partyId" @change="confirmAddUser"
 | ||
|                             dialogTitle="添加支部负责人" customCliker>
 | ||
|             <el-button type="text" icon="iconfont iconAdd">添加人员</el-button>
 | ||
|           </ai-party-member>
 | ||
|         </template>
 | ||
|         <template #content>
 | ||
|           <el-table
 | ||
|               :key='0'
 | ||
|               :data="tableDataUser"
 | ||
|               style="width: 100%"
 | ||
|               border
 | ||
|               header-cell-class-name="table-header"
 | ||
|               empty-text="支部负责人信息为空,点击标题右侧添加按钮进行添加"
 | ||
|           >
 | ||
|             <el-table-column type="index" label="序号" align="center" width="240"></el-table-column>
 | ||
|             <el-table-column prop="partyName" label="姓名" align="center"></el-table-column>
 | ||
|             <el-table-column label="操作" align="center">
 | ||
|               <div slot-scope="{row}">
 | ||
|                 <span @click="deleteUser(row)"
 | ||
|                       class="iconfont iconDelete icon-color89B"
 | ||
|                       title="删除"
 | ||
|                       style="cursor: pointer;"
 | ||
|                 />
 | ||
|               </div>
 | ||
|             </el-table-column>
 | ||
|           </el-table>
 | ||
|         </template>
 | ||
|       </ai-card>
 | ||
|       <ai-card title="三会一课要求">
 | ||
|         <template #content>
 | ||
|           <el-table
 | ||
|               :key='1'
 | ||
|               :data="tableDataRequirement"
 | ||
|               style="width: 100%"
 | ||
|               border
 | ||
|               header-cell-class-name="table-header"
 | ||
|               align="center"
 | ||
|               empty-text="三会一课要求为空"
 | ||
|           >
 | ||
|             <el-table-column prop="meetingClassification" label="类型">
 | ||
|               <div slot-scope="{row}">{{ dict.getLabel('meetingClassification', row.meetingClassification) || '-' }}
 | ||
|               </div>
 | ||
|             </el-table-column>
 | ||
|             <el-table-column prop="type" label="要求">
 | ||
|               <div slot-scope="{row}">{{ dict.getLabel('appThreeMeetingCTCType', row.type) || '-' }}</div>
 | ||
|             </el-table-column>
 | ||
|           </el-table>
 | ||
|         </template>
 | ||
|       </ai-card>
 | ||
|     </template>
 | ||
|   </ai-detail>
 | ||
| </template>
 | ||
| 
 | ||
| <script>
 | ||
| import {mapState} from "vuex";
 | ||
| 
 | ||
| export default {
 | ||
|   name: "meetingSet",
 | ||
|   props: {
 | ||
|     instance: Function,
 | ||
|     dict: Object,
 | ||
|     permissions: Function,
 | ||
|     detail: Object,
 | ||
|     partyId: String,
 | ||
|     partyName: String,
 | ||
|   },
 | ||
|   computed: {
 | ||
|     ...mapState(["user"])
 | ||
|   },
 | ||
|   data() {
 | ||
|     return {
 | ||
|       navList: [
 | ||
|         {name: "支部负责人", id: "1"},
 | ||
|         {name: "会议要求", id: "2"}
 | ||
|       ],
 | ||
|       navId: "1",
 | ||
|       tableDataUser: [],
 | ||
|       searchMsg: '',
 | ||
|       peopleList: [],
 | ||
|       chooseUser: [],
 | ||
|       tableDataRequirement: [],
 | ||
|     };
 | ||
|   },
 | ||
|   mounted() {
 | ||
|     console.log(this.user)
 | ||
|     this.dict.load('appThreeMeetingCTCType', 'meetingClassification')
 | ||
|     this.getPartyList()
 | ||
|     this.getRequirement()
 | ||
|   },
 | ||
|   methods: {
 | ||
|     navClick(item) {
 | ||
|       this.navId = item.id;
 | ||
|     },
 | ||
|     //获取支部负责人table
 | ||
|     getPartyList() {
 | ||
|       this.instance.post(`/app/appthreemeetingpartyconfig/list?organizationId=${this.partyId}`).then(res => {
 | ||
|         if (res.code == 0) {
 | ||
|           this.tableDataUser = res.data.records
 | ||
|           this.peopleList = res.data.records.map((item) => {
 | ||
|             return {
 | ||
|               partyOrgId: item.organizationId,
 | ||
|               id: item.partyId,
 | ||
|               name: item.partyName,
 | ||
|               phone: item.phone
 | ||
|             }
 | ||
|           })
 | ||
|           // this.$forceUpdate()
 | ||
|         }
 | ||
|       })
 | ||
|     },
 | ||
|     //获取会议要求列表
 | ||
|     getRequirement() {
 | ||
|       this.instance.post(`/app/appthreemeetingclassificationconfig/list`).then(res => {
 | ||
|         if (res.code == 0) {
 | ||
|           this.tableDataRequirement = res.data.records
 | ||
|         }
 | ||
|       })
 | ||
|     },
 | ||
|     //确认添加支部人员
 | ||
|     confirmAddUser(v) {
 | ||
|       let userList = v.map((item) => {
 | ||
|         return {
 | ||
|           organizationId: item.partyOrgId,
 | ||
|           partyId: item.id,
 | ||
|           partyName: item.name,
 | ||
|           phone: item.phone
 | ||
|         }
 | ||
|       })
 | ||
| 
 | ||
|       this.instance.post(`/app/appthreemeetingpartyconfig/addOrUpdate`, userList, null).then(res => {
 | ||
|         if (res.code == 0) {
 | ||
|           this.$message({message: '添加成功', type: 'success'});
 | ||
|           this.getPartyList()
 | ||
|         }
 | ||
|       })
 | ||
|     },
 | ||
|     //删除支部负责人
 | ||
|     deleteUser(item) {
 | ||
|       this.$confirm('是否删除该支部负责人?', '', {
 | ||
|         type: 'error'
 | ||
|       }).then(() => {
 | ||
|         this.instance.post(`/app/appthreemeetingpartyconfig/delete?ids=${item.id}`).then(res => {
 | ||
|           if (res.code == 0) {
 | ||
|             this.$message({message: '删除成功', type: 'success'});
 | ||
|             this.getPartyList()
 | ||
|           }
 | ||
|         })
 | ||
|       })
 | ||
|     }
 | ||
|   }
 | ||
| };
 | ||
| </script>
 | ||
| <style scoped lang="scss">
 | ||
| ::v-deep .right_title .iconfont {
 | ||
|   margin-right: 0 !important;
 | ||
| }
 | ||
| 
 | ||
| .mask {
 | ||
|   .operation {
 | ||
|     overflow: hidden;
 | ||
|     position: absolute;
 | ||
|     bottom: 0;
 | ||
|     left: 0;
 | ||
|     width: 100%;
 | ||
|     height: 64px;
 | ||
|     line-height: 64px;
 | ||
|     display: flex;
 | ||
|     z-index: 1000;
 | ||
|     align-items: center;
 | ||
|     justify-content: center;
 | ||
|     background-color: #f3f6f9;
 | ||
|     box-shadow: inset 0 1px 0 0 #eeeeee;
 | ||
| 
 | ||
|     button {
 | ||
|       width: 92px;
 | ||
|       height: 32px;
 | ||
|       padding: 0 !important;
 | ||
|     }
 | ||
| 
 | ||
|     .delete-btn {
 | ||
|       background-color: #fff;
 | ||
|     }
 | ||
|   }
 | ||
| 
 | ||
|   .content {
 | ||
|     padding: 0 16px 100px;
 | ||
| 
 | ||
|     .search-info {
 | ||
|       line-height: 44px;
 | ||
|       border-bottom: 1px solid #D0D4DC;
 | ||
| 
 | ||
|       span {
 | ||
|         display: inline-block;
 | ||
|         width: 120px;
 | ||
|         line-height: 20px;
 | ||
|         padding-right: 8px;
 | ||
|       }
 | ||
| 
 | ||
|       .el-input {
 | ||
|         width: 160px;
 | ||
|         height: 28px;
 | ||
|         vertical-align: top;
 | ||
|       }
 | ||
| 
 | ||
|       ::v-deep .el-input__inner {
 | ||
|         height: 28px !important;
 | ||
|       }
 | ||
|     }
 | ||
| 
 | ||
|     .user-list {
 | ||
|       padding: 8px 0;
 | ||
|       height: 200px;
 | ||
|       overflow-y: scroll;
 | ||
| 
 | ||
|       .user-item {
 | ||
|         line-height: 24px;
 | ||
|         cursor: pointer;
 | ||
| 
 | ||
|         .iconfont {
 | ||
|           margin-right: 4px;
 | ||
|         }
 | ||
|       }
 | ||
| 
 | ||
|       .active {
 | ||
|         color: #5088FF;
 | ||
|       }
 | ||
|     }
 | ||
|   }
 | ||
| }
 | ||
| 
 | ||
| .content-left {
 | ||
|   width: 160px;
 | ||
|   height: 100%;
 | ||
|   // float:left;
 | ||
|   position: absolute;
 | ||
|   left: -224px;
 | ||
| 
 | ||
|   .content-left-nav {
 | ||
|     width: 158px;
 | ||
|     background-color: #ffffff;
 | ||
|     border-radius: 4px;
 | ||
|     border: solid 1px #eeeeee;
 | ||
|     margin-top: 56px;
 | ||
|     overflow: hidden;
 | ||
| 
 | ||
|     li {
 | ||
|       height: 48px;
 | ||
|       line-height: 48px;
 | ||
|       padding-left: 24px;
 | ||
|       font-size: 14px;
 | ||
|       font-weight: normal;
 | ||
|       font-stretch: normal;
 | ||
|       letter-spacing: 0;
 | ||
|       color: #666666;
 | ||
|       cursor: pointer;
 | ||
|       border-left: 3px solid transparent;
 | ||
| 
 | ||
|       &:hover {
 | ||
|         border-left: 3px solid #5088ff;
 | ||
|       }
 | ||
| 
 | ||
|       a {
 | ||
|         display: block;
 | ||
|       }
 | ||
|     }
 | ||
| 
 | ||
|     .navActive {
 | ||
|       border-left: 3px solid #5088ff;
 | ||
|       color: #5088ff;
 | ||
|     }
 | ||
|   }
 | ||
| }
 | ||
| 
 | ||
| .tab-tips {
 | ||
|   display: inline-block;
 | ||
|   width: 790px;
 | ||
|   height: 32px;
 | ||
|   line-height: 30px;
 | ||
|   background-color: #fff3e8;
 | ||
|   border-radius: 4px;
 | ||
|   border: 1px solid #f82;
 | ||
|   box-sizing: border-box;
 | ||
|   color: #f82;
 | ||
|   margin: 16px 0;
 | ||
| 
 | ||
|   .el-icon-warning {
 | ||
|     font-size: 16px;
 | ||
|     margin: 0 8px;
 | ||
|   }
 | ||
| 
 | ||
|   .text {
 | ||
|     font-size: 12px;
 | ||
|   }
 | ||
| }
 | ||
| </style>
 |