- 在Onboard控制器中添加searchUser方法,支持按昵称、手机号、ID搜索用户 - 修改noNeedRight权限配置,添加searchUser访问权限 - 重构用户选择逻辑,使用新的fetchUserPublic和formatUserOption方法 - 实现用户搜索功能,支持关键词模糊匹配并返回格式化的用户选项 - 优化前端页面样式,采用卡片式布局提升用户体验 - 添加用户头像显示和个人信息展示功能 - 调整页面结构,增加标题栏、底部操作栏等组件 ```
487 行
21 KiB
JavaScript
487 行
21 KiB
JavaScript
define(['jquery', 'bootstrap', 'backend'], function ($, undefined, Backend) {
|
|
|
|
var areaCache = null;
|
|
var branchTimer = null;
|
|
|
|
function withVue(callback) {
|
|
if (typeof Vue !== 'undefined') {
|
|
callback(Vue);
|
|
return;
|
|
}
|
|
require.config({
|
|
paths: {
|
|
'vue': '../addons/shopro/libs/vue',
|
|
'ELEMENT': '../addons/shopro/libs/element/element'
|
|
},
|
|
shim: {
|
|
'ELEMENT': {
|
|
deps: ['css!../addons/shopro/libs/element/element.css', 'vue']
|
|
}
|
|
}
|
|
});
|
|
require(['vue', 'ELEMENT'], function (Vue, ELEMENT) {
|
|
Vue.use(ELEMENT);
|
|
callback(Vue);
|
|
});
|
|
}
|
|
|
|
function defaultForm() {
|
|
return {
|
|
account_type: 'indv',
|
|
bank_account_type: '0',
|
|
name: '',
|
|
cert_no: '',
|
|
cert_validity_type: '1',
|
|
cert_begin_date: '',
|
|
cert_end_date: '',
|
|
mobile_no: '',
|
|
reg_detail: '',
|
|
shopro_province_id: '',
|
|
shopro_city_id: '',
|
|
shopro_district_id: '',
|
|
prov_id: '',
|
|
area_id: '',
|
|
district_id: '',
|
|
card_no: '',
|
|
card_name: '',
|
|
branch_code: '',
|
|
branch_name: '',
|
|
mp: '',
|
|
id_card_front_url: '',
|
|
id_card_back_url: '',
|
|
bank_card_url: '',
|
|
reg_name: '',
|
|
license_code: '',
|
|
license_validity_type: '1',
|
|
license_begin_date: '',
|
|
license_end_date: '',
|
|
legal_name: '',
|
|
legal_mobile: '',
|
|
legal_cert_no: '',
|
|
legal_cert_validity_type: '1',
|
|
legal_cert_begin_date: '',
|
|
legal_cert_end_date: '',
|
|
license_url: '',
|
|
legal_id_front_url: '',
|
|
legal_id_back_url: '',
|
|
account_permit_url: ''
|
|
};
|
|
}
|
|
|
|
function createFormMixin() {
|
|
return {
|
|
data: function () {
|
|
return {
|
|
isEdit: false,
|
|
editId: 0,
|
|
userId: '',
|
|
userLabel: '',
|
|
roleKey: '',
|
|
roleType: '',
|
|
roleRefId: 0,
|
|
roleLabel: '',
|
|
userOptions: [],
|
|
userLoading: false,
|
|
selectedUser: null,
|
|
roleOptions: [],
|
|
form: defaultForm(),
|
|
regionPath: [],
|
|
areaOptions: [],
|
|
areaProps: { value: 'id', label: 'name', children: 'children' },
|
|
branchKeyword: '',
|
|
branchResults: [],
|
|
uploadUrl: Fast.api.fixurl('ajax/upload'),
|
|
saving: false
|
|
};
|
|
},
|
|
computed: {
|
|
bankMobile: {
|
|
get: function () {
|
|
return this.form.account_type === 'ent' ? this.form.legal_mobile : this.form.mobile_no;
|
|
},
|
|
set: function (val) {
|
|
if (this.form.account_type === 'ent') {
|
|
this.form.legal_mobile = val;
|
|
} else {
|
|
this.form.mobile_no = val;
|
|
}
|
|
this.form.mp = val;
|
|
}
|
|
}
|
|
},
|
|
mounted: function () {
|
|
this.loadAreaTree();
|
|
this.initFromConfig();
|
|
},
|
|
methods: {
|
|
initFromConfig: function () {
|
|
var init = (typeof Config !== 'undefined' && Config.onboardForm) ? Config.onboardForm : null;
|
|
if (!init) return;
|
|
this.isEdit = true;
|
|
this.editId = init.onboard_id || 0;
|
|
this.userId = init.user_id;
|
|
this.userLabel = init.user_label || '';
|
|
this.roleType = init.role_type;
|
|
this.roleRefId = init.role_ref_id;
|
|
this.roleKey = init.role_type + ':' + init.role_ref_id;
|
|
this.roleLabel = init.role_label || '';
|
|
this.form = Object.assign(defaultForm(), init.form || {});
|
|
this.branchKeyword = this.form.branch_name || '';
|
|
this.restoreRegionPath();
|
|
},
|
|
loadAreaTree: function () {
|
|
var vm = this;
|
|
var done = function (data) {
|
|
areaCache = data || [];
|
|
vm.areaOptions = areaCache;
|
|
vm.restoreRegionPath();
|
|
};
|
|
if (areaCache) {
|
|
done(areaCache);
|
|
return;
|
|
}
|
|
Fast.api.ajax({ url: 'shopro/area/getCascader', type: 'GET' }, function (ret, res) {
|
|
done(res.data || []);
|
|
return false;
|
|
});
|
|
},
|
|
restoreRegionPath: function () {
|
|
var ids = [];
|
|
if (this.form.shopro_province_id) ids.push(parseInt(this.form.shopro_province_id, 10));
|
|
if (this.form.shopro_city_id) ids.push(parseInt(this.form.shopro_city_id, 10));
|
|
if (this.form.shopro_district_id) ids.push(parseInt(this.form.shopro_district_id, 10));
|
|
this.regionPath = ids.filter(function (n) { return !!n; });
|
|
},
|
|
onRegionChange: function (val) {
|
|
val = val || [];
|
|
this.form.shopro_province_id = val[0] ? String(val[0]) : '';
|
|
this.form.shopro_city_id = val[1] ? String(val[1]) : '';
|
|
this.form.shopro_district_id = val[2] ? String(val[2]) : '';
|
|
this.form.prov_id = this.form.shopro_province_id;
|
|
this.form.area_id = this.form.shopro_city_id;
|
|
this.form.district_id = this.form.shopro_district_id;
|
|
},
|
|
userAvatarText: function (item) {
|
|
if (!item) return '?';
|
|
var name = item.display_name || item.nickname || '';
|
|
return name ? name.slice(0, 1) : '?';
|
|
},
|
|
applySelectedUser: function (user) {
|
|
if (!user || !user.id) {
|
|
this.selectedUser = null;
|
|
this.userLabel = '';
|
|
return;
|
|
}
|
|
this.selectedUser = user;
|
|
this.userLabel = user.option_label || (user.display_name + ' (' + (user.mobile || user.id) + ')');
|
|
},
|
|
searchUser: function (keyword) {
|
|
keyword = (keyword || '').trim();
|
|
if (!keyword) {
|
|
this.userOptions = [];
|
|
return;
|
|
}
|
|
var vm = this;
|
|
vm.userLoading = true;
|
|
Fast.api.ajax({
|
|
url: 'shopro_huifu/onboard/searchUser',
|
|
type: 'GET',
|
|
data: { keyword: keyword, limit: 20 }
|
|
}, function (ret, res) {
|
|
vm.userOptions = res.data || [];
|
|
vm.userLoading = false;
|
|
return false;
|
|
}, function () {
|
|
vm.userLoading = false;
|
|
});
|
|
},
|
|
onUserChange: function () {
|
|
var vm = this;
|
|
vm.roleKey = '';
|
|
vm.roleType = '';
|
|
vm.roleRefId = 0;
|
|
vm.roleOptions = [];
|
|
if (!vm.userId) {
|
|
vm.applySelectedUser(null);
|
|
return;
|
|
}
|
|
var cached = vm.userOptions.find(function (item) { return item.id === vm.userId; });
|
|
if (cached) {
|
|
vm.applySelectedUser(cached);
|
|
}
|
|
Fast.api.ajax({
|
|
url: 'shopro_huifu/onboard/userRoles',
|
|
type: 'GET',
|
|
data: { user_id: vm.userId }
|
|
}, function (ret, res) {
|
|
var data = res.data || {};
|
|
vm.roleOptions = data.roles || [];
|
|
if (data.user) {
|
|
vm.applySelectedUser(data.user);
|
|
}
|
|
return false;
|
|
});
|
|
},
|
|
onRoleChange: function () {
|
|
var parts = String(this.roleKey || '').split(':');
|
|
this.roleType = parts[0] || '';
|
|
this.roleRefId = parseInt(parts[1] || '0', 10);
|
|
var role = this.roleOptions.find(function (item) {
|
|
return item.role_type === this.roleType && item.role_ref_id === this.roleRefId;
|
|
}.bind(this));
|
|
this.roleLabel = role ? role.role_label : '';
|
|
},
|
|
onBranchInput: function () {
|
|
var vm = this;
|
|
clearTimeout(branchTimer);
|
|
branchTimer = setTimeout(function () {
|
|
if (!vm.branchKeyword) {
|
|
vm.branchResults = [];
|
|
return;
|
|
}
|
|
Fast.api.ajax({
|
|
url: 'shopro_huifu/onboard/searchBranch',
|
|
type: 'GET',
|
|
data: {
|
|
keyword: vm.branchKeyword,
|
|
area_id: vm.form.area_id || vm.form.shopro_city_id
|
|
}
|
|
}, function (ret, res) {
|
|
vm.branchResults = res.data || [];
|
|
return false;
|
|
});
|
|
}, 300);
|
|
},
|
|
selectBranch: function (item) {
|
|
this.form.branch_code = item.branch_code;
|
|
this.form.branch_name = item.branch_name;
|
|
this.branchKeyword = item.branch_name;
|
|
this.branchResults = [];
|
|
if (item.prov_id) this.form.prov_id = item.prov_id;
|
|
if (item.area_id) this.form.area_id = item.area_id;
|
|
},
|
|
onUploadSuccess: function (field, res) {
|
|
if (res && res.code === 1 && res.data && res.data.url) {
|
|
this.form[field] = res.data.fullurl || res.data.url;
|
|
return;
|
|
}
|
|
this.$message.error((res && res.msg) || '上传失败');
|
|
},
|
|
closeForm: function () {
|
|
Fast.api.close();
|
|
},
|
|
submitForm: function () {
|
|
var vm = this;
|
|
if (!vm.isEdit) {
|
|
if (!vm.userId) {
|
|
Toastr.error('请选择用户');
|
|
return;
|
|
}
|
|
if (!vm.roleType || !vm.roleRefId) {
|
|
Toastr.error('请选择进件角色');
|
|
return;
|
|
}
|
|
}
|
|
vm.saving = true;
|
|
var url = vm.isEdit
|
|
? ('shopro_huifu/onboard/edit/ids/' + vm.editId)
|
|
: 'shopro_huifu/onboard/add';
|
|
Fast.api.ajax({
|
|
url: url,
|
|
type: 'POST',
|
|
data: {
|
|
user_id: vm.userId,
|
|
role_type: vm.roleType,
|
|
role_ref_id: vm.roleRefId,
|
|
form: vm.form
|
|
}
|
|
}, function () {
|
|
vm.saving = false;
|
|
Fast.api.close();
|
|
return false;
|
|
}, function () {
|
|
vm.saving = false;
|
|
});
|
|
}
|
|
}
|
|
};
|
|
}
|
|
|
|
var Controller = {
|
|
index: function () {
|
|
withVue(function (Vue) {
|
|
new Vue({
|
|
el: '#huifuOnboardIndex',
|
|
data: {
|
|
listData: [],
|
|
loading: false,
|
|
filterStatus: '',
|
|
detailVisible: false,
|
|
detailLoading: false,
|
|
detailData: null,
|
|
detailId: 0
|
|
},
|
|
computed: {
|
|
previewList: function () {
|
|
if (!this.detailData || !this.detailData.form) {
|
|
return [];
|
|
}
|
|
var f = this.detailData.form;
|
|
return [f.id_card_front_url, f.id_card_back_url, f.bank_card_url].filter(function (u) { return !!u; });
|
|
}
|
|
},
|
|
mounted: function () {
|
|
this.getList();
|
|
},
|
|
methods: {
|
|
openCreate: function () {
|
|
var vm = this;
|
|
Backend.api.open('shopro_huifu/onboard/add', '新建汇付进件', {
|
|
area: ['960px', '92%'],
|
|
callback: function () {
|
|
vm.getList();
|
|
}
|
|
});
|
|
},
|
|
openEdit: function (id) {
|
|
var vm = this;
|
|
Backend.api.open('shopro_huifu/onboard/edit/ids/' + id, '编辑汇付进件', {
|
|
area: ['960px', '92%'],
|
|
callback: function () {
|
|
vm.getList();
|
|
if (vm.detailVisible && vm.detailId === id) {
|
|
vm.openDetail(id);
|
|
}
|
|
}
|
|
});
|
|
},
|
|
canEditRow: function (row) {
|
|
return ['draft', 'failed', 'rejected'].indexOf(row.onboard_status) >= 0;
|
|
},
|
|
getList: function () {
|
|
var vm = this;
|
|
vm.loading = true;
|
|
Fast.api.ajax({
|
|
url: 'shopro_huifu/onboard/index',
|
|
type: 'GET',
|
|
data: { limit: 200, status: vm.filterStatus }
|
|
}, function (ret, res) {
|
|
vm.listData = (res.data && res.data.rows) || [];
|
|
vm.loading = false;
|
|
return false;
|
|
}, function () {
|
|
vm.loading = false;
|
|
});
|
|
},
|
|
openDetail: function (id) {
|
|
var vm = this;
|
|
vm.detailId = id;
|
|
vm.detailVisible = true;
|
|
vm.detailLoading = true;
|
|
vm.detailData = null;
|
|
Fast.api.ajax({
|
|
url: 'shopro_huifu/onboard/index',
|
|
type: 'GET',
|
|
data: { detail_id: id }
|
|
}, function (ret, res) {
|
|
vm.detailData = res.data || null;
|
|
vm.detailLoading = false;
|
|
return false;
|
|
}, function () {
|
|
vm.detailLoading = false;
|
|
});
|
|
},
|
|
goAudit: function (url) {
|
|
if (!url) return;
|
|
Backend.api.addtabs(url, '业务审核');
|
|
},
|
|
submitRow: function (id) {
|
|
var vm = this;
|
|
Layer.confirm('确认资料无误并提交汇付进件?', function (index) {
|
|
Layer.close(index);
|
|
Fast.api.ajax({ url: 'shopro_huifu/onboard/submit/ids/' + id, type: 'POST' }, function () {
|
|
vm.getList();
|
|
if (vm.detailVisible && vm.detailId === id) {
|
|
vm.openDetail(id);
|
|
}
|
|
});
|
|
});
|
|
},
|
|
pollRow: function (id) {
|
|
var vm = this;
|
|
Fast.api.ajax({ url: 'shopro_huifu/onboard/poll/ids/' + id, type: 'POST' }, function () {
|
|
vm.getList();
|
|
if (vm.detailVisible && vm.detailId === id) {
|
|
vm.openDetail(id);
|
|
}
|
|
});
|
|
},
|
|
retryRow: function (id) {
|
|
var vm = this;
|
|
Fast.api.ajax({ url: 'shopro_huifu/onboard/retry/ids/' + id, type: 'POST' }, function () {
|
|
vm.getList();
|
|
if (vm.detailVisible && vm.detailId === id) {
|
|
vm.openDetail(id);
|
|
}
|
|
});
|
|
},
|
|
submitFromDetail: function () {
|
|
if (this.detailId) {
|
|
this.submitRow(this.detailId);
|
|
}
|
|
},
|
|
pollFromDetail: function () {
|
|
if (this.detailId) {
|
|
this.pollRow(this.detailId);
|
|
}
|
|
},
|
|
retryFromDetail: function () {
|
|
if (this.detailId) {
|
|
this.retryRow(this.detailId);
|
|
}
|
|
},
|
|
editFromDetail: function () {
|
|
if (this.detailId) {
|
|
this.openEdit(this.detailId);
|
|
}
|
|
},
|
|
statusText: function (status) {
|
|
var map = {
|
|
draft: '待后台审核',
|
|
submitting: '提交中',
|
|
basic_ok: '开户成功',
|
|
busi_pending: '汇付审核中',
|
|
approved: '已通过',
|
|
rejected: '已驳回',
|
|
failed: '失败'
|
|
};
|
|
return map[status] || status || '-';
|
|
},
|
|
roleText: function (role) {
|
|
return role === 'regional_agent' ? '区域公司' : (role === 'promoter' ? '推广员' : role);
|
|
},
|
|
formatTime: function (ts) {
|
|
if (!ts) return '-';
|
|
var d = new Date(ts * 1000);
|
|
var p = function (n) { return n < 10 ? '0' + n : n; };
|
|
return d.getFullYear() + '-' + p(d.getMonth() + 1) + '-' + p(d.getDate()) + ' ' + p(d.getHours()) + ':' + p(d.getMinutes());
|
|
}
|
|
}
|
|
});
|
|
});
|
|
},
|
|
add: function () {
|
|
withVue(function (Vue) {
|
|
new Vue({
|
|
el: '#huifuOnboardAdd',
|
|
mixins: [createFormMixin()]
|
|
});
|
|
});
|
|
},
|
|
edit: function () {
|
|
Controller.add();
|
|
}
|
|
};
|
|
return Controller;
|
|
});
|