|
|
|
<template>
|
|
|
|
<div>
|
|
|
|
<Tabs active-key="key1" @on-click="onTabClick">
|
|
|
|
<Tab-pane label="待审核" key="key1">
|
|
|
|
<Row class="search-row">
|
|
|
|
<i-col span="24" class="search-col">
|
|
|
|
<Row class="row-style">
|
|
|
|
<i-input placeholder="请输入推广员姓名或手机号" class="search-select" v-model="searchShop"/>
|
|
|
|
<span class="search-span">选择日期</span>
|
|
|
|
<DatePicker v-model="date" class="left-15 date-picker" type="date"
|
|
|
|
placement="bottom-start"
|
|
|
|
split-panels placeholder="请选择日期">
|
|
|
|
</DatePicker>
|
|
|
|
<span class="search-span">零售公司</span>
|
|
|
|
<Select v-model="companyId" filterable class="search-select" @on-change="companySelect">
|
|
|
|
<Option v-for="(item,index) in companyList" :value="item.id" :key="index + item.id">{{ item.name }}</Option>
|
|
|
|
</Select>
|
|
|
|
<span class="search-span">店铺</span>
|
|
|
|
<Select v-model="selectedStore" filterable class="search-select">
|
|
|
|
<Option v-for="(item,index) in shopList" :value="item.id" :key="index + item.id">{{ item.name }}</Option>
|
|
|
|
</Select>
|
|
|
|
<Button type="primary" @click="searchCustomerDataBtnClick" class="search-btn">查询</Button>
|
|
|
|
|
|
|
|
</Row>
|
|
|
|
</i-col>
|
|
|
|
</Row>
|
|
|
|
<Table ref="table" :loading="loading" :columns="columns1" :data="data1" class="table-store" size="small" @on-row-dblclick="onDblClickRowLister">
|
|
|
|
|
|
|
|
<template slot="action" slot-scope="{row}">
|
|
|
|
<i-col span="12">
|
|
|
|
<Button type="success" class="router-btn"
|
|
|
|
@click="() => {stop(row)}">审核通过</Button>
|
|
|
|
</i-col>
|
|
|
|
<i-col span="12">
|
|
|
|
<Button type="error" class="router-btn"
|
|
|
|
@click="() => {show(row)}">审核不通过</Button>
|
|
|
|
</i-col>
|
|
|
|
</template>
|
|
|
|
|
|
|
|
</Table>
|
|
|
|
</Tab-pane>
|
|
|
|
<Tab-pane label="通过审核" key="key2">
|
|
|
|
<Row class="search-row">
|
|
|
|
<i-col span="24" class="search-col">
|
|
|
|
<Row class="row-style">
|
|
|
|
<i-input placeholder="请输入推广员姓名或手机号" class="search-select" v-model="searchShop"/>
|
|
|
|
<span class="search-span">选择日期</span>
|
|
|
|
<DatePicker v-model="date" class="left-15 date-picker" type="date"
|
|
|
|
placement="bottom-start"
|
|
|
|
split-panels placeholder="请选择日期">
|
|
|
|
</DatePicker>
|
|
|
|
<span class="search-span">零售公司</span>
|
|
|
|
<Select v-model="companyId" filterable class="search-select" @on-change="companySelect">
|
|
|
|
<Option v-for="(item,index) in companyList" :value="item.id" :key="index + item.id">{{ item.name }}</Option>
|
|
|
|
</Select>
|
|
|
|
<span class="search-span">店铺</span>
|
|
|
|
<Select v-model="selectedStore" filterable class="search-select">
|
|
|
|
<Option v-for="(item,index) in shopList" :value="item.id" :key="index + item.id">{{ item.name }}</Option>
|
|
|
|
</Select>
|
|
|
|
<Button type="primary" @click="searchCustomerDataBtnClick" class="search-btn">查询</Button>
|
|
|
|
|
|
|
|
</Row>
|
|
|
|
</i-col>
|
|
|
|
</Row>
|
|
|
|
<Table ref="table" :loading="loading" :columns="columns2" :data="data2" class="table-store" size="small" @on-row-dblclick="onDblClickRowLister">
|
|
|
|
|
|
|
|
</Table>
|
|
|
|
</Tab-pane>
|
|
|
|
<Tab-pane label="审核未通过" key="key3">
|
|
|
|
<Row class="search-row">
|
|
|
|
<i-col span="24" class="search-col">
|
|
|
|
<Row class="row-style">
|
|
|
|
<i-input placeholder="请输入推广员姓名或手机号" class="search-select" v-model="searchShop"/>
|
|
|
|
<span class="search-span">选择日期</span>
|
|
|
|
<DatePicker v-model="date" class="left-15 date-picker" type="date"
|
|
|
|
placement="bottom-start"
|
|
|
|
split-panels placeholder="请选择日期">
|
|
|
|
</DatePicker>
|
|
|
|
<span class="search-span">零售公司</span>
|
|
|
|
<Select v-model="companyId" filterable class="search-select" @on-change="companySelect">
|
|
|
|
<Option v-for="(item,index) in companyList" :value="item.id" :key="index + item.id">{{ item.name }}</Option>
|
|
|
|
</Select>
|
|
|
|
<span class="search-span">店铺</span>
|
|
|
|
<Select v-model="selectedStore" filterable class="search-select">
|
|
|
|
<Option v-for="(item,index) in shopList" :value="item.id" :key="index + item.id">{{ item.name }}</Option>
|
|
|
|
</Select>
|
|
|
|
<Button type="primary" @click="searchCustomerDataBtnClick" class="search-btn">查询</Button>
|
|
|
|
|
|
|
|
</Row>
|
|
|
|
</i-col>
|
|
|
|
</Row>
|
|
|
|
<Table ref="table" :loading="loading" :columns="columns3" :data="data3" class="table-store" size="small" @on-row-dblclick="onDblClickRowLister">
|
|
|
|
|
|
|
|
</Table>
|
|
|
|
</Tab-pane>
|
|
|
|
</Tabs>
|
|
|
|
|
|
|
|
<!-- 拒绝 -->
|
|
|
|
<Modal
|
|
|
|
v-model="isShow"
|
|
|
|
:title="showStoreName"
|
|
|
|
:footer-hide="true"
|
|
|
|
width="600"
|
|
|
|
class-name="vertical-center-modal"
|
|
|
|
@on-ok="ok">
|
|
|
|
<div slot="header">
|
|
|
|
<p>审核不通过原因</p>
|
|
|
|
</div>
|
|
|
|
<div>
|
|
|
|
<i-input type="textarea" :rows="4" placeholder="请填写审核不通过原因"></i-input>
|
|
|
|
</div>
|
|
|
|
<div style="margin-top:20px;text-align: center;">
|
|
|
|
<Button ghost type="primary" @click="refuse(rowData)">确定</Button>
|
|
|
|
</div>
|
|
|
|
</Modal>
|
|
|
|
|
|
|
|
<Page :total="total" :current="pageNum" :page-size="pageSize" show-elevator show-total
|
|
|
|
placement="top" @on-change="handlePage" class-name="ks-page"></Page>
|
|
|
|
</div>
|
|
|
|
</template>
|
|
|
|
|
|
|
|
<script>
|
|
|
|
export default {
|
|
|
|
name: "",
|
|
|
|
data() {
|
|
|
|
return {
|
|
|
|
tabIndex:0,
|
|
|
|
searchShop:null,
|
|
|
|
date:"",
|
|
|
|
companyId:0,
|
|
|
|
isShow: false,
|
|
|
|
showStoreName: '',
|
|
|
|
rowData:{},
|
|
|
|
//零售公司list
|
|
|
|
companyList: [],
|
|
|
|
selectedStore: 0,
|
|
|
|
shopList: [],
|
|
|
|
loading:false,
|
|
|
|
total: 0,
|
|
|
|
pageSize: 10,
|
|
|
|
pageNum: 1,
|
|
|
|
columns1: [
|
|
|
|
{
|
|
|
|
title: '序号',
|
|
|
|
key: 'number',
|
|
|
|
width:60
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '推广员姓名',
|
|
|
|
key: 'shopName',
|
|
|
|
width:120
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '推广员手机号',
|
|
|
|
key: 'shopPhone',
|
|
|
|
width:120
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '身份证号码',
|
|
|
|
key: 'shopCode',
|
|
|
|
width:160
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '银行卡号',
|
|
|
|
key: 'bankCard',
|
|
|
|
width:150
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '零售公司',
|
|
|
|
key: 'companyName',
|
|
|
|
width:150
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '零售公司编号',
|
|
|
|
key: 'companyCode',
|
|
|
|
width:80
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '店铺',
|
|
|
|
key: 'storeName',
|
|
|
|
width:160
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '店铺编号',
|
|
|
|
key: 'storeNO',
|
|
|
|
width:80
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '发展人',
|
|
|
|
key: 'fissionNum',
|
|
|
|
width:80
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '提交时间',
|
|
|
|
key: 'submitDate',
|
|
|
|
width:120
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '操作',
|
|
|
|
slot: 'action',
|
|
|
|
width:250
|
|
|
|
}
|
|
|
|
],
|
|
|
|
data1:[
|
|
|
|
{
|
|
|
|
shopName:'张继军',
|
|
|
|
shopPhone:'13819890111',
|
|
|
|
shopCode:'110001199010018171',
|
|
|
|
bankCard:'62210199918822121',
|
|
|
|
companyName:'上海零售公司',
|
|
|
|
companyCode:'601',
|
|
|
|
storeName:'上海波司登',
|
|
|
|
storeNO:'1001',
|
|
|
|
fissionNum:'王超看',
|
|
|
|
submitDate:'2020/05/21'
|
|
|
|
}
|
|
|
|
],
|
|
|
|
columns2: [
|
|
|
|
{
|
|
|
|
title: '序号',
|
|
|
|
key: 'number',
|
|
|
|
width:60
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '推广员姓名',
|
|
|
|
key: 'shopName',
|
|
|
|
width:120
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '推广员手机号',
|
|
|
|
key: 'shopPhone',
|
|
|
|
width:120
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '身份证号码',
|
|
|
|
key: 'shopCode',
|
|
|
|
width:160
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '银行卡号',
|
|
|
|
key: 'bankCard',
|
|
|
|
width:150
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '零售公司',
|
|
|
|
key: 'companyName',
|
|
|
|
width:150
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '零售公司编号',
|
|
|
|
key: 'companyCode',
|
|
|
|
width:80
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '店铺',
|
|
|
|
key: 'storeName',
|
|
|
|
width:160
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '店铺编号',
|
|
|
|
key: 'storeNO',
|
|
|
|
width:80
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '导购',
|
|
|
|
key: 'salesName',
|
|
|
|
width:80
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '提交时间',
|
|
|
|
key: 'submitDate',
|
|
|
|
width:120
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '审核时间',
|
|
|
|
key: 'checkDate',
|
|
|
|
width:120
|
|
|
|
},
|
|
|
|
],
|
|
|
|
data2:[
|
|
|
|
{
|
|
|
|
shopName:'张继军',
|
|
|
|
shopPhone:'13819890111',
|
|
|
|
shopCode:'110001199010018171',
|
|
|
|
bankCard:'62210199918822121',
|
|
|
|
companyName:'上海零售公司',
|
|
|
|
companyCode:'601',
|
|
|
|
storeName:'上海波司登',
|
|
|
|
storeNO:'1001',
|
|
|
|
salesName:'王超看',
|
|
|
|
submitDate:'2020/05/21',
|
|
|
|
checkDate:'2020/05/21',
|
|
|
|
}
|
|
|
|
],
|
|
|
|
columns3: [
|
|
|
|
{
|
|
|
|
title: '序号',
|
|
|
|
key: 'number',
|
|
|
|
width:60
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '推广员姓名',
|
|
|
|
key: 'shopName',
|
|
|
|
width:120
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '推广员手机号',
|
|
|
|
key: 'shopPhone',
|
|
|
|
width:120
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '身份证号码',
|
|
|
|
key: 'shopCode',
|
|
|
|
width:160
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '银行卡号',
|
|
|
|
key: 'bankCard',
|
|
|
|
width:150
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '零售公司',
|
|
|
|
key: 'companyName',
|
|
|
|
width:150
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '零售公司编号',
|
|
|
|
key: 'companyCode',
|
|
|
|
width:80
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '店铺',
|
|
|
|
key: 'storeName',
|
|
|
|
width:160
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '店铺编号',
|
|
|
|
key: 'storeNO',
|
|
|
|
width:80
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '导购',
|
|
|
|
key: 'salesName',
|
|
|
|
width:80
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '提交时间',
|
|
|
|
key: 'submitDate',
|
|
|
|
width:120
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '审核时间',
|
|
|
|
key: 'checkDate',
|
|
|
|
width:120
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '审核不通过原因',
|
|
|
|
key: 'refuseInfo',
|
|
|
|
width:120
|
|
|
|
},
|
|
|
|
],
|
|
|
|
data3:[
|
|
|
|
{
|
|
|
|
shopName:'张继军',
|
|
|
|
shopPhone:'13819890111',
|
|
|
|
shopCode:'110001199010018171',
|
|
|
|
bankCard:'62210199918822121',
|
|
|
|
companyName:'上海零售公司',
|
|
|
|
companyCode:'601',
|
|
|
|
storeName:'上海波司登',
|
|
|
|
storeNO:'1001',
|
|
|
|
salesName:'王超看',
|
|
|
|
submitDate:'2020/05/21',
|
|
|
|
checkDate:'2020/05/21',
|
|
|
|
refuseInfo:'信息不完善'
|
|
|
|
}
|
|
|
|
],
|
|
|
|
}
|
|
|
|
},
|
|
|
|
mounted: function () {
|
|
|
|
|
|
|
|
},
|
|
|
|
methods: {
|
|
|
|
//零售公司选择
|
|
|
|
companySelect: function () {
|
|
|
|
//加载店铺
|
|
|
|
this.downShopData(this.companyId);
|
|
|
|
this.selectedStore = 0;
|
|
|
|
},
|
|
|
|
downCompanyChange: function (formValidate) {
|
|
|
|
this.downShopData(formValidate.departIds);
|
|
|
|
},
|
|
|
|
searchCustomerDataBtnClick: function () {
|
|
|
|
this.pageNum = 1;
|
|
|
|
this.getCheckList();
|
|
|
|
},
|
|
|
|
// 双击row跳转详情页面
|
|
|
|
onDblClickRowLister: function (row) {
|
|
|
|
this.$router.push({path:'/shop/increase/manager/staff',query:{storeId:row.id}});
|
|
|
|
},
|
|
|
|
//切页处理
|
|
|
|
handlePage: function (value) {
|
|
|
|
this.pageNum = value;
|
|
|
|
this.getCheckList();
|
|
|
|
},
|
|
|
|
getCheckList() {
|
|
|
|
let that = this;
|
|
|
|
this.loading = true;
|
|
|
|
|
|
|
|
let request = {
|
|
|
|
userId: that.userId,
|
|
|
|
regionId: that.changeData(that.regionId),
|
|
|
|
companyId: that.changeData(that.companyId),
|
|
|
|
storeId: that.changeData(that.selectedStore),
|
|
|
|
pageNum: that.pageNum,
|
|
|
|
pageSize: that.pageSize,
|
|
|
|
code: that.searchShop
|
|
|
|
};
|
|
|
|
http.checkList(request, function (data) {
|
|
|
|
data = data.data;
|
|
|
|
that.loading = false;
|
|
|
|
if (data.code == "0000") {
|
|
|
|
that.data1 = [];
|
|
|
|
let datas = data.results;
|
|
|
|
//总页数
|
|
|
|
if (datas.total == null) {
|
|
|
|
that.total = 0;
|
|
|
|
} else {
|
|
|
|
that.total = datas.total;
|
|
|
|
}
|
|
|
|
if (datas.list == null) {
|
|
|
|
datas.list = [];
|
|
|
|
}
|
|
|
|
that.data1 = datas.list;
|
|
|
|
}
|
|
|
|
}, function (error) {
|
|
|
|
that.loading = false;
|
|
|
|
});
|
|
|
|
},
|
|
|
|
onTabClick(e){
|
|
|
|
this.tabIndex = e;
|
|
|
|
console.log('tabIndex',this.tabIndex);
|
|
|
|
},
|
|
|
|
ok() {
|
|
|
|
this.isShow = false;
|
|
|
|
},
|
|
|
|
// 拒绝审核
|
|
|
|
refuse(index) {
|
|
|
|
console.log(123);
|
|
|
|
this.isShow = false;
|
|
|
|
},
|
|
|
|
show(index) {
|
|
|
|
this.isShow = true;
|
|
|
|
this.rowData = index;
|
|
|
|
},
|
|
|
|
}
|
|
|
|
}
|
|
|
|
</script>
|
|
|
|
|
|
|
|
<style scoped>
|
|
|
|
|
|
|
|
.table-store {
|
|
|
|
margin-top: 20px;
|
|
|
|
}
|
|
|
|
.search-btn{
|
|
|
|
margin-left: 40px;
|
|
|
|
}
|
|
|
|
</style>
|