1269 lines
63 KiB
HTML
1269 lines
63 KiB
HTML
<!--#
|
||
layout("/layouts/platform.html"){
|
||
#-->
|
||
<style>
|
||
#app {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
|
||
.w-e-text-container {
|
||
height: 200px !important;
|
||
}
|
||
|
||
input[type="file"] {
|
||
display: none
|
||
}
|
||
|
||
.el-select-dropdown {
|
||
z-index: 99999999 !important;
|
||
}
|
||
|
||
.el-loading-mask {
|
||
z-index: 99999999 !important;
|
||
}
|
||
|
||
.v-tree-layout-left .v-tree {
|
||
width: 100%;
|
||
}
|
||
|
||
.v-tree-layout-left {
|
||
border-right: 2px solid rgb(240, 240, 240);
|
||
}
|
||
|
||
.v-tree-layout-left .custom-tree-node {
|
||
width: 90%;
|
||
position: relative;
|
||
}
|
||
|
||
.v-tree-layout-left .v-tree .v-node {
|
||
width: 100%;
|
||
display: inline-block;
|
||
white-space: nowrap;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
}
|
||
|
||
.el-table-container {
|
||
padding-left: 0;
|
||
}
|
||
|
||
.el-table-container {
|
||
padding-top: 6px;
|
||
padding-right: 0px;
|
||
}
|
||
|
||
.el-descriptions__table {
|
||
table-layout: fixed !important;
|
||
}
|
||
|
||
.el-descriptions-item__cell {
|
||
text-align: center !important;
|
||
}
|
||
|
||
</style>
|
||
|
||
<div id="app" v-cloak>
|
||
|
||
<guava>
|
||
<el-row style="height: calc(100vh - 50px)">
|
||
<transition name="el-zoom-in-center">
|
||
<div v-show="v=='index'" style="width: 100%;height: 100%;">
|
||
<tree-layout>
|
||
<template #tree>
|
||
|
||
<div style="padding: 20px;padding-bottom: 20px">
|
||
<el-input
|
||
placeholder="输入关键字进行查找"
|
||
v-model="filterText">
|
||
</el-input>
|
||
</div>
|
||
|
||
|
||
<el-tree ref="tree" :data="treeData" class="v-tree" v-loading="treeLoading" node-key="id"
|
||
:props="defaultProps"
|
||
default-expand-all :expand-on-click-node="false"
|
||
@node-click="handleNodeClick" accordion @node-expand="nodeExpand"
|
||
highlight-current :filter-node-method="filterNode">
|
||
<div class="custom-tree-node" slot-scope="{ node, data }">
|
||
|
||
<div v-if="node.level==1" style="font-size: 16px;" class="v-node"><i
|
||
class="el-icon-s-home"></i>
|
||
{{ data.name }}
|
||
</div>
|
||
|
||
<div v-if="node.level==2"
|
||
style="font-size: 15px" :title="data.name" class="v-node">
|
||
<i class="el-icon-s-help" v-if="checkData.name==data.name"></i>
|
||
<i class="el-icon-help" v-else></i>
|
||
{{ data.name }}
|
||
</div>
|
||
|
||
</div>
|
||
</el-tree>
|
||
|
||
</template>
|
||
<template>
|
||
|
||
<div v-if="checkNode.level==1" style="padding: 0px 10px;">
|
||
|
||
<el-card shadow="never">
|
||
<div class="btn-group tool-button mt5">
|
||
<el-input placeholder="请输入内容" clearable v-model="pageForm.searchKeyword"
|
||
@keyup.enter.native="doSearch">
|
||
<el-select v-model="pageForm.searchName" slot="prepend" placeholder="查询类型"
|
||
style="width: 120px;">
|
||
<el-option label="协会名称" value="club.name"></el-option>
|
||
</el-select>
|
||
</el-input>
|
||
</div>
|
||
<div class="btn-group tool-button mt5">
|
||
<el-button type="primary" icon="el-icon-search" @click="doSearch"></el-button>
|
||
</div>
|
||
|
||
<div class="pull-right offscreen-right mt5">
|
||
<!--#if(@shiro.hasRole('sysadmin')||@shiro.hasRole('A06')){#-->
|
||
<el-button icon="el-icon-plus" @click="openAdd">创建协会</el-button>
|
||
<!--#}#-->
|
||
</div>
|
||
</el-card>
|
||
|
||
<el-row class="el-table-container">
|
||
<el-table :data="tableData" style="width: 100%" row-key="id" @sort-change="pageOrder"
|
||
v-loading="tabLoading">
|
||
<el-table-column align="center" :key="1" header-align="center" label="序号"
|
||
type="index">
|
||
<template scope="scope">
|
||
<span>{{scope.$index+(pageForm.pageNumber - 1) * pageForm.pageSize + 1}} </span>
|
||
</template>
|
||
</el-table-column>
|
||
|
||
<el-table-column align="center" header-align="center" label="协会名称"
|
||
prop="name"></el-table-column>
|
||
|
||
<el-table-column align="center" header-align="center" label="协会编码" sortable
|
||
prop="code"></el-table-column>
|
||
|
||
<el-table-column align="center" header-align="center" label="联系人"
|
||
show-overflow-tooltip
|
||
prop="fzrname"></el-table-column>
|
||
|
||
|
||
<el-table-column align="center" header-align="center" label="联系人电话"
|
||
show-overflow-tooltip
|
||
prop="fzr_mobile"></el-table-column>
|
||
|
||
<el-table-column align="center" sortable header-align="center" label="限定人数"
|
||
show-overflow-tooltip
|
||
prop="number"></el-table-column>
|
||
|
||
|
||
<el-table-column align="center" sortable header-align="center" label="当前人数"
|
||
show-overflow-tooltip
|
||
prop="cynum"></el-table-column>
|
||
|
||
<el-table-column align="center" sortable header-align="center" label="成立时间"
|
||
width="100px"
|
||
show-overflow-tooltip
|
||
prop="create_time"></el-table-column>
|
||
|
||
<el-table-column align="center" sortable header-align="center" label="状态"
|
||
show-overflow-tooltip
|
||
prop="isjs">
|
||
<template slot-scope="scope">
|
||
<el-tooltip content="正常" v-if="!scope.row.isjs" placement="top">
|
||
<i class="fa fa-circle text-success ml5"></i>
|
||
</el-tooltip>
|
||
|
||
<el-tooltip content="已解散" v-else placement="top">
|
||
<i class="fa fa-circle text-danger ml5"></i>
|
||
</el-tooltip>
|
||
</template>
|
||
</el-table-column>
|
||
|
||
<el-table-column align="center" header-align="center" label="操作" fixed="right"
|
||
width="200px">
|
||
<template slot-scope="{row}">
|
||
<el-dropdown @command="dropdownCommand">
|
||
<el-button size="mini">
|
||
<i class="ti-settings"></i>
|
||
<span class="ti-angle-down"></span>
|
||
</el-button>
|
||
<el-dropdown-menu slot="dropdown">
|
||
|
||
<el-dropdown-item :command="{type:'view',data:row}">
|
||
查看
|
||
</el-dropdown-item>
|
||
<el-dropdown-item :command="{type:'edit',data:row}">
|
||
编辑
|
||
</el-dropdown-item>
|
||
|
||
<!--# if(@shiro.hasRole('sysadmin')||@shiro.hasRole('A06')){ #-->
|
||
<el-dropdown-item :command="{type:'delete',data:row}">
|
||
删除
|
||
</el-dropdown-item>
|
||
<el-dropdown-item v-if="row.isjs === false" :command="{type:'dissolve',data:row}">
|
||
解散
|
||
</el-dropdown-item>
|
||
<el-dropdown-item v-if="row.isjs === true" :command="{type:'dissolve',data:row}">
|
||
启用
|
||
</el-dropdown-item>
|
||
<!--# } #-->
|
||
</el-dropdown-menu>
|
||
</el-dropdown>
|
||
</template>
|
||
</el-table-column>
|
||
|
||
</el-table>
|
||
</el-row>
|
||
|
||
<el-row class="el-pagination-container">
|
||
<el-pagination
|
||
@size-change="pageSizeChange"
|
||
@current-change="pageNumberChange"
|
||
:current-page="pageForm.pageNumber"
|
||
:page-sizes="[10, 20, 30, 50]"
|
||
:page-size="pageForm.pageSize"
|
||
layout="total, sizes, prev, pager, next"
|
||
:total="pageForm.totalCount">
|
||
</el-pagination>
|
||
</el-row>
|
||
</div>
|
||
|
||
|
||
<div v-if="checkNode.level==2" style="padding: 0px 10px;">
|
||
|
||
<el-card shadow="never">
|
||
<div class="btn-group tool-button mt5">
|
||
<el-select v-model="checkData.name" disabled
|
||
placeholder="请选择协会">
|
||
<el-option
|
||
v-for="item in [checkData]"
|
||
:label="item.name"
|
||
:value="item.id">
|
||
</el-option>
|
||
</el-select>
|
||
</div>
|
||
<div class="btn-group tool-button mt5">
|
||
<el-input placeholder="请输入内容" clearable v-model="userPageForm.searchKeyword"
|
||
@keyup.enter.native="doSearch">
|
||
<el-select v-model="userPageForm.searchName" slot="prepend" placeholder="查询类型"
|
||
style="width: 120px;">
|
||
<el-option label="姓名" value="username"></el-option>
|
||
<el-option label="工号" value="loginname"></el-option>
|
||
</el-select>
|
||
</el-input>
|
||
</div>
|
||
<div class="btn-group tool-button mt5">
|
||
<el-button type="primary" icon="el-icon-search" @click="doUserSearch"></el-button>
|
||
</div>
|
||
|
||
<div class="pull-right offscreen-right mt5">
|
||
<el-button icon="el-icon-plus" @click="openUserAdd">设置理事机构</el-button>
|
||
</div>
|
||
</el-card>
|
||
|
||
<el-row class="el-table-container">
|
||
<el-table :data="userTableData" style="width: 100%" row-key="id" :key="2"
|
||
@sort-change="userPageOrder"
|
||
v-loading="tabLoading">
|
||
<el-table-column align="center" header-align="center" label="序号" type="index">
|
||
<template scope="scope">
|
||
<span>{{scope.$index+(userPageForm.pageNumber - 1) * userPageForm.pageSize + 1}} </span>
|
||
</template>
|
||
</el-table-column>
|
||
|
||
|
||
<el-table-column label="工号" prop="loginname" header-align="center"
|
||
align="center"></el-table-column>
|
||
<el-table-column label="姓名" prop="username" header-align="center"
|
||
align="center"></el-table-column>
|
||
<el-table-column label="性别" width="150px" sortable prop="sex" header-align="center"
|
||
align="center"></el-table-column>
|
||
<el-table-column label="电话" prop="mobile" header-align="center"
|
||
align="center"></el-table-column>
|
||
<el-table-column label="所属单位" sortable prop="unitname" header-align="center"
|
||
align="center"></el-table-column>
|
||
|
||
<el-table-column label="身份" prop="sf" header-align="center" align="center">
|
||
<template slot-scope="scope">
|
||
<el-lable v-if="scope.row.sf==1">会长</el-lable>
|
||
<el-lable v-if="scope.row.sf==2">成员</el-lable>
|
||
<el-lable v-if="scope.row.sf==3">副会长</el-lable>
|
||
<el-lable v-if="scope.row.sf==4">秘书长</el-lable>
|
||
<el-lable v-if="scope.row.sf==5">副秘书长</el-lable>
|
||
<el-lable v-if="scope.row.sf==6">协会经办人</el-lable>
|
||
</template>
|
||
</el-table-column>
|
||
|
||
<el-table-column align="center" header-align="center" label="操作" fixed="right">
|
||
<!-- <template scope="{row}">
|
||
<el-button plain type="danger" size="mini" icon="el-icon-delete" circle
|
||
@click="userDropdownCommand(row)">
|
||
</el-button>
|
||
</template>-->
|
||
|
||
<template scope="{row}">
|
||
<el-dropdown>
|
||
<el-button size="mini">
|
||
<i class="ti-settings"></i>
|
||
<span class="ti-angle-down"></span>
|
||
</el-button>
|
||
<el-dropdown-menu slot="dropdown">
|
||
<el-dropdown-item v-if="row.sf!==1"
|
||
@click.native="updateSf(row,1)"
|
||
class="text-primary">设置会长
|
||
</el-dropdown-item>
|
||
<el-dropdown-item v-if="row.sf!==3"
|
||
@click.native="updateSf(row,3)"
|
||
class="text-primary">设置副会长
|
||
</el-dropdown-item>
|
||
<el-dropdown-item v-if="row.sf!==4"
|
||
@click.native="updateSf(row,4)"
|
||
class="text-primary">设置秘书长
|
||
</el-dropdown-item>
|
||
<el-dropdown-item v-if="row.sf!==5"
|
||
@click.native="updateSf(row,5)"
|
||
class="text-primary">设置副秘书长
|
||
</el-dropdown-item>
|
||
<el-dropdown-item v-if="row.sf!==6"
|
||
@click.native="updateSf(row,6)"
|
||
class="text-primary">设置协会经办人
|
||
</el-dropdown-item>
|
||
<el-dropdown-item
|
||
@click.native="userDropdownCommand(row)">删除
|
||
</el-dropdown-item>
|
||
<!--<el-dropdown-item v-if="row.sf!==2"
|
||
@click.native="updateSf(row,2)"
|
||
class="text-primary">设置成员
|
||
</el-dropdown-item>-->
|
||
</el-dropdown-menu>
|
||
</el-dropdown>
|
||
</template>
|
||
|
||
</el-table-column>
|
||
</el-table>
|
||
</el-row>
|
||
|
||
<el-row class="el-pagination-container">
|
||
<el-pagination
|
||
@size-change="userPageSizeChange"
|
||
@current-change="userPageNumberChange"
|
||
:current-page="userPageForm.pageNumber"
|
||
:page-sizes="[10, 20, 30, 50]"
|
||
:page-size="userPageForm.pageSize"
|
||
layout="total, sizes, prev, pager, next"
|
||
:total="userPageForm.totalCount">
|
||
</el-pagination>
|
||
</el-row>
|
||
|
||
</>
|
||
</template>
|
||
</tree-layout>
|
||
</div>
|
||
</transition>
|
||
<transition name="el-zoom-in-center">
|
||
<div v-show="v=='add'||v=='edit'" style="width: 100%; padding-right: 10px">
|
||
<el-card class="box-card v-box" shadow="never">
|
||
<div slot="header" class="clearfix">
|
||
<el-button icon="el-icon-back" type="text" @click="v='index'" style="font-size: 18px">返回
|
||
</el-button>
|
||
</div>
|
||
<div style="padding: 0 10%;height: calc(100vh - 150px);overflow: auto">
|
||
<el-divider content-position="left"><span style="color: rgb(121, 187, 255)">请填写以下协会信息</span>
|
||
</el-divider>
|
||
<el-form :model="formData" ref="form" :rules="formRules" label-position="top" size="small"
|
||
label-width="120px"
|
||
style="padding: 0 30px">
|
||
<el-row gutter="30">
|
||
<el-col :span="12">
|
||
<el-form-item label="协会名称" prop="name">
|
||
<el-input maxlength="100" placeholder="请输入协会名称" v-model="formData.name"
|
||
type="text"></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="协会编码" prop="code">
|
||
<el-input maxlength="100" placeholder="请输入协会编码" v-model="formData.code"
|
||
type="text"></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
<el-row gutter="30">
|
||
<el-col :span="12">
|
||
<el-form-item label="协会类型" prop="type">
|
||
<el-select v-model="formData.type" style="width: 100%"
|
||
placeholder="请选择协会类型">
|
||
<el-option
|
||
v-for="item in typeOptions"
|
||
:key="item.id"
|
||
:label="item.name"
|
||
:value="item.code">
|
||
</el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="协会联系人" prop="fzr">
|
||
<el-select
|
||
style="width: 100%"
|
||
v-model="formData.fzr"
|
||
filterable
|
||
remote
|
||
@change="fzrChange"
|
||
reserve-keyword
|
||
placeholder="请输入姓名或工号查找"
|
||
:remote-method="userRemoteMethod"
|
||
:loading="userLoading">
|
||
<el-option
|
||
v-for="item in userOptions"
|
||
:key="item.id"
|
||
:label="item.username+'（'+item.loginname+'）'"
|
||
:value="item.id">
|
||
</el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
<el-row gutter="30">
|
||
<el-col :span="12">
|
||
<el-form-item label="所在单位" prop="fzr_unit_name">
|
||
<el-input placeholder="" disabled v-model="formData.fzr_unit_name"></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="协会联系人电话" prop="fzr_mobile">
|
||
<el-input placeholder="请填写协会联系人电话" v-model="formData.fzr_mobile"></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
<el-row gutter="30">
|
||
<el-col :span="12">
|
||
<el-form-item label="协会联系人邮箱" prop="fzr_email"
|
||
:rules="[{ type: 'email', message: '请输入正确的邮箱地址', trigger: ['blur', 'change'] }]">
|
||
<el-input placeholder="请填写负责人邮箱" type="email"
|
||
v-model="formData.fzr_email"></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="限定人数" prop="number">
|
||
<el-input placeholder="请填写限定人数" v-model="formData.number"></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
<el-row gutter="30">
|
||
<el-col :span="12">
|
||
<el-form-item label="介绍链接" prop="introduce_href">
|
||
<el-input placeholder="请填写介绍链接" v-model="formData.introduce_href"></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<el-form-item label="会费标准" prop="dues_standard">
|
||
<el-input placeholder="请填写会费标准" v-model="formData.dues_standard"></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
<el-form-item label="协会介绍" prop="stjs">
|
||
<div id="stjsEditor"></div>
|
||
</el-form-item>
|
||
|
||
<el-form-item label="协会章程" prop="stzc">
|
||
<div id="stzcEditor"></div>
|
||
</el-form-item>
|
||
|
||
<el-form-item prop="accessory" label="附件上传">
|
||
<el-upload
|
||
name="file"
|
||
ref="upload"
|
||
action="**"
|
||
:on-remove="handleRemove"
|
||
:on-change="handleChange"
|
||
:auto-upload="false"
|
||
limit="1"
|
||
:file-list="fileList">
|
||
<el-button size="small" type="primary">选择文件</el-button>
|
||
</el-upload>
|
||
</el-form-item>
|
||
|
||
|
||
<div style="display: flex;justify-content:flex-end;margin-top: 30px">
|
||
<el-button type="primary" :disabled="subDis" @click="v=='add'?doAdd():doEdit()">提 交
|
||
</el-button>
|
||
</div>
|
||
</el-form>
|
||
</div>
|
||
</el-card>
|
||
</div>
|
||
</transition>
|
||
|
||
<transition name="el-zoom-in-center">
|
||
<div v-show="v=='view'" style="width: 100%;padding-right: 10px">
|
||
<el-card class="box-card v-box" shadow="never">
|
||
<div slot="header" class="clearfix">
|
||
<el-button icon="el-icon-back" type="text" @click="v='index'" style="font-size: 18px">返回
|
||
</el-button>
|
||
</div>
|
||
<div style="padding: 0 10%;height: calc(100vh - 150px);overflow: auto">
|
||
|
||
<vi-title title="协会信息"></vi-title>
|
||
<el-descriptions class="margin-top" title="" :column="3" border>
|
||
<el-descriptions-item span="3">
|
||
<template slot="label">协会名称</template>
|
||
<div v-html="detailData.name"></div>
|
||
</el-descriptions-item>
|
||
<el-descriptions-item>
|
||
<template slot="label">协会联系人</template>
|
||
{{detailData.fzrname}}
|
||
</el-descriptions-item>
|
||
<el-descriptions-item>
|
||
<template slot="label">所在单位</template>
|
||
{{detailData.fzr_unit_name}}
|
||
</el-descriptions-item>
|
||
<el-descriptions-item>
|
||
<template slot="label">联系人电话</template>
|
||
{{detailData.fzr_mobile}}
|
||
</el-descriptions-item>
|
||
<el-descriptions-item>
|
||
<template slot="label">联系人邮箱</template>
|
||
{{detailData.fzr_email}}
|
||
</el-descriptions-item>
|
||
<el-descriptions-item>
|
||
<template slot="label">成立时间</template>
|
||
{{detailData.create_time}}
|
||
</el-descriptions-item>
|
||
<el-descriptions-item>
|
||
<template slot="label">会费标准</template>
|
||
{{detailData.dues_standard}}
|
||
</el-descriptions-item>
|
||
<el-descriptions-item>
|
||
<template slot="label">介绍链接</template>
|
||
<span style="cursor: pointer; color: #236eb4"
|
||
@click="window.open(detailData.introduce_href.indexOf('http') !== -1 ? detailData.introduce_href : 'https://' + detailData.introduce_href)">{{detailData.introduce_href}}</span>
|
||
</el-descriptions-item>
|
||
<el-descriptions-item>
|
||
<template slot="label">限定人数</template>
|
||
{{detailData.number}}
|
||
</el-descriptions-item>
|
||
<el-descriptions-item>
|
||
<template slot="label">当前人数</template>
|
||
{{detailData.cynum}}
|
||
</el-descriptions-item>
|
||
<el-descriptions-item span="3">
|
||
<template slot="label">协会介绍</template>
|
||
<div class="text-left" v-html="detailData.stjs"></div>
|
||
</el-descriptions-item>
|
||
<el-descriptions-item span="3">
|
||
<template slot="label">协会章程</template>
|
||
<div class="text-left" v-html="detailData.stzc"></div>
|
||
</el-descriptions-item>
|
||
</el-descriptions>
|
||
<vi-title title="成员列表" style="margin-top: 20px"></vi-title>
|
||
<el-table :data="detailData.clubuser" size="small" border
|
||
:header-cell-style="{background:'#F5F5F5',color:'#606266'}">
|
||
<el-table-column label="人员身份" width="150px" prop="sf" header-align="center"
|
||
align="center">
|
||
<template slot-scope="scope">
|
||
<el-lable v-if="scope.row.sf==1">会长</el-lable>
|
||
<el-lable v-if="scope.row.sf==2">成员</el-lable>
|
||
<el-lable v-if="scope.row.sf==3">副会长</el-lable>
|
||
<el-lable v-if="scope.row.sf==4">秘书长</el-lable>
|
||
<el-lable v-if="scope.row.sf==5">副秘书长</el-lable>
|
||
<el-lable v-if="scope.row.sf==6">协会经办人</el-lable>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="工号" width="150px" prop="loginname" header-align="center"
|
||
align="center"></el-table-column>
|
||
<el-table-column label="姓名" width="150px" prop="username" header-align="center"
|
||
align="center"></el-table-column>
|
||
<el-table-column label="性别" width="150px" prop="sex" header-align="center"
|
||
align="center"></el-table-column>
|
||
<el-table-column label="电话" width="150px" prop="mobile" header-align="center"
|
||
align="center"></el-table-column>
|
||
<el-table-column label="所属单位" prop="unitname" header-align="center"
|
||
align="center"></el-table-column>
|
||
<!-- <el-table-column label="是否缴费" prop="isjf" header-align="center" width="150px"
|
||
align="center">
|
||
<template slot-scope="scope">
|
||
<span v-if="scope.row.isjf" class="text-success">已缴费</span>
|
||
<span v-else class="text-danger">未缴费</span>
|
||
</template>
|
||
</el-table-column>-->
|
||
</el-table>
|
||
</div>
|
||
</el-card>
|
||
</div>
|
||
</transition>
|
||
</el-row>
|
||
</guava>
|
||
|
||
|
||
<el-dialog
|
||
title="设置理事机构"
|
||
:visible.sync="addDialogVisible" :close-on-click-modal="false" width="40%">
|
||
|
||
<el-form :model="userFormData" ref="userForm" :rules="userFormRules"
|
||
label-width="100px">
|
||
<el-form-item label="成  员" prop="users">
|
||
<el-select
|
||
style="width: 100%"
|
||
multiple
|
||
v-model="userFormData.users"
|
||
filterable
|
||
remote
|
||
reserve-keyword
|
||
placeholder="请输入姓名或工号查找"
|
||
:remote-method="userUserRemoteMethod"
|
||
:loading="userLoading">
|
||
<el-option
|
||
v-for="item in userOptions"
|
||
:key="item.id"
|
||
:label="item.username+'（'+item.loginname+'）' + '-- ' + item.unitname"
|
||
:value="item.id">
|
||
</el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
<el-form-item class="is-required" prop="sf" label="身  份">
|
||
<el-radio-group v-model="userFormData.sf"
|
||
style="margin-bottom: -7.5px">
|
||
<el-radio-button :label="1">会长</el-radio-button>
|
||
<el-radio-button :label="3">副会长</el-radio-button>
|
||
<el-radio-button :label="4">秘书长</el-radio-button>
|
||
<el-radio-button :label="5">副秘书长</el-radio-button>
|
||
<el-radio-button :label="6">协会经办人</el-radio-button>
|
||
<!--<el-radio-button :label="2">成员</el-radio-button>-->
|
||
</el-radio-group>
|
||
</el-form-item>
|
||
</el-form>
|
||
|
||
<span slot="footer" class="dialog-footer">
|
||
<el-button @click="addDialogVisible = false">取 消</el-button>
|
||
<el-button type="primary" :disabled="subDis" @click="userDoAdd">确 定</el-button>
|
||
</span>
|
||
</el-dialog>
|
||
|
||
</div>
|
||
<script>
|
||
var E = window.wangEditor
|
||
|
||
const vue = new Vue({
|
||
el: '#app',
|
||
data() {
|
||
return {
|
||
v: 'index',
|
||
filterText: '',
|
||
defaultProps: {
|
||
children: 'child',
|
||
label: 'name',
|
||
},
|
||
exKeys: ['0'],
|
||
activeName: [],
|
||
typeOptions: [],
|
||
treeLoading: true,
|
||
tabLoading: false,
|
||
formData: {},
|
||
detailData: {},
|
||
treeData: [],
|
||
tableData: [],
|
||
pageForm: {
|
||
searchName: "club.name",
|
||
searchKeyword: "",
|
||
pageNumber: 1,
|
||
pageSize: 10,
|
||
totalCount: 0,
|
||
pageOrderName: "",
|
||
pageOrderBy: ""
|
||
},
|
||
formRules: {
|
||
name: [{required: true, message: '必填', trigger: ['blur', 'change']}],
|
||
type: [{required: false, message: '必填', trigger: ['blur', 'change']}],
|
||
fzr: [{required: true, message: '必填', trigger: ['blur', 'change']}],
|
||
fzr_unit_name: [{required: true, message: '必填', trigger: ['blur', 'change']}],
|
||
fzrname: [{required: true, message: '必填', trigger: ['blur', 'change']}],
|
||
},
|
||
subDis: false,
|
||
userOptions: [],
|
||
userLoading: false,
|
||
fileList: [],
|
||
delFiles: [],
|
||
checkNode: {level: 1},
|
||
checkData: {},
|
||
//################################
|
||
userFormRules: {
|
||
users: [{required: true, message: '必选', trigger: ['blur', 'change']}],
|
||
isjf: [{required: true, message: '必选', trigger: ['blur', 'change']}],
|
||
sf: [{required: true, message: '必选', trigger: ['blur', 'change']}],
|
||
},
|
||
userFormData: {
|
||
sf: '1'
|
||
},
|
||
userPageForm: {
|
||
searchName: "username",
|
||
searchKeyword: "",
|
||
pageNumber: 1,
|
||
pageSize: 10,
|
||
totalCount: 0,
|
||
pageOrderName: "",
|
||
pageOrderBy: ""
|
||
},
|
||
userTableData: [],
|
||
userTabKey: "",
|
||
addDialogVisible: false,
|
||
clubOptions: [],
|
||
}
|
||
},
|
||
components: {
|
||
'tree-layout': httpVueLoader('/components/plugins/TreeLayout.vue')
|
||
},
|
||
watch: {
|
||
filterText(val) {
|
||
this.$refs.tree.filter(val);
|
||
}
|
||
},
|
||
methods: {
|
||
async updateSf(row, sf) {
|
||
await $.post(loc() + '/updateSf', {
|
||
userid: row.userid,
|
||
sf: sf,
|
||
clubId: row.clubid
|
||
})
|
||
this.userPageData();
|
||
},
|
||
userDropdownCommand(data) {
|
||
this.$confirm('确定要将' + data.username + '移出协会吗？', '提示', {
|
||
confirmButtonText: '确定',
|
||
cancelButtonText: '取消',
|
||
type: 'warning',
|
||
callback: (a, b) => {
|
||
if ("confirm" == a) {//确认后再执行
|
||
$.post(base + "/platform/sys/club/users/delUser", {
|
||
clubid: data.clubid,
|
||
userid: data.userid,
|
||
sf: data.sf,
|
||
}, (data) => {
|
||
if (data.code == 0) {
|
||
this.$message({
|
||
message: data.msg,
|
||
type: 'success'
|
||
});
|
||
this.userPageData()
|
||
} else {
|
||
this.$message({
|
||
message: data.msg,
|
||
type: 'error'
|
||
});
|
||
}
|
||
}, "json");
|
||
}
|
||
}
|
||
});
|
||
|
||
},
|
||
userDoAdd() {
|
||
this.$refs["userForm"].validate((valid) => {
|
||
if (valid) {
|
||
const loading = this.$loading({
|
||
lock: true,
|
||
text: '数据提交中...',
|
||
spinner: 'el-icon-loading',
|
||
background: 'rgba(0, 0, 0, 0.7)'
|
||
});
|
||
|
||
$.post(base + "/platform/sys/club/users/doAddUser", {
|
||
clubid: this.userPageForm.clubid,
|
||
users: JSON.stringify(this.userFormData.users),
|
||
sf: this.userFormData.sf,
|
||
type: 1,
|
||
}, (data) => {
|
||
loading.close()
|
||
if (data.code == 0) {
|
||
this.addDialogVisible = false
|
||
this.$message({
|
||
message: '添加成功！',
|
||
type: 'success'
|
||
});
|
||
this.userPageData()
|
||
} else {
|
||
this.$message({
|
||
message: data.msg,
|
||
type: 'error'
|
||
});
|
||
}
|
||
}, "json");
|
||
|
||
}
|
||
});
|
||
},
|
||
async userQueryUser(clubid, query) {
|
||
const {data} = await $.get("/platform/sys/club/users/queryClubMemberForManage", {clubid, query})
|
||
return data
|
||
},
|
||
async userUserRemoteMethod(query) {
|
||
if (query) {
|
||
this.userLoading = true
|
||
const arr = await this.userQueryUser(this.userPageForm.clubid, query)
|
||
// this.userOptions = this.userOptions.filter(v => {
|
||
// return this.userFormData.users.includes(v.id)
|
||
// }).concat(arr.filter(v => {
|
||
// return !this.userFormData.users.includes(v.id)
|
||
// }));
|
||
this.userOptions = arr
|
||
|
||
this.userLoading = false
|
||
}
|
||
},
|
||
openUserAdd() {
|
||
this.userOptions = []
|
||
this.userFormData = {sf: "1", users: []}
|
||
this.addDialogVisible = true;
|
||
this.$nextTick(() => {
|
||
if (this.$refs['userForm']) {
|
||
this.$refs['userForm'].resetFields()
|
||
}
|
||
})
|
||
|
||
},
|
||
doUserSearch() {
|
||
this.userTabKey = new Date().getTime()
|
||
this.userPageForm.pageNumber = 1
|
||
this.userPageData()
|
||
},
|
||
userPageOrder(column) {//按字段排序
|
||
this.userPageForm.pageOrderName = column.prop;
|
||
this.userPageForm.pageOrderBy = column.order;
|
||
this.userPageData();
|
||
},
|
||
userPageNumberChange(val) {//页码更新操作
|
||
this.userPageForm.pageNumber = val;
|
||
this.userPageData();
|
||
},
|
||
userPageSizeChange(val) {//分页大小更新操作
|
||
this.userPageForm.pageSize = val;
|
||
this.userPageData();
|
||
},
|
||
userPageData() {//加载分页数据
|
||
sublime.showLoadingbar();//显示loading
|
||
this.tabLoading = true
|
||
this.userPageForm.type = 1
|
||
$.post(base + "/platform/sys/club/users/pageData", this.userPageForm, (data) => {
|
||
sublime.closeLoadingbar();//关闭loading
|
||
this.tabLoading = false
|
||
if (data.code == 0) {
|
||
this.userTableData = data.data.list;
|
||
this.userPageForm.totalCount = data.data.totalCount;
|
||
} else {
|
||
this.$message({
|
||
message: data.msg,
|
||
type: 'error'
|
||
});
|
||
}
|
||
}, "json");
|
||
},
|
||
|
||
//##################################################################################
|
||
dropdownCommand: function (command) {
|
||
const {type, data} = command
|
||
if (type == 'view') {
|
||
this.openDetail(data.id)
|
||
} else if (type == 'edit') {
|
||
this.openEdit(data.id)
|
||
} else if (type == 'dissolve') {
|
||
this.doDissolve(data.id, data.isjs)
|
||
} else if (type == 'delete') {
|
||
this.doDelete(data.id)
|
||
}
|
||
},
|
||
filterNode(value, data, node) {
|
||
if (!value) return true;
|
||
|
||
return data.name.indexOf(value) !== -1
|
||
|
||
return false
|
||
},
|
||
nodeExpand(data, node, e) {
|
||
|
||
},
|
||
async handleNodeClick(data, node) {
|
||
this.checkData = data
|
||
this.checkNode = node
|
||
this.userPageForm = {
|
||
searchName: "username",
|
||
searchKeyword: "",
|
||
pageNumber: 1,
|
||
pageSize: 10,
|
||
totalCount: 0,
|
||
pageOrderName: "",
|
||
pageOrderBy: "",
|
||
clubid: data.id
|
||
}
|
||
this.doUserSearch()
|
||
},
|
||
openDetail(id) {
|
||
$.get(base + "/platform/sys/club/mange/findOne", {id}, (data) => {
|
||
if (data.code == 0) {
|
||
this.detailData = data.data
|
||
|
||
this.activeName = '1'
|
||
this.v = 'view'
|
||
} else {
|
||
this.$message({
|
||
message: data.msg,
|
||
type: 'error'
|
||
});
|
||
}
|
||
}, "json");
|
||
},
|
||
doDissolve(id, isjs) {
|
||
const str = isjs === true ? '确定要启用该协会吗？' : '确定要解散该协会吗？'
|
||
this.$confirm(str, '提示', {
|
||
confirmButtonText: '确定',
|
||
cancelButtonText: '取消',
|
||
type: 'warning',
|
||
callback: (a, b) => {
|
||
if ("confirm" == a) {//确认后再执行
|
||
$.post(base + "/platform/sys/club/mange/dissolve", {id: id, isjs: !isjs}, (data) => {
|
||
if (data.code == 0) {
|
||
this.$message({
|
||
message: data.msg,
|
||
type: 'success'
|
||
});
|
||
this.pageData();
|
||
this.loadTree()
|
||
} else {
|
||
this.$message({
|
||
message: data.msg,
|
||
type: 'error'
|
||
});
|
||
}
|
||
}, "json");
|
||
}
|
||
}
|
||
});
|
||
},
|
||
doDelete(id) {
|
||
this.$confirm('确定要删除该协会吗？', '提示', {
|
||
confirmButtonText: '确定',
|
||
cancelButtonText: '取消',
|
||
type: 'warning',
|
||
callback: (a, b) => {
|
||
if ("confirm" == a) {//确认后再执行
|
||
$.post(base + "/platform/sys/club/mange/delete", {id: id}, (data) => {
|
||
if (data.code == 0) {
|
||
this.$message({
|
||
message: data.msg,
|
||
type: 'success'
|
||
});
|
||
this.pageData();
|
||
this.loadTree()
|
||
} else {
|
||
this.$message({
|
||
message: data.msg,
|
||
type: 'error'
|
||
});
|
||
}
|
||
}, "json");
|
||
}
|
||
}
|
||
});
|
||
},
|
||
|
||
doEdit() {
|
||
this.$refs["form"].validate((valid) => {
|
||
if (valid) {
|
||
var formdata = new FormData();
|
||
for (let key in this.formData) {
|
||
formdata.append(key, this.formData[key] ? this.formData[key] : '');
|
||
}
|
||
|
||
this.fileList.forEach(function (val) {
|
||
if (val.status === 'ready') {
|
||
formdata.append("files", val.raw, val.raw.name);
|
||
}
|
||
});
|
||
|
||
formdata.append("delFiles", this.delFiles)
|
||
|
||
this.subDis = true
|
||
const loading = this.$loading({
|
||
lock: true,
|
||
text: '数据提交中...',
|
||
spinner: 'el-icon-loading',
|
||
background: 'rgba(0, 0, 0, 0.7)'
|
||
});
|
||
|
||
$.ajax({
|
||
url: "/platform/sys/club/mange/doEdit",
|
||
type: "post",
|
||
data: formdata,
|
||
processData: false,
|
||
contentType: false,
|
||
success: (data) => {
|
||
this.subDis = false
|
||
loading.close()
|
||
if (data.code === 0) {
|
||
this.$message({
|
||
message: data.msg,
|
||
type: 'success'
|
||
});
|
||
this.pageData();
|
||
this.v = 'index';
|
||
this.loadTree()
|
||
} else {
|
||
this.$message({
|
||
message: data.msg,
|
||
type: 'error'
|
||
});
|
||
}
|
||
},
|
||
error: data => {
|
||
this.subDis = false
|
||
loading.close()
|
||
this.$message({
|
||
message: data.msg,
|
||
type: 'error'
|
||
});
|
||
}
|
||
});
|
||
|
||
}
|
||
});
|
||
},
|
||
async openEdit(id) {
|
||
this.fileList = []
|
||
this.delFiles = []
|
||
this.userOptions = []
|
||
this.formData = {}
|
||
if (this.$refs['form']) {
|
||
this.$refs['form'].resetFields()
|
||
}
|
||
const {data, code, msg} = await $.get(base + "/platform/sys/club/mange/findOne", {id});
|
||
|
||
if (code == 0) {
|
||
await this.userUserRemoteMethod(data.fzrname)
|
||
|
||
this.formData = data
|
||
|
||
|
||
//files
|
||
data.files.forEach(v => {
|
||
this.fileList.push({id: v.id, name: v.filename, url: v.filepath, status: 'success'})
|
||
})
|
||
|
||
this.v = 'edit'
|
||
|
||
this.$nextTick(() => {
|
||
$("#stjsEditor").html("")
|
||
$("#stzcEditor").html("")
|
||
var stjsEditor = new E("#stjsEditor")
|
||
stjsEditor.config.onchange = (html) => {
|
||
this.formData.stjs = html
|
||
}
|
||
var stzcEditor = new E("#stzcEditor")
|
||
stzcEditor.config.onchange = (html) => {
|
||
this.formData.stzc = html
|
||
}
|
||
stjsEditor.create()
|
||
stzcEditor.create()
|
||
stjsEditor.txt.html(data.stjs)
|
||
stzcEditor.txt.html(data.stzc)
|
||
})
|
||
|
||
} else {
|
||
this.$message({
|
||
message: msg,
|
||
type: 'error'
|
||
});
|
||
}
|
||
|
||
},
|
||
doAdd() {
|
||
this.$refs["form"].validate((valid) => {
|
||
if (valid) {
|
||
var formdata = new FormData();
|
||
for (let key in this.formData) {
|
||
formdata.append(key, this.formData[key] ? this.formData[key] : '');
|
||
}
|
||
|
||
this.fileList.forEach(function (val) {
|
||
formdata.append("files", val.raw, val.raw.name);
|
||
});
|
||
|
||
this.subDis = true
|
||
const loading = this.$loading({
|
||
lock: true,
|
||
text: '数据提交中...',
|
||
spinner: 'el-icon-loading',
|
||
background: 'rgba(0, 0, 0, 0.7)'
|
||
});
|
||
|
||
$.ajax({
|
||
url: "/platform/sys/club/mange/doAdd",
|
||
type: "post",
|
||
data: formdata,
|
||
processData: false,
|
||
contentType: false,
|
||
success: (data) => {
|
||
this.subDis = false
|
||
loading.close()
|
||
if (data.code === 0) {
|
||
this.$message({
|
||
message: data.msg,
|
||
type: 'success'
|
||
});
|
||
this.pageData();
|
||
this.v = 'index';
|
||
this.loadTree()
|
||
} else {
|
||
this.$message({
|
||
message: data.msg,
|
||
type: 'error'
|
||
});
|
||
}
|
||
},
|
||
error: data => {
|
||
this.subDis = false
|
||
loading.close()
|
||
this.$message({
|
||
message: data.msg,
|
||
type: 'error'
|
||
});
|
||
}
|
||
});
|
||
|
||
}
|
||
});
|
||
},
|
||
handleRemove(file, fileList) {
|
||
this.fileList = fileList;
|
||
if (file.status === "success") {
|
||
this.delFiles.push(file.id);
|
||
}
|
||
},
|
||
handleChange(file, fileList) {
|
||
const delFile = () => {
|
||
for (let i = 0; i < fileList.length; i++) {
|
||
if (file === fileList[i]) {
|
||
fileList.splice(i, 1);
|
||
}
|
||
}
|
||
}
|
||
if (this.size === 0) {
|
||
this.$message.warning("您选择的是空文件!");
|
||
delFile()
|
||
}
|
||
if (!uploadFileType.includes(file.name.split('.')[1])) {
|
||
this.$message.warning("文件格式不支持!");
|
||
delFile()
|
||
}
|
||
this.fileList = fileList;
|
||
},
|
||
|
||
fzrChange(id) {
|
||
const user = this.userOptions.find(v => {
|
||
return v.id == id
|
||
})
|
||
this.$set(this.formData, 'fzr_unit_name', user.unitname)
|
||
this.$set(this.formData, 'fzr_mobile', user.mobile)
|
||
this.$set(this.formData, 'fzr_email', user.email)
|
||
},
|
||
async userRemoteMethod(query) {
|
||
if (query) {
|
||
this.userOptions = []
|
||
this.userLoading = true
|
||
this.userOptions = await searchUser(query)
|
||
this.userLoading = false
|
||
}
|
||
},
|
||
openAdd() {
|
||
this.fileList = []
|
||
this.delFiles = []
|
||
this.userOptions = []
|
||
this.formData = {}
|
||
this.v = 'add';
|
||
this.$nextTick(() => {
|
||
$("#stjsEditor").html("")
|
||
$("#stzcEditor").html("")
|
||
var stjsEditor = new E("#stjsEditor")
|
||
stjsEditor.config.onchange = (html) => {
|
||
this.formData.stjs = html
|
||
}
|
||
var stzcEditor = new E("#stzcEditor")
|
||
stzcEditor.config.onchange = (html) => {
|
||
this.formData.stzc = html
|
||
}
|
||
stjsEditor.create()
|
||
stzcEditor.create()
|
||
})
|
||
if (this.$refs['form']) {
|
||
this.$refs['form'].resetFields()
|
||
}
|
||
},
|
||
doSearch() {
|
||
this.tabKey = new Date().getTime()
|
||
this.pageForm.pageNumber = 1
|
||
this.pageData()
|
||
}
|
||
,
|
||
pageOrder(column) {//按字段排序
|
||
this.pageForm.pageOrderName = column.prop;
|
||
this.pageForm.pageOrderBy = column.order;
|
||
this.pageData();
|
||
}
|
||
,
|
||
pageNumberChange(val) {//页码更新操作
|
||
this.pageForm.pageNumber = val;
|
||
this.pageData();
|
||
}
|
||
,
|
||
pageSizeChange(val) {//分页大小更新操作
|
||
this.pageForm.pageSize = val;
|
||
this.pageData();
|
||
}
|
||
,
|
||
pageData() {//加载分页数据
|
||
sublime.showLoadingbar();//显示loading
|
||
this.tabLoading = true
|
||
$.post(base + "/platform/sys/club/mange/pageData", this.pageForm, (data) => {
|
||
sublime.closeLoadingbar();//关闭loading
|
||
this.tabLoading = false
|
||
if (data.code == 0) {
|
||
this.tableData = data.data.list;
|
||
this.pageForm.totalCount = data.data.totalCount;
|
||
} else {
|
||
this.$message({
|
||
message: data.msg,
|
||
type: 'error'
|
||
});
|
||
}
|
||
}, "json");
|
||
},
|
||
async loadTree() {
|
||
this.treeLoading = true
|
||
const {code, data, msg} = await $.get("/platform/sys/club/mange/getClubTreeData")
|
||
this.treeLoading = false
|
||
if (code == 0) {
|
||
this.treeData = data
|
||
|
||
this.checkData = data[0]
|
||
} else {
|
||
this.$message({
|
||
message: data.msg,
|
||
type: 'error'
|
||
});
|
||
}
|
||
},
|
||
},
|
||
async created() {
|
||
this.loadTree()
|
||
this.typeOptions = await getClubType()
|
||
this.pageData();
|
||
}
|
||
})
|
||
</script>
|
||
<!--#
|
||
}
|
||
#-->
|