1056 lines
32 KiB
Vue
1056 lines
32 KiB
Vue
<template>
|
|
<div class="main">
|
|
<div class="content">
|
|
<el-radio-group
|
|
class="header-radio"
|
|
v-model="selectedTab"
|
|
@input="handleChange"
|
|
>
|
|
<template v-if="String(deptId).substring(0, 3) === '875'">
|
|
<el-radio-button
|
|
label="0"
|
|
:disabled="isPublic"
|
|
:class="{ 'btn-disabled': isPublic }"
|
|
>个人</el-radio-button
|
|
>
|
|
<el-radio-button
|
|
label="1"
|
|
:disabled="isPublic"
|
|
:class="{ 'btn-disabled': isPublic }"
|
|
>商户</el-radio-button
|
|
>
|
|
<el-radio-button
|
|
label="2"
|
|
:disabled="isPrivate"
|
|
:class="{ 'btn-disabled': isPrivate }"
|
|
>企业</el-radio-button
|
|
>
|
|
</template>
|
|
<template v-else>
|
|
<el-radio-button
|
|
label="2"
|
|
:disabled="isPrivate"
|
|
:class="{ 'btn-disabled': isPrivate }"
|
|
>企业</el-radio-button
|
|
>
|
|
<el-radio-button
|
|
label="0"
|
|
:disabled="isPublic"
|
|
:class="{ 'btn-disabled': isPublic }"
|
|
>个人</el-radio-button
|
|
>
|
|
<el-radio-button
|
|
label="1"
|
|
:disabled="isPublic"
|
|
:class="{ 'btn-disabled': isPublic }"
|
|
>商户</el-radio-button
|
|
>
|
|
</template>
|
|
</el-radio-group>
|
|
<div class="searchForm">
|
|
<el-form
|
|
ref="searchForm"
|
|
:model="searchForm"
|
|
label-width="80px"
|
|
:inline="true"
|
|
>
|
|
<el-form-item label="柜员名称">
|
|
<el-input
|
|
v-model="searchForm.visName"
|
|
placeholder="请输入"
|
|
@blur="handleSearch"
|
|
clearable
|
|
@clear="handleSearch"
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item label="柜员号" class="staff-id-filter">
|
|
<el-input
|
|
v-model="searchForm.visId"
|
|
placeholder="请输入"
|
|
@blur="handleSearch"
|
|
clearable
|
|
@clear="handleSearch"
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item label="走访时间">
|
|
<el-date-picker
|
|
v-model="searchForm.visTime"
|
|
type="date"
|
|
@change="handleSearch"
|
|
value-format="yyyy-MM-dd"
|
|
></el-date-picker>
|
|
</el-form-item>
|
|
<el-form-item label="客户证件号" label-width="120" v-if="selectedTab === '0'">
|
|
<el-input
|
|
v-model="searchForm.custIdc"
|
|
placeholder="请输入"
|
|
@blur="handleSearch"
|
|
clearable
|
|
@clear="handleSearch"
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item label="企业（商户）统信码" label-width="140" v-else>
|
|
<el-input
|
|
v-model="searchForm.socialCreditCode"
|
|
placeholder="请输入"
|
|
@blur="handleSearch"
|
|
clearable
|
|
@clear="handleSearch"
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item label="异常标签" v-if="is875">
|
|
<el-select
|
|
v-model="searchForm.abnormalVisitTag"
|
|
placeholder="请输入"
|
|
@blur="handleSearch"
|
|
clearable
|
|
@clear="handleSearch"
|
|
>
|
|
<el-option label="正常" value="0"></el-option>
|
|
<el-option label="走访频率异常" value="1"></el-option>
|
|
<el-option label="走访持续时长异常" value="2"></el-option>
|
|
<el-option label="签退时间异常" value="3"></el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label="营销方式">
|
|
<el-select
|
|
v-model="searchForm.marketingWay"
|
|
placeholder="请选择"
|
|
@blur="handleSearch"
|
|
clearable
|
|
@clear="handleSearch"
|
|
>
|
|
<el-option label="实地" value="0"></el-option>
|
|
<el-option label="电话" value="1"></el-option>
|
|
<el-option label="短信" value="2"></el-option>
|
|
<el-option label="拜访未触达" value="3"></el-option>
|
|
<el-option label="其他" value="4"></el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label="走访结果">
|
|
<el-select
|
|
v-model="searchForm.interRes"
|
|
placeholder="请选择"
|
|
@blur="handleSearch"
|
|
clearable
|
|
@clear="handleSearch"
|
|
>
|
|
<el-option label="已走访" value="0"></el-option>
|
|
<el-option label="过期未走访" value="1"></el-option>
|
|
<el-option label="走访未触达" value="2"></el-option>
|
|
<el-option label="待走访" value="3"></el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item>
|
|
<el-button
|
|
type="primary"
|
|
size="small"
|
|
class="common-search-btn"
|
|
@click="handleSearch"
|
|
>查询</el-button
|
|
>
|
|
<el-button
|
|
size="small"
|
|
class="common-reset-btn"
|
|
type="plain"
|
|
@click="resetFilters"
|
|
>重置</el-button
|
|
>
|
|
</el-form-item>
|
|
</el-form>
|
|
</div>
|
|
<section class="operate-cnt">
|
|
<right-toolbar
|
|
@queryTable="handleRefersh"
|
|
:columns="is875 ? [...columns, ...columns875] : columns"
|
|
style="margin-left: auto"
|
|
></right-toolbar>
|
|
</section>
|
|
<el-table
|
|
:data="tableData"
|
|
style="width: 100%"
|
|
class="tableData"
|
|
v-loading="Loading"
|
|
max-height="600"
|
|
>
|
|
<el-table-column
|
|
align="left"
|
|
prop="campaignName"
|
|
label="活动名称"
|
|
show-overflow-tooltip
|
|
width="150px"
|
|
v-if="columns[0].visible"
|
|
></el-table-column>
|
|
<el-table-column
|
|
align="left"
|
|
prop="visName"
|
|
label="柜员名称"
|
|
show-overflow-tooltip
|
|
width="150px"
|
|
v-if="columns[1].visible"
|
|
></el-table-column>
|
|
<el-table-column
|
|
align="left"
|
|
prop="visId"
|
|
label="柜员号"
|
|
show-overflow-tooltip
|
|
width="150px"
|
|
v-if="columns[2].visible"
|
|
></el-table-column>
|
|
<el-table-column
|
|
align="left"
|
|
prop="deptId"
|
|
label="柜员部门"
|
|
show-overflow-tooltip
|
|
width="150px"
|
|
v-if="columns[3].visible"
|
|
></el-table-column>
|
|
<el-table-column
|
|
align="left"
|
|
prop="deptName"
|
|
label="部门名称"
|
|
show-overflow-tooltip
|
|
width="200px"
|
|
v-if="columns[4].visible"
|
|
></el-table-column>
|
|
<el-table-column
|
|
align="left"
|
|
prop="custName"
|
|
label="走访客户名称"
|
|
show-overflow-tooltip
|
|
width="150px"
|
|
v-if="columns[5].visible"
|
|
>
|
|
<template slot-scope="scope">
|
|
<el-button
|
|
v-if="isPersonalFeedbackTab && getPersonalViewCustId(scope.row)"
|
|
type="text"
|
|
@click="openPersonalView(scope.row)"
|
|
>{{ scope.row.custName }}</el-button>
|
|
<span v-else>{{ scope.row.custName }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column
|
|
align="left"
|
|
prop="custIdc"
|
|
label="客户证件号"
|
|
show-overflow-tooltip
|
|
width="200px"
|
|
v-if="columns[6].visible && selectedTab === '0'"
|
|
>
|
|
<template slot-scope="scope">
|
|
<el-button
|
|
v-if="isPersonalFeedbackTab && getPersonalViewCustId(scope.row)"
|
|
type="text"
|
|
@click="openPersonalView(scope.row)"
|
|
>{{ scope.row.custIdc }}</el-button>
|
|
<span v-else>{{ scope.row.custIdc || "-" }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column
|
|
align="left"
|
|
prop="socialCreditCode"
|
|
label="企业（商户）统信码"
|
|
show-overflow-tooltip
|
|
width="150px"
|
|
v-if="columns[7].visible && selectedTab !== '0'"
|
|
></el-table-column>
|
|
<el-table-column
|
|
align="left"
|
|
prop="custType"
|
|
label="客户类型"
|
|
show-overflow-tooltip
|
|
v-if="columns[8].visible"
|
|
>
|
|
<template slot-scope="scope">
|
|
<span v-if="scope.row.custType == '0'">个人</span>
|
|
<span v-if="scope.row.custType == '1'">商户</span>
|
|
<span v-if="scope.row.custType == '2'">企业</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column
|
|
align="left"
|
|
prop="signInTime"
|
|
label="签到时间"
|
|
show-overflow-tooltip
|
|
width="180px"
|
|
v-if="columns[9].visible"
|
|
></el-table-column>
|
|
<el-table-column
|
|
align="left"
|
|
prop="signOutTime"
|
|
label="签退时间"
|
|
show-overflow-tooltip
|
|
width="180px"
|
|
v-if="columns[10].visible"
|
|
></el-table-column>
|
|
<el-table-column
|
|
align="left"
|
|
prop="signInAddress"
|
|
label="签到地址"
|
|
show-overflow-tooltip
|
|
width="150px"
|
|
v-if="columns[11].visible"
|
|
></el-table-column>
|
|
<el-table-column
|
|
align="left"
|
|
prop="signOutAddress"
|
|
label="签退地址"
|
|
show-overflow-tooltip
|
|
width="150px"
|
|
v-if="columns[12].visible"
|
|
></el-table-column>
|
|
<el-table-column
|
|
align="left"
|
|
prop="signInCoordinate"
|
|
label="签到坐标"
|
|
show-overflow-tooltip
|
|
width="150px"
|
|
v-if="columns[13].visible"
|
|
></el-table-column>
|
|
<el-table-column
|
|
align="left"
|
|
prop="signOutCoordinate"
|
|
label="签退坐标"
|
|
show-overflow-tooltip
|
|
width="150px"
|
|
v-if="columns[14].visible"
|
|
></el-table-column>
|
|
<el-table-column
|
|
align="left"
|
|
prop="marketingWay"
|
|
label="营销方式"
|
|
show-overflow-tooltip
|
|
width="120px"
|
|
>
|
|
<template slot-scope="scope">
|
|
<span v-if="scope.row.marketingWay == '0'">实地</span>
|
|
<span v-else-if="scope.row.marketingWay == '1'">电话</span>
|
|
<span v-else-if="scope.row.marketingWay == '2'">短信</span>
|
|
<span v-else-if="scope.row.marketingWay == '3'">拜访未触达</span>
|
|
<span v-else-if="scope.row.marketingWay == '4'">其他</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column
|
|
align="left"
|
|
prop="interRes"
|
|
label="走访结果"
|
|
show-overflow-tooltip
|
|
width="120px"
|
|
>
|
|
<template slot-scope="scope">
|
|
<span v-if="scope.row.interRes == '0'">已走访</span>
|
|
<span v-else-if="scope.row.interRes == '1'">过期未走访</span>
|
|
<span v-else-if="scope.row.interRes == '2'">走访未触达</span>
|
|
<span v-else-if="scope.row.interRes == '3'">待走访</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column
|
|
align="left"
|
|
prop="abnormalVisitTag"
|
|
label="异常走访标签"
|
|
show-overflow-tooltip
|
|
width="150px"
|
|
v-if="columns875[0].visible && is875"
|
|
>
|
|
<template slot-scope="scope">
|
|
<span v-if="scope.row.abnormalVisitTag == '0'">正常</span>
|
|
<span v-if="scope.row.abnormalVisitTag == '1'">走访频率异常</span>
|
|
<span v-if="scope.row.abnormalVisitTag == '2'">走访持续时长异常</span>
|
|
<span v-if="scope.row.abnormalVisitTag == '3'">签退时间异常</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column
|
|
align="left"
|
|
prop="abnormalVisitInfo"
|
|
label="异常走访信息"
|
|
show-overflow-tooltip
|
|
width="150px"
|
|
v-if="columns875[1].visible && is875"
|
|
></el-table-column>
|
|
<el-table-column
|
|
align="left"
|
|
prop="isValidCust"
|
|
label="是否为有效客户"
|
|
show-overflow-tooltip
|
|
width="150px"
|
|
v-if="columns[15].visible"
|
|
>
|
|
<template slot-scope="scope">
|
|
<span v-if="scope.row.isValidCust == '0'">否</span>
|
|
<span v-if="scope.row.isValidCust == '1'">是</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column
|
|
align="left"
|
|
prop="remark"
|
|
label="走访备注"
|
|
show-overflow-tooltip
|
|
width="150px"
|
|
v-if="columns[16].visible"
|
|
></el-table-column>
|
|
<el-table-column align="left" prop="interAddr" label="实地拜访地址" show-overflow-tooltip width="180px" v-if="isPersonalFeedbackTab && columns[17].visible"></el-table-column>
|
|
<el-table-column align="left" prop="colStafName" label="协同走访客户经理" show-overflow-tooltip width="160px" v-if="isPersonalFeedbackTab && columns[18].visible"></el-table-column>
|
|
<el-table-column align="left" prop="laterNote" label="事后备注" show-overflow-tooltip width="180px" v-if="isPersonalFeedbackTab && columns[19].visible"></el-table-column>
|
|
<el-table-column align="left" prop="intentionProductValue" label="走访反馈" show-overflow-tooltip width="160px" v-if="isPersonalFeedbackTab && columns[20].visible"></el-table-column>
|
|
<el-table-column align="left" prop="feedbackStatus" label="反馈状态" show-overflow-tooltip width="120px" v-if="isPersonalFeedbackTab && columns[21].visible"></el-table-column>
|
|
<el-table-column align="left" prop="sourceOfInterview" label="走访来源" show-overflow-tooltip width="140px" v-if="isPersonalFeedbackTab && columns[22].visible"></el-table-column>
|
|
<el-table-column align="left" prop="filename" label="批量导入文件名" show-overflow-tooltip width="180px" v-if="isPersonalFeedbackTab && columns[23].visible"></el-table-column>
|
|
<el-table-column align="left" prop="outCallStatus" label="外呼状态" show-overflow-tooltip width="120px" v-if="isPersonalFeedbackTab && columns[24].visible"></el-table-column>
|
|
<el-table-column align="left" prop="outCallIntention" label="客户意愿" show-overflow-tooltip width="140px" v-if="isPersonalFeedbackTab && columns[25].visible"></el-table-column>
|
|
<el-table-column align="left" prop="source" label="走访渠道" show-overflow-tooltip width="120px" v-if="isPersonalFeedbackTab && columns[26].visible">
|
|
<template slot-scope="scope">
|
|
<span>{{ formatSourceLabel(scope.row.source) }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column align="left" prop="analysisValue" label="nlp模型提取" show-overflow-tooltip width="140px" v-if="isPersonalFeedbackTab && columns[27].visible"></el-table-column>
|
|
<el-table-column align="left" prop="facility" label="预授信额度" show-overflow-tooltip width="140px" v-if="isPersonalFeedbackTab && columns[28].visible"></el-table-column>
|
|
<el-table-column v-if="isPersonalFeedbackTab" align="center" label="操作" fixed="right" width="100">
|
|
<template slot-scope="scope">
|
|
<el-button
|
|
type="text"
|
|
size="mini"
|
|
:disabled="isFeedbackCompleted(scope.row)"
|
|
@click="handleEditFeedback(scope.row)"
|
|
>反馈</el-button>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
<el-pagination
|
|
@size-change="handleSizeChange"
|
|
@current-change="handleCurrentChange"
|
|
:page-sizes="[10, 20, 30, 40]"
|
|
:page-size="pageSize"
|
|
layout="->,total,prev,pager,next,sizes"
|
|
:total="total"
|
|
:current-page="pageNum"
|
|
></el-pagination>
|
|
|
|
<el-dialog
|
|
title="编辑走访反馈"
|
|
:visible.sync="feedbackDialogVisible"
|
|
width="960px"
|
|
custom-class="feedback-dialog"
|
|
append-to-body
|
|
@close="resetFeedbackForm"
|
|
>
|
|
<el-form ref="feedbackFormRef" :model="feedbackForm" label-width="100px" class="feedback-form">
|
|
<el-form-item label="走访渠道" required>
|
|
<el-radio-group v-model="feedbackForm.source">
|
|
<el-radio v-for="item in sourceOptions" :key="item.value" :label="item.value">{{ item.label }}</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
<el-form-item label="走访备注">
|
|
<el-input
|
|
v-model="feedbackForm.remark"
|
|
type="textarea"
|
|
:rows="3"
|
|
maxlength="200"
|
|
show-word-limit
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item label="客户意愿" required>
|
|
<div class="feedback-groups">
|
|
<section v-for="type in feedbackTypeOptions" :key="type" class="feedback-group">
|
|
<div class="feedback-group__title">{{ type }}</div>
|
|
<el-checkbox-group v-model="feedbackForm.feedbackSelections[type]">
|
|
<el-checkbox
|
|
v-for="product in feedbackProductOptions"
|
|
:key="`${type}-${product}`"
|
|
:label="product"
|
|
>
|
|
{{ product }}
|
|
</el-checkbox>
|
|
</el-checkbox-group>
|
|
</section>
|
|
</div>
|
|
</el-form-item>
|
|
<el-form-item label="走访反馈">
|
|
<div class="feedback-preview">{{ feedbackPreview || "-" }}</div>
|
|
</el-form-item>
|
|
</el-form>
|
|
<span slot="footer">
|
|
<el-button @click="feedbackDialogVisible = false">取消</el-button>
|
|
<el-button type="primary" :loading="feedbackSubmitting" @click="handleSubmitFeedback">确定</el-button>
|
|
</span>
|
|
</el-dialog>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import { mapGetters } from "vuex";
|
|
import { getPADVisitRecord, updatePADVisitFeedback } from "@/api/task/PADvisitRecord.js";
|
|
|
|
const SOURCE_OPTIONS = [
|
|
{ label: "PAD", value: "1" },
|
|
{ label: "企业微信", value: "2" },
|
|
{ label: "电话", value: "4" }
|
|
];
|
|
const FEEDBACK_TYPE_OPTIONS = ["拒绝", "考虑", "意愿", "其他", "愿意", "现场办理"];
|
|
const FEEDBACK_PRODUCT_OPTIONS = [
|
|
"丰收互联",
|
|
"贷款",
|
|
"电子社保卡签约",
|
|
"基金",
|
|
"贵金属",
|
|
"信用卡",
|
|
"医保电子凭证",
|
|
"社保卡",
|
|
"理财签约"
|
|
];
|
|
|
|
function createEmptyFeedbackSelections() {
|
|
return FEEDBACK_TYPE_OPTIONS.reduce((result, item) => {
|
|
result[item] = [];
|
|
return result;
|
|
}, {});
|
|
}
|
|
export default {
|
|
data() {
|
|
return {
|
|
selectedTab: "0",
|
|
tableData: [],
|
|
Loading: false,
|
|
feedbackDialogVisible: false,
|
|
feedbackSubmitting: false,
|
|
total: 0,
|
|
pageSize: 10,
|
|
pageNum: 1,
|
|
sourceOptions: SOURCE_OPTIONS,
|
|
feedbackTypeOptions: FEEDBACK_TYPE_OPTIONS,
|
|
feedbackProductOptions: FEEDBACK_PRODUCT_OPTIONS,
|
|
searchForm: {
|
|
visName: "",
|
|
visId: "",
|
|
visTime: "",
|
|
custIdc: "",
|
|
socialCreditCode: '',
|
|
abnormalVisitTag: '',
|
|
marketingWay: '',
|
|
interRes: ''
|
|
},
|
|
campsourceList: [],
|
|
columns: [
|
|
{ key: 0, label: "活动名称", visible: true },
|
|
{ key: 1, label: "柜员名称", visible: true },
|
|
{ key: 2, label: "柜员号", visible: true },
|
|
{ key: 3, label: "柜员部门", visible: true },
|
|
{ key: 4, label: "部门名称", visible: true },
|
|
{ key: 5, label: "走访客户名称", visible: true },
|
|
{ key: 6, label: "客户证件号", visible: true },
|
|
{ key: 7, label: "企业（商户）统信码", visible: true },
|
|
{ key: 8, label: "客户类型", visible: true },
|
|
{ key: 9, label: "签到时间", visible: true },
|
|
{ key: 10, label: "签退时间", visible: true },
|
|
{ key: 11, label: "签到地址", visible: true },
|
|
{ key: 12, label: "签退地址", visible: true },
|
|
{ key: 13, label: "签到坐标", visible: true },
|
|
{ key: 14, label: "签退坐标", visible: true },
|
|
{ key: 15, label: "是否为有效客户", visible: true },
|
|
{ key: 16, label: "走访备注", visible: true },
|
|
{ key: 17, label: "实地拜访地址", visible: true },
|
|
{ key: 18, label: "协同走访客户经理", visible: true },
|
|
{ key: 19, label: "事后备注", visible: true },
|
|
{ key: 20, label: "走访反馈", visible: true },
|
|
{ key: 21, label: "反馈状态", visible: true },
|
|
{ key: 22, label: "走访来源", visible: true },
|
|
{ key: 23, label: "批量导入文件名", visible: true },
|
|
{ key: 24, label: "外呼状态", visible: true },
|
|
{ key: 25, label: "客户意愿", visible: true },
|
|
{ key: 26, label: "走访渠道", visible: true },
|
|
{ key: 27, label: "nlp模型提取", visible: true },
|
|
{ key: 28, label: "预授信额度", visible: true }
|
|
],
|
|
columns875: [
|
|
{ key: 29, label: "异常走访标签", visible: true },
|
|
{ key: 30, label: "异常走访信息", visible: true },
|
|
],
|
|
feedbackForm: {
|
|
id: null,
|
|
source: "",
|
|
remark: "",
|
|
feedbackSelections: createEmptyFeedbackSelections()
|
|
}
|
|
};
|
|
},
|
|
computed: {
|
|
...mapGetters(["roles", "userName"]),
|
|
deptId() {
|
|
return this.$store.state.user.deptId
|
|
},
|
|
//总行
|
|
isHeadAdmin() {
|
|
return this.roles.includes("headAdmin");
|
|
},
|
|
//公司部
|
|
isPublic() {
|
|
return this.roles.includes("headPublic");
|
|
},
|
|
//零售部
|
|
isPrivate() {
|
|
return this.roles.includes("headPrivate");
|
|
},
|
|
//运管部
|
|
isHeadOps() {
|
|
return this.roles.includes("headOps");
|
|
},
|
|
//支行
|
|
isBranchAdmin() {
|
|
return this.roles.includes("branchAdmin");
|
|
},
|
|
// 网点主任
|
|
isOutletAdmin() {
|
|
return this.roles.includes("outletAdmin");
|
|
},
|
|
// 客户经理
|
|
isCommonManager() {
|
|
return this.roles.includes("commonManager");
|
|
},
|
|
// 海宁
|
|
is875() {
|
|
const deptId = this.deptId === null || this.deptId === undefined ? '' : String(this.deptId)
|
|
return deptId.slice(0, 3) === '875'
|
|
},
|
|
isPersonalFeedbackTab() {
|
|
return this.is875 && this.selectedTab === '0'
|
|
},
|
|
feedbackPreview() {
|
|
return this.buildFeedbackValue(this.feedbackForm.feedbackSelections)
|
|
}
|
|
},
|
|
created() {
|
|
const {selectedTab} = this.$route.query;
|
|
if (selectedTab) {
|
|
this.selectedTab = selectedTab;
|
|
} else {
|
|
// 默认选中第一个tab
|
|
const deptId = this.$store.state.user.deptId
|
|
const deptIdStr = deptId ? String(deptId) : ''
|
|
const defaultTab = deptIdStr.startsWith('875') ? '0' : '2'
|
|
|
|
if (this.isPublic) {
|
|
this.selectedTab = '2'
|
|
} else if (this.isPrivate) {
|
|
this.selectedTab = defaultTab
|
|
} else {
|
|
this.selectedTab = defaultTab
|
|
}
|
|
}
|
|
this.initVisitingTaskList();
|
|
},
|
|
methods: {
|
|
resetFeedbackForm() {
|
|
this.feedbackSubmitting = false;
|
|
this.feedbackForm = {
|
|
id: null,
|
|
source: "",
|
|
remark: "",
|
|
feedbackSelections: createEmptyFeedbackSelections()
|
|
};
|
|
},
|
|
parseFeedbackValue(value) {
|
|
const feedbackSelections = createEmptyFeedbackSelections();
|
|
if (!value) {
|
|
return feedbackSelections;
|
|
}
|
|
value.split(";").forEach((segment) => {
|
|
const [type, products] = segment.split(":");
|
|
if (!type || !feedbackSelections[type]) {
|
|
return;
|
|
}
|
|
feedbackSelections[type] = (products || "")
|
|
.split(",")
|
|
.map(item => item && item.trim())
|
|
.filter(Boolean);
|
|
});
|
|
return feedbackSelections;
|
|
},
|
|
buildFeedbackItems(feedbackSelections) {
|
|
return this.feedbackTypeOptions
|
|
.map((type) => ({
|
|
feedbackType: type,
|
|
products: (feedbackSelections[type] || []).filter(Boolean)
|
|
}))
|
|
.filter(item => item.products.length > 0);
|
|
},
|
|
buildFeedbackValue(feedbackSelections) {
|
|
return this.buildFeedbackItems(feedbackSelections)
|
|
.map(item => `${item.feedbackType}:${item.products.join(",")}`)
|
|
.join(";");
|
|
},
|
|
isFeedbackCompleted(row) {
|
|
const interRes = row && row.interRes !== null && row.interRes !== undefined ? String(row.interRes).trim() : "";
|
|
return interRes === "0";
|
|
},
|
|
formatSourceLabel(source) {
|
|
const sourceValue = source === null || source === undefined ? "" : String(source);
|
|
const matched = this.sourceOptions.find(item => item.value === sourceValue);
|
|
return matched ? matched.label : (sourceValue || "-");
|
|
},
|
|
getPersonalViewCustId(row) {
|
|
const custId = row && row.custId ? String(row.custId).trim() : "";
|
|
if (custId) {
|
|
return custId;
|
|
}
|
|
const custIdc = row && row.custIdc ? String(row.custIdc).trim() : "";
|
|
return custIdc ? `101${custIdc}` : "";
|
|
},
|
|
openPersonalView(row) {
|
|
if (!this.isPersonalFeedbackTab) {
|
|
this.$message.warning("当前机构暂无个人客户视图跳转权限");
|
|
return;
|
|
}
|
|
const custId = this.getPersonalViewCustId(row);
|
|
if (!custId) {
|
|
this.$message.warning("未获取到客户标识，暂时无法跳转个人视图");
|
|
return;
|
|
}
|
|
this.$router.push({
|
|
path: "/360charts/indexcharts",
|
|
query: {
|
|
custId,
|
|
selectedTab: this.selectedTab,
|
|
backUrl: this.$route.path
|
|
}
|
|
});
|
|
},
|
|
handleEditFeedback(row) {
|
|
if (this.isFeedbackCompleted(row)) {
|
|
return;
|
|
}
|
|
this.feedbackForm = {
|
|
id: row.id,
|
|
source: row.source === null || row.source === undefined ? "" : String(row.source),
|
|
remark: row.remark || "",
|
|
feedbackSelections: this.parseFeedbackValue(row.intentionProductValue)
|
|
};
|
|
this.feedbackDialogVisible = true;
|
|
},
|
|
handleSubmitFeedback() {
|
|
const feedbackItems = this.buildFeedbackItems(this.feedbackForm.feedbackSelections);
|
|
if (!this.feedbackForm.source) {
|
|
this.$message.warning("请选择走访渠道");
|
|
return;
|
|
}
|
|
if (!feedbackItems.length) {
|
|
this.$message.warning("请至少选择一组客户意愿和营销产品");
|
|
return;
|
|
}
|
|
const payload = {
|
|
id: this.feedbackForm.id,
|
|
source: this.feedbackForm.source || null,
|
|
remark: this.feedbackForm.remark || null,
|
|
feedbackItems
|
|
};
|
|
this.feedbackSubmitting = true;
|
|
updatePADVisitFeedback(payload).then(() => {
|
|
this.$message.success("保存成功");
|
|
this.feedbackDialogVisible = false;
|
|
this.resetFeedbackForm();
|
|
this.initVisitingTaskList();
|
|
}).finally(() => {
|
|
this.feedbackSubmitting = false;
|
|
});
|
|
},
|
|
handleChange(val) {
|
|
this.pageSize = 10;
|
|
this.pageNum = 1;
|
|
this.initVisitingTaskList();
|
|
},
|
|
initVisitingTaskList() {
|
|
const query = {
|
|
custType: this.selectedTab,
|
|
visTime: this.searchForm.visTime,
|
|
visName: this.searchForm.visName,
|
|
visId: this.searchForm.visId,
|
|
custIdc: this.searchForm.custIdc,
|
|
socialCreditCode: this.searchForm.socialCreditCode,
|
|
abnormalVisitTag: this.searchForm.abnormalVisitTag,
|
|
marketingWay: this.searchForm.marketingWay,
|
|
interRes: this.searchForm.interRes,
|
|
pageSize: this.pageSize,
|
|
pageNum: this.pageNum,
|
|
};
|
|
getPADVisitRecord(query).then((res) => {
|
|
if (res.code == 200) {
|
|
this.tableData = res.rows;
|
|
this.total = res.total;
|
|
}
|
|
});
|
|
},
|
|
handleRefersh() {
|
|
this.searchForm = {
|
|
visName: "",
|
|
visId: "",
|
|
visTime: "",
|
|
custIdc: "",
|
|
socialCreditCode: '',
|
|
abnormalVisitTag: '',
|
|
marketingWay: '',
|
|
interRes: ''
|
|
};
|
|
this.initVisitingTaskList();
|
|
},
|
|
handleSizeChange(newSize) {
|
|
this.pageSize = newSize;
|
|
this.initVisitingTaskList();
|
|
},
|
|
handleCurrentChange(newPage) {
|
|
this.pageNum = newPage;
|
|
this.initVisitingTaskList();
|
|
},
|
|
handleSearch() {
|
|
this.initVisitingTaskList();
|
|
},
|
|
resetFilters() {
|
|
this.searchForm = {
|
|
visName: "",
|
|
visId: "",
|
|
visTime: "",
|
|
custIdc: "",
|
|
socialCreditCode: '',
|
|
abnormalVisitTag: '',
|
|
marketingWay: '',
|
|
interRes: ''
|
|
};
|
|
this.initVisitingTaskList();
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
.main {
|
|
background-color: #ffffff;
|
|
box-shadow: 0 3px 8px 0 #00000017;
|
|
border-radius: 16px 16px 0 0;
|
|
overflow-y: auto;
|
|
padding: 0 30px 30px 30px;
|
|
}
|
|
|
|
.box-card {
|
|
height: 181px;
|
|
background: #eaf5ff;
|
|
border-radius: 8px;
|
|
margin-top: 25px;
|
|
}
|
|
|
|
.box-card1 {
|
|
height: 181px;
|
|
background: #eaf5ff;
|
|
border-radius: 8px;
|
|
margin-top: 25px;
|
|
}
|
|
|
|
.my-span-checklist-title {
|
|
height: 25px;
|
|
font-weight: 600;
|
|
font-size: 18px;
|
|
color: #222222;
|
|
letter-spacing: 0.5px;
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
.my-span-checklist-main {
|
|
line-height: 30px;
|
|
}
|
|
|
|
.btn-disabled {
|
|
::v-deep .el-radio-button__inner {
|
|
background-color: #e7e7e7;
|
|
}
|
|
}
|
|
|
|
.header-radio {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
border-bottom: 1px solid #ebebeb;
|
|
margin-top: 25px;
|
|
|
|
.btn-disabled {
|
|
::v-deep .el-radio-button__inner {
|
|
background-color: #e7e7e7;
|
|
}
|
|
}
|
|
|
|
.el-radio-button {
|
|
flex: 1;
|
|
|
|
::v-deep .el-radio-button__inner {
|
|
width: 100%;
|
|
border: none;
|
|
font-weight: 400;
|
|
letter-spacing: 0.44px;
|
|
line-height: 25px;
|
|
font-size: 16px;
|
|
color: #666666;
|
|
padding: 11px 0 12px 0;
|
|
}
|
|
|
|
::v-deep .el-radio-button__orig-radio:checked + .el-radio-button__inner {
|
|
background-color: #4886f8;
|
|
font-weight: 400;
|
|
color: #ffffff;
|
|
border-bottom-left-radius: 0;
|
|
border-bottom-right-radius: 0;
|
|
}
|
|
|
|
&:nth-child(2) {
|
|
&::before,
|
|
&::after {
|
|
content: "";
|
|
position: absolute;
|
|
top: 50%;
|
|
transform: translateY(-50%);
|
|
height: 21px;
|
|
width: 1px;
|
|
background: #ebebeb;
|
|
z-index: 1;
|
|
}
|
|
|
|
&::after {
|
|
right: 1px;
|
|
}
|
|
}
|
|
|
|
&.is-active {
|
|
&::before,
|
|
&::after {
|
|
content: none;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.tableData {
|
|
margin-top: 20px;
|
|
}
|
|
|
|
.taskTop {
|
|
margin-top: 20px;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.taskTop_left {
|
|
display: flex;
|
|
}
|
|
|
|
.taskTop_left_item {
|
|
width: 150px;
|
|
text-align: center;
|
|
height: 40px;
|
|
line-height: 40px;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.el-icon-arrow-down {
|
|
margin-left: 15px;
|
|
font-size: 16px;
|
|
color: rgb(64, 149, 229);
|
|
}
|
|
|
|
.searchForm {
|
|
margin-top: 20px;
|
|
|
|
.staff-id-filter {
|
|
clear: left;
|
|
margin-left: 0 !important;
|
|
}
|
|
}
|
|
|
|
.operate-cnt {
|
|
margin: 0 0 10px 0;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: flex-end;
|
|
|
|
.top-right-btn {
|
|
margin-right: 24px;
|
|
padding-bottom: 6px;
|
|
}
|
|
|
|
.plain-raido-btn {
|
|
::v-deep .el-radio-button__inner {
|
|
color: #666666;
|
|
font-size: 14px;
|
|
font-weight: 400;
|
|
border: 1px solid #ebebeb;
|
|
border-radius: 0;
|
|
}
|
|
|
|
::v-deep .el-radio-button__orig-radio:checked + .el-radio-button__inner {
|
|
border: 1px solid #4886f8;
|
|
color: #4886f8;
|
|
background-color: #ffffff;
|
|
box-shadow: none;
|
|
}
|
|
}
|
|
}
|
|
|
|
.feedback-form {
|
|
::v-deep .el-form-item.is-required:not(.is-no-asterisk) > .el-form-item__label::before {
|
|
color: #f56c6c;
|
|
margin-right: 4px;
|
|
}
|
|
|
|
.feedback-groups {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 12px;
|
|
}
|
|
|
|
.feedback-group {
|
|
padding: 10px 12px;
|
|
border: 1px solid #ebeef5;
|
|
border-radius: 8px;
|
|
background: #fafbfc;
|
|
}
|
|
|
|
.feedback-group__title {
|
|
margin-bottom: 10px;
|
|
color: #303133;
|
|
font-weight: 600;
|
|
}
|
|
|
|
::v-deep .el-checkbox-group {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: 6px 8px;
|
|
}
|
|
|
|
::v-deep .el-checkbox {
|
|
margin-right: 0;
|
|
min-width: auto;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.feedback-preview {
|
|
min-height: 20px;
|
|
color: #606266;
|
|
word-break: break-all;
|
|
}
|
|
}
|
|
|
|
::v-deep .feedback-dialog {
|
|
border-radius: 18px;
|
|
overflow: hidden;
|
|
|
|
.el-dialog__header {
|
|
padding: 20px 24px 16px;
|
|
}
|
|
|
|
.el-dialog__body {
|
|
padding: 12px 24px 20px;
|
|
}
|
|
|
|
.el-dialog__footer {
|
|
padding: 10px 24px 20px;
|
|
}
|
|
}
|
|
|
|
.quesiton {
|
|
color: #b9b9b9;
|
|
}
|
|
</style>
|