|
|
@@ -1,254 +0,0 @@
|
|
|
-<template>
|
|
|
- <div class="container normal-panel normal-margin" style="line-height:32px">
|
|
|
- <div v-if="$slots.title">
|
|
|
- <slot name="title"></slot>
|
|
|
- </div>
|
|
|
- <p v-else class="normal-title normal-margin">发布范围</p>
|
|
|
- <el-row :gutter="20">
|
|
|
- <el-col :span="12">
|
|
|
- <div>
|
|
|
- <div class="normal-margin" style="height:32px;line-height:32px">
|
|
|
- </div>
|
|
|
- <div class="panel">
|
|
|
- <div class="tab flex-align-center">
|
|
|
- <p :class="activeName === '组织架构'?'tab-act':''" @click="tabChange('组织架构')">组织架构</p>
|
|
|
- <p :class="activeName === '营销组织'?'tab-act':''" @click="tabChange('营销组织')">营销组织</p>
|
|
|
- </div>
|
|
|
- <div>
|
|
|
- <deplist ref="dep" v-show="activeName === '组织架构'" :checked="true" :dep_default="defaultData.departmentid" @onChecked="onChecked" @nodeClick="nodeClick" @checkChange="checkChange"></deplist>
|
|
|
- <arealist ref="area" v-show="activeName === '营销组织'" :checked="true" :area_default="defaultData.sa_saleareaid" @onAreaChecked="onAreaChecked" ></arealist>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </el-col>
|
|
|
- <el-col :span="12" v-show="activeName === '组织架构'">
|
|
|
- <div>
|
|
|
- <div class="flex-align-center flex-between normal-margin">
|
|
|
- <el-checkbox :disabled="pageOnlyRead" v-model="allcheck_m" :indeterminate="isIndeterminate" @change="handleCheckAllChange">全 选</el-checkbox>
|
|
|
- <el-checkbox :disabled="pageOnlyRead" v-model="allcheck1" @change="handleCheckedChange">仅组织负责人可见</el-checkbox>
|
|
|
- </div>
|
|
|
- <div class="panel">
|
|
|
- <div class="tab flex-align-center">
|
|
|
- <p>人员信息</p>
|
|
|
- </div>
|
|
|
- <div class="container">
|
|
|
- <el-input size="small" v-model="searchValue" class="normal-margin" placeholder="搜索人员" clearable></el-input>
|
|
|
- <div :style="{ height: scrollHeight?scrollHeight:'400px'}" style="overflow-y:scroll">
|
|
|
- <el-checkbox-group :disabled="pageOnlyRead" v-model="checkedMenbers" @change="handleCheckedChange">
|
|
|
- <div v-for="item in menberData" :key="item.index">
|
|
|
- <el-checkbox v-if="searchValue" v-show="item.name === searchValue" :label="item.hrid">{{item.name}}</el-checkbox>
|
|
|
- <el-checkbox v-else :label="item.hrid">{{item.name}}</el-checkbox>
|
|
|
- </div>
|
|
|
- </el-checkbox-group>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </el-col>
|
|
|
- <el-col :span="12" v-show="activeName === '营销组织'">
|
|
|
- <div>
|
|
|
- <div class="flex-align-center flex-between normal-margin">
|
|
|
- <el-checkbox :disabled="pageOnlyRead" v-model="allcheck_a" :indeterminate="isIndeterminate2" @change="handleCheckAllChange">全 选</el-checkbox>
|
|
|
- <el-checkbox :disabled="pageOnlyRead" v-model="allcheck2" @change="handleCheckedChange">仅经销商主账号可见</el-checkbox>
|
|
|
- </div>
|
|
|
- <div class="panel">
|
|
|
- <div class="tab flex-align-center">
|
|
|
- <p>经销商信息</p>
|
|
|
- </div>
|
|
|
- <div class="container">
|
|
|
- <el-input size="small" v-model="searchValue" class="normal-margin" placeholder="搜索人员" clearable></el-input>
|
|
|
- <div :style="{ height: scrollHeight?scrollHeight:'400px'}" style="overflow-y:scroll">
|
|
|
- <el-checkbox-group :disabled="pageOnlyRead" v-model="checkedAgents" @change="handleCheckedChange">
|
|
|
- <div v-for="item in agentData" :key="item.index">
|
|
|
- <el-checkbox v-if="searchValue" v-show="item.agentname === searchValue" :label="item.sa_agentsid">{{item.agentname}}</el-checkbox>
|
|
|
- <el-checkbox v-else :label="item.sa_agentsid">{{item.agentname}}</el-checkbox>
|
|
|
- </div>
|
|
|
- </el-checkbox-group>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- </div>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
-import deplist from '@/components/selectMenber/modules/dep_list.vue'
|
|
|
-import arealist from '@/components/selectAgent/area/list.vue'
|
|
|
-import {mapGetters} from 'vuex'
|
|
|
-
|
|
|
-export default {
|
|
|
- props:['defaultData','onlyread','appidname','dataid','scrollHeight'],
|
|
|
- components:{
|
|
|
- deplist,
|
|
|
- arealist
|
|
|
- },
|
|
|
- data () {
|
|
|
- return {
|
|
|
- activeName:'组织架构',
|
|
|
- allcheck1:false,
|
|
|
- allcheck2:false,
|
|
|
- allcheck_m:false,
|
|
|
- allcheck_a:false,
|
|
|
- isIndeterminate:true,
|
|
|
- isIndeterminate2:true,
|
|
|
- menberData:[],
|
|
|
- checkedMenbers:[],
|
|
|
- checkedAgents:[],
|
|
|
- depChecked:[],
|
|
|
- areaChecked:[],
|
|
|
- agentData:[],
|
|
|
- searchValue:null,
|
|
|
- }
|
|
|
- },
|
|
|
- computed:{
|
|
|
- ...mapGetters({
|
|
|
- pageOnlyRead:"pageOnlyRead"
|
|
|
- })
|
|
|
- },
|
|
|
- methods:{
|
|
|
- tabChange (val) {
|
|
|
- this.activeName = val
|
|
|
- },
|
|
|
- // 设置授权信息
|
|
|
- async query_auth () {
|
|
|
- this.checkedMenbers = this.defaultData.hrid
|
|
|
- this.checkedAgents = this.defaultData.sa_agentsid
|
|
|
- this.allcheck1 = this.defaultData.isonlymanager_dept
|
|
|
- this.allcheck2 = this.defaultData.isonlymanager_agent
|
|
|
- },
|
|
|
- // 根据组织架构范围查询人员
|
|
|
- async menberList (val) {
|
|
|
- let param = {
|
|
|
- "classname": "webmanage.hr.hr",
|
|
|
- "method": "query_hrList",
|
|
|
- "content": {
|
|
|
- "nocahe":true,
|
|
|
- "pageNumber": 1,
|
|
|
- "pageSize": 10000,
|
|
|
- "departmentids":val,
|
|
|
- "containssub":0,
|
|
|
- "where": {
|
|
|
- "condition": ""
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- const res = await this.$api.requested(param)
|
|
|
- this.menberData = res.data
|
|
|
- },
|
|
|
- // 根据营销区域范围查询经销商
|
|
|
- async agentList (val) {
|
|
|
- let param = {
|
|
|
- "classname": "webmanage.sale.salearea.salearea",
|
|
|
- "method": "query_agent",
|
|
|
- "content": {
|
|
|
- "pageNumber": 1,
|
|
|
- "pageSize": 10000,
|
|
|
- "sa_saleareaids":val,
|
|
|
- "containssub":0,
|
|
|
- "where": {
|
|
|
- "condition": ""
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- const res = await this.$api.requested(param)
|
|
|
- this.agentData = res.data
|
|
|
- },
|
|
|
- // 选中的组织架构数据
|
|
|
- onChecked (val) {
|
|
|
- this.depChecked = val
|
|
|
- this.menberList()
|
|
|
- },
|
|
|
- // 点击部门选择人员
|
|
|
- nodeClick (val) {
|
|
|
- this.menberList(val)
|
|
|
- this.$emit('onChecked',this.setParams())
|
|
|
- },
|
|
|
- checkChange (bool) {
|
|
|
- this.checkedMenbers = []
|
|
|
- },
|
|
|
- // 选中的营销区域数据
|
|
|
- onAreaChecked (val) {
|
|
|
- this.areaChecked = val
|
|
|
- this.agentList(val)
|
|
|
- this.handleCheckedChange()
|
|
|
- },
|
|
|
- // 执行全选
|
|
|
- handleCheckAllChange(val) {
|
|
|
- if (this.activeName === '组织架构') {
|
|
|
- let arr = this.menberData.map(e=>{
|
|
|
- return e.hrid
|
|
|
- })
|
|
|
- this.checkedMenbers = val ? arr : [];
|
|
|
- this.isIndeterminate = false;
|
|
|
- this.handleCheckedChange()
|
|
|
- } else {
|
|
|
- let arr = this.agentData.map(e=>{
|
|
|
- return e.sa_agentsid
|
|
|
- })
|
|
|
- this.checkedAgents = val ? arr : [];
|
|
|
- this.isIndeterminate2 = false;
|
|
|
- this.handleCheckedChange()
|
|
|
- }
|
|
|
- },
|
|
|
- // 设置数据
|
|
|
- setParams () {
|
|
|
- let param = {
|
|
|
- "isonlymanager_dept":this.allcheck1,
|
|
|
- "isonlymanager_agent":this.allcheck2,
|
|
|
- "departmentid":this.depChecked,
|
|
|
- "hrid":this.checkedMenbers,
|
|
|
- "sa_saleareaid":this.areaChecked,
|
|
|
- "sa_agentsid":this.checkedAgents
|
|
|
- }
|
|
|
- param[this.appidname] = this.dataid
|
|
|
-
|
|
|
- return param
|
|
|
- },
|
|
|
- // 执行单选
|
|
|
- handleCheckedChange (){
|
|
|
- if (this.activeName === '组织架构') {
|
|
|
- this.$refs['dep'].setCheckedKeysDep()
|
|
|
- console.log(this.setParams())
|
|
|
- this.$emit('onChecked',this.setParams())
|
|
|
- } else {}
|
|
|
- },
|
|
|
- },
|
|
|
- mounted () {
|
|
|
- },
|
|
|
- watch:{
|
|
|
- defaultData (val) {
|
|
|
- console.log(val)
|
|
|
- this.query_auth(val)
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-</script>
|
|
|
-<style>
|
|
|
-.panel .el-checkbox__input.is-checked+.el-checkbox__label{
|
|
|
- color:#777 !important;
|
|
|
-}
|
|
|
-</style>
|
|
|
-<style scoped>
|
|
|
-.panel{
|
|
|
- border:1px solid #CCCCCC;
|
|
|
- border-radius: 4px;
|
|
|
-}
|
|
|
-.tab p{
|
|
|
- flex:1;
|
|
|
- height: 39px;
|
|
|
- line-height: 39px;
|
|
|
- text-align: center;
|
|
|
- font-weight: 500;
|
|
|
- font-size: 14px;
|
|
|
- color:#999;
|
|
|
- border-bottom: 2px solid #eeeeee;
|
|
|
- cursor:pointer;
|
|
|
-}
|
|
|
-.tab-act{
|
|
|
- color:#3874F6 !important;
|
|
|
- border-bottom: 2px solid #3874F6 !important;
|
|
|
-}
|
|
|
-</style>
|