You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
765 lines
23 KiB
765 lines
23 KiB
2 years ago
|
<template>
|
||
|
<basic-container>
|
||
|
<div class="avue-crud">
|
||
|
<el-row :hidden="!search" style="padding:6px 18px">
|
||
|
<!-- 查询模块 -->
|
||
|
<el-form :inline="true" :model="query">
|
||
|
<el-form-item label="客户名称:">
|
||
|
<el-input v-model="query.clientName" placeholder="请输入客户名称"></el-input>
|
||
|
</el-form-item>
|
||
|
<el-form-item label="客户类型:">
|
||
|
<!-- <el-input v-model="query.typeService" placeholder="请输入客户类型;1 C端 2 B端"></el-input>-->
|
||
|
<el-select v-model="query.typeService" class="m-2" placeholder="请选择客户类型" >
|
||
|
<el-option
|
||
|
v-for="item in clientType"
|
||
|
:key="item.value"
|
||
|
:label="item.label"
|
||
|
:value="item.value"
|
||
|
/>
|
||
|
</el-select>
|
||
|
</el-form-item>
|
||
|
<el-form-item label="地址:">
|
||
|
<!-- <el-input v-model="query.bladeRegionProvinceId" placeholder="请输入省份"></el-input>-->
|
||
|
<el-cascader :options="optioner">
|
||
|
<template #default="{ node, data }">
|
||
|
<span>{{ data.label }}</span>
|
||
|
<span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
|
||
|
</template>
|
||
|
</el-cascader>
|
||
|
</el-form-item>
|
||
|
|
||
|
<!-- <el-form-item label="市:">-->
|
||
|
<!-- <el-input v-model="query.bladeRegionCityId" placeholder="请输入市"></el-input>-->
|
||
|
|
||
|
<!-- </el-form-item>-->
|
||
|
<!-- <el-form-item label="区/县:">-->
|
||
|
<!-- <el-input v-model="query.bladeRegionAreaId" placeholder="请输入区/县"></el-input>-->
|
||
|
<!-- -->
|
||
|
<!-- </el-form-item>-->
|
||
|
<el-form-item label="合同开始时间:">
|
||
|
<!-- <el-input v-model="query.contractStartTime" placeholder="请输入合同开始时间"></el-input>-->
|
||
|
<div class="block">
|
||
|
<!-- <span class="demonstration">With quick options</span>-->
|
||
|
<el-date-picker
|
||
|
v-model="dataShi"
|
||
|
type="daterange"
|
||
|
unlink-panels
|
||
|
range-separator="至"
|
||
|
start-placeholder="开始时间"
|
||
|
end-placeholder="结束时间"
|
||
|
:shortcuts="shortcuts"
|
||
|
:size="'default'"
|
||
|
/>
|
||
|
</div>
|
||
|
</el-form-item>
|
||
|
<!-- <el-form-item label="合同结束时间:">-->
|
||
|
<!-- <el-input v-model="query.contractEntTime" placeholder="请输入合同结束时间"></el-input>-->
|
||
|
<!-- </el-form-item>-->
|
||
|
<!-- 查询按钮 -->
|
||
|
<el-form-item>
|
||
|
<el-button type="primary" icon="el-icon-search" @click="searchChange">搜 索</el-button>
|
||
|
<el-button icon="el-icon-delete" @click="searchReset()">清 空</el-button>
|
||
|
</el-form-item>
|
||
|
</el-form>
|
||
|
</el-row>
|
||
|
<el-row>
|
||
|
<div class="avue-crud__header">
|
||
|
<!-- 头部左侧按钮模块 -->
|
||
|
<div class="avue-crud__left">
|
||
|
<el-button type="primary" icon="el-icon-plus" @click="handleAdd">新 增</el-button>
|
||
|
<el-button type="danger" icon="el-icon-delete" @click="handleDelete" plain>删 除</el-button>
|
||
|
</div>
|
||
|
<!-- 头部右侧按钮模块 -->
|
||
|
<div class="avue-crud__right">
|
||
|
<el-button icon="el-icon-refresh" @click="searchChange" circle></el-button>
|
||
|
<el-button icon="el-icon-search" @click="searchHide" circle></el-button>
|
||
|
</div>
|
||
|
</div>
|
||
|
</el-row>
|
||
|
<el-row>
|
||
|
<!-- 列表模块 -->
|
||
|
<el-table ref="table" v-loading="loading"
|
||
|
@selection-change="selectionChange"
|
||
|
:data="data"
|
||
|
:height="height"
|
||
|
style="width: 100%"
|
||
|
:border="option.border">
|
||
|
<el-table-column type="selection" v-if="option.selection" width="55" align="center"></el-table-column>
|
||
|
<el-table-column type="expand" v-if="option.expand" align="center"></el-table-column>
|
||
|
<el-table-column v-if="option.index" label="序号" type="index" width="60" align="center">
|
||
|
</el-table-column>
|
||
|
<template v-for="(item,index) in option.column">
|
||
|
<!-- table字段 -->
|
||
|
<el-table-column v-if="item.hide!==true"
|
||
|
:prop="item.prop"
|
||
|
:label="item.label"
|
||
|
:width="item.width"
|
||
|
:key="index" align="center">
|
||
|
</el-table-column>
|
||
|
</template>
|
||
|
<!-- 操作栏模块 -->
|
||
|
<el-table-column prop="menu" label="操作" :width="300" align="center">
|
||
|
<template #="{row}">
|
||
|
<el-button type="primary" text icon="el-icon-view" @click="handleView(row)">查看</el-button>
|
||
|
<el-button type="primary" text icon="el-icon-edit" @click="handleEdit(row)">编辑</el-button>
|
||
|
<el-button type="primary" text icon="el-icon-delete" @click="rowDel(row)">删除</el-button>
|
||
|
<el-button type="primary" text icon="el-icon-setting" @click="handleDrawer(row)">子表配置</el-button>
|
||
|
</template>
|
||
|
</el-table-column>
|
||
|
</el-table>
|
||
|
</el-row>
|
||
|
<el-row>
|
||
|
<div class="avue-crud__pagination" style="width:100%">
|
||
|
<!-- 分页模块 -->
|
||
|
<el-pagination align="right"
|
||
|
background
|
||
|
@size-change="sizeChange"
|
||
|
@current-change="currentChange"
|
||
|
:current-page="page.currentPage"
|
||
|
:page-sizes="[10, 20, 30, 40, 50, 100]"
|
||
|
:page-size="page.pageSize"
|
||
|
layout="total, sizes, prev, pager, next, jumper"
|
||
|
:total="page.total">
|
||
|
</el-pagination>
|
||
|
</div>
|
||
|
</el-row>
|
||
|
<!-- 表单模块 -->
|
||
|
<el-dialog :title="title"
|
||
|
v-model="box"
|
||
|
width="30%"
|
||
|
:before-close="beforeClose"
|
||
|
append-to-body>
|
||
|
<el-form :disabled="view" ref="form" :model="form" label-width="100px">
|
||
|
<!-- 表单字段 -->
|
||
|
<el-form-item label="客户名称" prop="clientName">
|
||
|
<el-input v-model="form.clientName" placeholder="请输入客户名称" style="width: 100%"/>
|
||
|
</el-form-item>
|
||
|
<el-form-item label="客户类型" prop="typeService">
|
||
|
<!-- <el-input v-model="form.typeService" placeholder="请输入客户类型"/>-->
|
||
|
<!-- <el-input v-model="form.typeService" placeholder="请输入客户类型;1 C端 2 B端"/>-->
|
||
|
<el-select v-model="form.typeService" class="m-2" placeholder="请选择客户类型" style="width: 100%">
|
||
|
<el-option
|
||
|
v-for="item in clientType"
|
||
|
:key="item.value"
|
||
|
:label="item.label"
|
||
|
:value="item.value"
|
||
|
|
||
|
/>
|
||
|
</el-select>
|
||
|
</el-form-item>
|
||
|
<el-form-item label="地址" prop="bladeRegionProvinceId" >
|
||
|
<!-- <el-input v-model="form.bladeRegionProvinceId" placeholder="请输入省份"/>-->
|
||
|
<el-cascader :options="optioner" style="width: 100%">
|
||
|
<template #default="{ node, data }">
|
||
|
<span>{{ data.label }}</span>
|
||
|
<span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
|
||
|
</template>
|
||
|
</el-cascader>
|
||
|
</el-form-item>
|
||
|
<!-- <el-form-item label="市" prop="bladeRegionCityId">-->
|
||
|
<!-- <el-input v-model="form.bladeRegionCityId" placeholder="请输入市"/>-->
|
||
|
<!-- </el-form-item>-->
|
||
|
<!-- <el-form-item label="区/县" prop="bladeRegionAreaId">-->
|
||
|
<!-- <el-input v-model="form.bladeRegionAreaId" placeholder="请输入区/县"/>-->
|
||
|
<!-- </el-form-item>-->
|
||
|
<el-form-item label="合同附件" prop="leaseAccessories" style="width: 100%">
|
||
|
<!-- <el-input v-model="form.leaseAccessories" placeholder="请输入合同附件"/>-->
|
||
|
<el-upload
|
||
|
v-model:file-list="fileList"
|
||
|
class="upload-demo"
|
||
|
action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"
|
||
|
multiple
|
||
|
:on-preview="handlePreview"
|
||
|
:on-remove="handleRemove"
|
||
|
:before-remove="beforeRemove"
|
||
|
:limit="3"
|
||
|
:on-exceed="handleExceed"
|
||
|
>
|
||
|
<el-button >上传</el-button>
|
||
|
<template #tip>
|
||
|
<div class="el-upload__tip">
|
||
|
大小不超过500KB的jpg/png文件。
|
||
|
</div>
|
||
|
</template>
|
||
|
</el-upload>
|
||
|
</el-form-item>
|
||
|
<el-form-item label="合同开始时间" prop="contractStartTime">
|
||
|
<!-- <el-input v-model="form.contractStartTime" placeholder="请输入合同开始时间"/>-->
|
||
|
<div class="demo-date-picker" style="width: 60%">
|
||
|
<div class="block">
|
||
|
<!-- <span class="demonstration">Default</span>-->
|
||
|
<el-date-picker
|
||
|
v-model="form.contractStartTime"
|
||
|
type="date"
|
||
|
placeholder="选择时间"
|
||
|
/>
|
||
|
</div>
|
||
|
</div>
|
||
|
</el-form-item>
|
||
|
|
||
|
<el-form-item label="合同结束时间" prop="contractEntTime">
|
||
|
<!-- <el-input v-model="form.contractEntTime" placeholder="请输入合同结束时间"/>-->
|
||
|
<div class="demo-date-picker">
|
||
|
<div class="block">
|
||
|
<!-- <span class="demonstration">Default</span>-->
|
||
|
<el-date-picker
|
||
|
v-model="form.contractEntTime"
|
||
|
type="date"
|
||
|
placeholder="选择时间"
|
||
|
/>
|
||
|
</div>
|
||
|
</div>
|
||
|
</el-form-item>
|
||
|
</el-form>
|
||
|
<!-- 表单按钮 -->
|
||
|
<template #footer>
|
||
|
<span v-if="!view" class="dialog-footer">
|
||
|
<el-button type="primary" icon="el-icon-circle-check" @click="handleSubmit">提 交</el-button>
|
||
|
<el-button icon="el-icon-circle-close" @click="box = false">取 消</el-button>
|
||
|
</span>
|
||
|
</template>
|
||
|
</el-dialog>
|
||
|
<el-drawer
|
||
|
title="子表操作"
|
||
|
append-to-body
|
||
|
size="60%"
|
||
|
v-model="drawer"
|
||
|
:direction="direction"
|
||
|
:before-close="handleDrawerClose">
|
||
|
<BasicShopSub :mainId="basicClientId"></BasicShopSub>
|
||
|
</el-drawer>
|
||
|
</div>
|
||
|
</basic-container>
|
||
|
</template>
|
||
|
|
||
|
<script >
|
||
|
import {getList, getDetail, add, update, remove} from "@/api/basicdata/basicClient";
|
||
|
import option from "@/option/basicdata/basicClient";
|
||
|
import {mapGetters} from "vuex";
|
||
|
import BasicShopSub from "@/views/basicdata/brand/basicShopSub.vue";
|
||
|
import { getDictionaryBiz } from '@/api/system/dict'
|
||
|
|
||
|
export default {
|
||
|
components:{
|
||
|
BasicShopSub
|
||
|
},
|
||
|
data () {
|
||
|
return {
|
||
|
height: 0,
|
||
|
// 主键
|
||
|
basicClientId: '',
|
||
|
fileList:[], // 上传数据
|
||
|
// 弹框标题
|
||
|
title: '',
|
||
|
// 是否展示弹框
|
||
|
box: false,
|
||
|
// 是否展示抽屉
|
||
|
drawer: false,
|
||
|
// 抽屉方向
|
||
|
direction: 'rtl',
|
||
|
// 是否显示查询
|
||
|
search: true,
|
||
|
// 加载中
|
||
|
loading: true,
|
||
|
// 是否为查看模式
|
||
|
view: false,
|
||
|
// 查询信息
|
||
|
query: {},
|
||
|
//查询时间
|
||
|
dataShi:'',
|
||
|
// 分页信息
|
||
|
page: {
|
||
|
currentPage: 1,
|
||
|
pageSize: 10,
|
||
|
total: 40
|
||
|
},
|
||
|
|
||
|
// 表单数据
|
||
|
form: {
|
||
|
contractStartTime:'',
|
||
|
contractEntTime:'',
|
||
|
},
|
||
|
// 选择行
|
||
|
selectionList: [],
|
||
|
// 表单配置
|
||
|
option: option,
|
||
|
// 表单列表
|
||
|
data: [],
|
||
|
clientType:[],
|
||
|
optioner:[
|
||
|
{
|
||
|
value: 'guide',
|
||
|
label: 'Guide',
|
||
|
children: [
|
||
|
{
|
||
|
value: 'disciplines',
|
||
|
label: 'Disciplines',
|
||
|
children: [
|
||
|
{
|
||
|
value: 'consistency',
|
||
|
label: 'Consistency',
|
||
|
},
|
||
|
{
|
||
|
value: 'feedback',
|
||
|
label: 'Feedback',
|
||
|
},
|
||
|
{
|
||
|
value: 'efficiency',
|
||
|
label: 'Efficiency',
|
||
|
},
|
||
|
{
|
||
|
value: 'controllability',
|
||
|
label: 'Controllability',
|
||
|
},
|
||
|
],
|
||
|
},
|
||
|
{
|
||
|
value: 'navigation',
|
||
|
label: 'Navigation',
|
||
|
children: [
|
||
|
{
|
||
|
value: 'side nav',
|
||
|
label: 'Side Navigation',
|
||
|
},
|
||
|
{
|
||
|
value: 'top nav',
|
||
|
label: 'Top Navigation',
|
||
|
},
|
||
|
],
|
||
|
},
|
||
|
],
|
||
|
},
|
||
|
{
|
||
|
value: 'component',
|
||
|
label: 'Component',
|
||
|
children: [
|
||
|
{
|
||
|
value: 'basic',
|
||
|
label: 'Basic',
|
||
|
children: [
|
||
|
{
|
||
|
value: 'layout',
|
||
|
label: 'Layout',
|
||
|
},
|
||
|
{
|
||
|
value: 'color',
|
||
|
label: 'Color',
|
||
|
},
|
||
|
{
|
||
|
value: 'typography',
|
||
|
label: 'Typography',
|
||
|
},
|
||
|
{
|
||
|
value: 'icon',
|
||
|
label: 'Icon',
|
||
|
},
|
||
|
{
|
||
|
value: 'button',
|
||
|
label: 'Button',
|
||
|
},
|
||
|
],
|
||
|
},
|
||
|
{
|
||
|
value: 'form',
|
||
|
label: 'Form',
|
||
|
children: [
|
||
|
{
|
||
|
value: 'radio',
|
||
|
label: 'Radio',
|
||
|
},
|
||
|
{
|
||
|
value: 'checkbox',
|
||
|
label: 'Checkbox',
|
||
|
},
|
||
|
{
|
||
|
value: 'input',
|
||
|
label: 'Input',
|
||
|
},
|
||
|
{
|
||
|
value: 'input-number',
|
||
|
label: 'InputNumber',
|
||
|
},
|
||
|
{
|
||
|
value: 'select',
|
||
|
label: 'Select',
|
||
|
},
|
||
|
{
|
||
|
value: 'cascader',
|
||
|
label: 'Cascader',
|
||
|
},
|
||
|
{
|
||
|
value: 'switch',
|
||
|
label: 'Switch',
|
||
|
},
|
||
|
{
|
||
|
value: 'slider',
|
||
|
label: 'Slider',
|
||
|
},
|
||
|
{
|
||
|
value: 'time-picker',
|
||
|
label: 'TimePicker',
|
||
|
},
|
||
|
{
|
||
|
value: 'date-picker',
|
||
|
label: 'DatePicker',
|
||
|
},
|
||
|
{
|
||
|
value: 'datetime-picker',
|
||
|
label: 'DateTimePicker',
|
||
|
},
|
||
|
{
|
||
|
value: 'upload',
|
||
|
label: 'Upload',
|
||
|
},
|
||
|
{
|
||
|
value: 'rate',
|
||
|
label: 'Rate',
|
||
|
},
|
||
|
{
|
||
|
value: 'form',
|
||
|
label: 'Form',
|
||
|
},
|
||
|
],
|
||
|
},
|
||
|
{
|
||
|
value: 'data',
|
||
|
label: 'Data',
|
||
|
children: [
|
||
|
{
|
||
|
value: 'table',
|
||
|
label: 'Table',
|
||
|
},
|
||
|
{
|
||
|
value: 'tag',
|
||
|
label: 'Tag',
|
||
|
},
|
||
|
{
|
||
|
value: 'progress',
|
||
|
label: 'Progress',
|
||
|
},
|
||
|
{
|
||
|
value: 'tree',
|
||
|
label: 'Tree',
|
||
|
},
|
||
|
{
|
||
|
value: 'pagination',
|
||
|
label: 'Pagination',
|
||
|
},
|
||
|
{
|
||
|
value: 'badge',
|
||
|
label: 'Badge',
|
||
|
},
|
||
|
],
|
||
|
},
|
||
|
{
|
||
|
value: 'notice',
|
||
|
label: 'Notice',
|
||
|
children: [
|
||
|
{
|
||
|
value: 'alert',
|
||
|
label: 'Alert',
|
||
|
},
|
||
|
{
|
||
|
value: 'loading',
|
||
|
label: 'Loading',
|
||
|
},
|
||
|
{
|
||
|
value: 'message',
|
||
|
label: 'Message',
|
||
|
},
|
||
|
{
|
||
|
value: 'message-box',
|
||
|
label: 'MessageBox',
|
||
|
},
|
||
|
{
|
||
|
value: 'notification',
|
||
|
label: 'Notification',
|
||
|
},
|
||
|
],
|
||
|
},
|
||
|
{
|
||
|
value: 'navigation',
|
||
|
label: 'Navigation',
|
||
|
children: [
|
||
|
{
|
||
|
value: 'menu',
|
||
|
label: 'Menu',
|
||
|
},
|
||
|
{
|
||
|
value: 'tabs',
|
||
|
label: 'Tabs',
|
||
|
},
|
||
|
{
|
||
|
value: 'breadcrumb',
|
||
|
label: 'Breadcrumb',
|
||
|
},
|
||
|
{
|
||
|
value: 'dropdown',
|
||
|
label: 'Dropdown',
|
||
|
},
|
||
|
{
|
||
|
value: 'steps',
|
||
|
label: 'Steps',
|
||
|
},
|
||
|
],
|
||
|
},
|
||
|
{
|
||
|
value: 'others',
|
||
|
label: 'Others',
|
||
|
children: [
|
||
|
{
|
||
|
value: 'dialog',
|
||
|
label: 'Dialog',
|
||
|
},
|
||
|
{
|
||
|
value: 'tooltip',
|
||
|
label: 'Tooltip',
|
||
|
},
|
||
|
{
|
||
|
value: 'popover',
|
||
|
label: 'Popover',
|
||
|
},
|
||
|
{
|
||
|
value: 'card',
|
||
|
label: 'Card',
|
||
|
},
|
||
|
{
|
||
|
value: 'carousel',
|
||
|
label: 'Carousel',
|
||
|
},
|
||
|
{
|
||
|
value: 'collapse',
|
||
|
label: 'Collapse',
|
||
|
},
|
||
|
],
|
||
|
},
|
||
|
],
|
||
|
},
|
||
|
{
|
||
|
value: 'resource',
|
||
|
label: 'Resource',
|
||
|
children: [
|
||
|
{
|
||
|
value: 'axure',
|
||
|
label: 'Axure Components',
|
||
|
},
|
||
|
{
|
||
|
value: 'sketch',
|
||
|
label: 'Sketch Templates',
|
||
|
},
|
||
|
{
|
||
|
value: 'docs',
|
||
|
label: 'Design Documentation',
|
||
|
},
|
||
|
],
|
||
|
},
|
||
|
],
|
||
|
shortcuts : [
|
||
|
{
|
||
|
text: '上周',
|
||
|
value: () => {
|
||
|
const end = new Date()
|
||
|
const start = new Date()
|
||
|
start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
|
||
|
return [start, end]
|
||
|
},
|
||
|
},
|
||
|
{
|
||
|
text: '上个月',
|
||
|
value: () => {
|
||
|
const end = new Date()
|
||
|
const start = new Date()
|
||
|
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
|
||
|
return [start, end]
|
||
|
},
|
||
|
},
|
||
|
{
|
||
|
text: '最近3个月',
|
||
|
value: () => {
|
||
|
const end = new Date()
|
||
|
const start = new Date()
|
||
|
start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
|
||
|
return [start, end]
|
||
|
},
|
||
|
},
|
||
|
]
|
||
|
|
||
|
}
|
||
|
},
|
||
|
created() {
|
||
|
|
||
|
},
|
||
|
mounted () {
|
||
|
this.init();
|
||
|
this.onLoad(this.page);
|
||
|
},
|
||
|
computed: {
|
||
|
...mapGetters(["permission"]),
|
||
|
ids () {
|
||
|
let ids = [];
|
||
|
this.selectionList.forEach(ele => {
|
||
|
ids.push(ele.id);
|
||
|
});
|
||
|
return ids.join(",");
|
||
|
}
|
||
|
},
|
||
|
methods: {
|
||
|
//
|
||
|
handlePreview(){
|
||
|
|
||
|
},
|
||
|
//
|
||
|
handleRemove(){
|
||
|
|
||
|
},
|
||
|
//
|
||
|
beforeRemove(){
|
||
|
|
||
|
},
|
||
|
//
|
||
|
handleExceed(){
|
||
|
|
||
|
},
|
||
|
init () {
|
||
|
//字典
|
||
|
getDictionaryBiz("").then(res=>{
|
||
|
this.clientType = res.data.data;
|
||
|
console.log("........",res);
|
||
|
})
|
||
|
|
||
|
this.height = this.setPx(document.body.clientHeight - 340);
|
||
|
},
|
||
|
searchHide () {
|
||
|
this.search = !this.search;
|
||
|
},
|
||
|
searchChange () {
|
||
|
this.onLoad(this.page);
|
||
|
},
|
||
|
searchReset () {
|
||
|
this.query = {};
|
||
|
this.page.currentPage = 1;
|
||
|
this.onLoad(this.page);
|
||
|
},
|
||
|
handleSubmit () {
|
||
|
if (!this.form.id) {
|
||
|
add(this.form).then(() => {
|
||
|
this.box = false;
|
||
|
this.onLoad(this.page);
|
||
|
this.$message({
|
||
|
type: "success",
|
||
|
message: "操作成功!"
|
||
|
});
|
||
|
});
|
||
|
} else {
|
||
|
update(this.form).then(() => {
|
||
|
this.box = false;
|
||
|
this.onLoad(this.page);
|
||
|
this.$message({
|
||
|
type: "success",
|
||
|
message: "操作成功!"
|
||
|
});
|
||
|
})
|
||
|
}
|
||
|
},
|
||
|
handleAdd () {
|
||
|
this.title = '新增'
|
||
|
this.form = {}
|
||
|
this.box = true
|
||
|
},
|
||
|
handleEdit (row) {
|
||
|
this.title = '编辑'
|
||
|
this.box = true
|
||
|
getDetail(row.id).then(res => {
|
||
|
this.form = res.data.data;
|
||
|
});
|
||
|
},
|
||
|
handleView (row) {
|
||
|
this.title = '查看'
|
||
|
this.view = true;
|
||
|
this.box = true;
|
||
|
getDetail(row.id).then(res => {
|
||
|
this.form = res.data.data;
|
||
|
});
|
||
|
},
|
||
|
handleDrawer(row) {
|
||
|
this.basicClientId = row.id;
|
||
|
this.drawer = true;
|
||
|
},
|
||
|
handleDrawerClose(){
|
||
|
this.basicClientId = '';
|
||
|
this.drawer = false;
|
||
|
},
|
||
|
handleDelete () {
|
||
|
if (this.selectionList.length === 0) {
|
||
|
this.$message.warning("请选择至少一条数据");
|
||
|
return;
|
||
|
}
|
||
|
this.$confirm("确定将选择数据删除?", {
|
||
|
confirmButtonText: "确定",
|
||
|
cancelButtonText: "取消",
|
||
|
type: "warning"
|
||
|
})
|
||
|
.then(() => {
|
||
|
return remove(this.ids);
|
||
|
})
|
||
|
.then(() => {
|
||
|
this.selectionClear();
|
||
|
this.onLoad(this.page);
|
||
|
this.$message({
|
||
|
type: "success",
|
||
|
message: "操作成功!"
|
||
|
});
|
||
|
});
|
||
|
},
|
||
|
rowDel (row) {
|
||
|
this.$confirm("确定将选择数据删除?", {
|
||
|
confirmButtonText: "确定",
|
||
|
cancelButtonText: "取消",
|
||
|
type: "warning"
|
||
|
})
|
||
|
.then(() => {
|
||
|
return remove(row.id);
|
||
|
})
|
||
|
.then(() => {
|
||
|
this.onLoad(this.page);
|
||
|
this.$message({
|
||
|
type: "success",
|
||
|
message: "操作成功!"
|
||
|
});
|
||
|
});
|
||
|
},
|
||
|
beforeClose (done) {
|
||
|
done()
|
||
|
this.form = {};
|
||
|
this.view = false;
|
||
|
},
|
||
|
selectionChange (list) {
|
||
|
this.selectionList = list;
|
||
|
},
|
||
|
selectionClear () {
|
||
|
this.selectionList = [];
|
||
|
this.$refs.table.clearSelection();
|
||
|
},
|
||
|
currentChange (currentPage) {
|
||
|
this.page.currentPage = currentPage;
|
||
|
this.onLoad(this.page);
|
||
|
},
|
||
|
sizeChange (pageSize) {
|
||
|
this.page.pageSize = pageSize;
|
||
|
this.onLoad(this.page);
|
||
|
},
|
||
|
onLoad (page, params = {}) {
|
||
|
this.loading = true;
|
||
|
getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
|
||
|
const data = res.data.data;
|
||
|
this.page.total = data.total;
|
||
|
this.data = data.records;
|
||
|
this.loading = false;
|
||
|
this.selectionClear();
|
||
|
});
|
||
|
}
|
||
|
}
|
||
|
};
|
||
|
</script>
|
||
|
|