提交 27a30be6 authored 作者: huaxinzhu's avatar huaxinzhu

云仓四期

上级 00e20ed7
...@@ -2,9 +2,9 @@ ...@@ -2,9 +2,9 @@
ENV = 'development' ENV = 'development'
# 正式环境 # 正式环境
VUE_APP_BASE_API = 'http://sjapi.jxhh.com' #VUE_APP_BASE_API = 'http://sjapi.jxhh.com'
# 达叔 开发环境 # 开发环境
#VUE_APP_BASE_API = 'http://192.168.111.32:8200' VUE_APP_BASE_API = 'http://192.168.111.34:8200'
# 路由懒加载 # 路由懒加载
VUE_CLI_BABEL_TRANSPILE_MODULES = true VUE_CLI_BABEL_TRANSPILE_MODULES = true
...@@ -27,6 +27,14 @@ export function retreatSubmit(data) { ...@@ -27,6 +27,14 @@ export function retreatSubmit(data) {
}) })
} }
// 获取售后类型,等
export function getSearchParams(query) {
return request({
url: '/system/retreat/getSearchParams',
method: 'get',
params: query
})
}
// // 修改retreat // // 修改retreat
// export function updateRetreat(data) { // export function updateRetreat(data) {
// return request({ // return request({
......
import request from '@/utils/request';
// 修改手机号
export function changeTelphone(data) {
return request({
url: '/local/seller/editMobile',
method: 'post',
data: data
})
}
// 获取手机验证码
export function getTelphoneCode(query) {
return request({
url: '/local/seller/sendCodeMobile',
method: 'get',
params: query
})
}
...@@ -210,9 +210,16 @@ ...@@ -210,9 +210,16 @@
this.multiple = !selection.length this.multiple = !selection.length
}, },
/** 上架操作 */ /** 上架操作 */
handleOnsale() { handleOnsale(row) {
Onsale({"ids": this.ids, "status": 1}).then(response => { const rowIds = row.goodsId || this.ids;
this.msgSuccess("成功申请" + response.data.length + "个商品"); let params = {"ids": rowIds, "status": 1};
if(!rowIds || rowIds.length === 0) {
this.$message({message: '请先选择要上架的商品数据', type: 'warning'});
return;
}
Onsale(params).then(res => {
this.msgSuccess("成功申请" + res.length + "个商品");
}); });
}, },
/** 新增按钮操作 */ /** 新增按钮操作 */
...@@ -261,8 +268,9 @@ ...@@ -261,8 +268,9 @@
}, },
/** 删除按钮操作 */ /** 删除按钮操作 */
handleDelete(row) { handleDelete(row) {
const goods_ids = row.goodsId;
this.$confirm('是否确认删除goods编号为"' + goods_ids + '"的数据项?', "警告", { const goods_ids = row.goodsId || this.ids;
this.$confirm('是否确认删除商品ID为"' + goods_ids + '"的数据项?', "警告", {
confirmButtonText: "确定", confirmButtonText: "确定",
cancelButtonText: "取消", cancelButtonText: "取消",
type: "warning" type: "warning"
......
<template>
<div class="app-container">
<el-card class="box-card">
<div slot="header" class="clearfix">
<p>帮助文档</p>
</div>
<el-row class="content-menu">
<el-col :span="4" class="menu">
<el-menu
default-active="1"
class="el-menu-vertical-demo"
:default-openeds="openMenuList"
>
<el-submenu v-for="item in menuList" :index="(item.id).toString()" v-if="item.children && item.children.length > 0">
<template slot="title">
<span>{{ item.title }}</span>
</template>
<el-menu-item-group v-if="item.children && item.children.length > 0">
<el-menu-item
v-for="childItem in item.children"
:index="(childItem.id).toString()"
@click="showText(childItem)"
>
{{ childItem.title }}
</el-menu-item>
</el-menu-item-group>
</el-submenu>
</el-menu>
</el-col>
<transition name="fade">
<el-col :span="20" class="content-text">
<el-row :span="24" type="flex" align="middle" justify="space-bewteen" class="pre-title">
<el-col :span="12">
<h3>保证金</h3>
</el-col>
<el-col :span="12">
<p style="float:right;">
<span>2021-05-05</span>
<el-divider direction="vertical"></el-divider>
<span>运营团队</span>
</p>
</el-col>
</el-row>
<div class="ql-container ql-show">
<div class="ql-editor">
<div v-html="content"></div>
</div>
</div>
</el-col>
</transition>
</el-row>
</el-card>
</div>
</template>
<script>
export default {
name: "Document",
data() {
return {
show: true,
menuList: [
{
id: 1,
title: '商品规格',
children: [
{id: 11, title: '商品规格-1', content: '"<p>商品规格1111111111</p>"', children: null},
]
},
{id: 2, title: '订单问题', children: [
{id: 21, title: '订单问题-1', content: '"<p>订单问题1111111111</p>"', children: null},
]},
{id: 3, title: '店铺相关', children: [
{id: 31, title: '店铺相关-1', content: '"<p>店铺相关1111111111</p>"', children: null},
]},
{id: 4, title: '售后问题', children: [
{id: 41, title: '售后问题-1', content: '<p>售后问题1111111111</p>', children: null},{id: 42, title: '商品规格-1', content: '"<p>商品规格1111111111</p>"', children: null},
]},
{id: 5, title: '设置相关', children: [
{id: 51, title: '设置相关-1', content: '<p>设置相关1111111111</p>', children: null},{id: 52, title: '商品规格-1', content: '"<p>商品规格1111111111</p>"', children: null},
]},
],
editorOption: {},
queryParams: {
pageNum: 10,
pageSize: 1
},
content: '<div class="main-text">\n' +
' <h2>胜天半子供应链商家入驻协议书</h2>\n' +
' <p>\n' +
' 甲方:北京胜天半子科技有限公司(以下简称“甲方或者平台”)<br/>\n' +
' </p>\n' +
' <p>乙方:(以下简称“乙方”)</p>\n' +
' <p>\n' +
' 甲乙双方本着互惠互利的双赢策略,根据甲方商城入驻条件,乙方申请入驻甲方商城,并完全接受甲方的规范,本着自愿、平等、公正原则,甲乙双方在协商一致的基础上达成如下协议:\n' +
' </p>\n' +
' <p>\n' +
' 乙方可在平台上进行商铺发布及管理、推广商品、达成交易意向。\n' +
' </p>\n' +
' <h4>一、入驻商家基本条件</h4>\n' +
' <p>\n' +
' 1、有良好的合作意愿,能提供优质的商品,保证合作的顺利进行,并保证提供良好的售后服务;\n' +
' </p>\n' +
' <p>\n' +
' 2、 乙方申请成为平台入驻商家,应该满足以下条件:\n' +
' (1) 乙方已依照中华人民共和国法律注册并领取合法有效的营业执照及其他经营许可;\n' +
' (2) 乙方申请经营的商品或服务合法,资质齐全;\n' +
' (3)乙方同意本协议及平台相关规则并同意缴纳平台履约保证金1万-5万具体见附件\n' +
' <a target="_blank" class="download-Template-btn" :href="downTemplatehttp">《平台类目费率收取标准》</a>\n' +
' 。 (4) 乙方须保证所提交予乙方的所有材料真实、准确、合法、有效。如相关材料有变更或更新时应及时通知甲方,若导致乙方不符合本协议所规定入驻条件的,甲方有权单方全部或部分限制乙方经营,直至终止本协议。\n' +
' </div>',
openMenuList: [],
}
},
created() {
//menuList
if(this.menuList.length > 0) {
this.menuList.forEach((item,index) => {
let indexStr = (index + 1).toString();
this.openMenuList.push(indexStr);
});
console.log(121,this.openMenuList);
}
},
methods: {
onEditorChange(a,b,c) {
console.log(25,b);
console.log(25,b);
console.log(25,b);
},
handleOpen(key, keyPath) {
console.log(key, keyPath);
},
handleClose(key, keyPath) {
console.log(key, keyPath);
},
showText(val) {
//this.show = false;
if(val['content']) {
this.content = val['content'];
//this.show = true;
}
console.log(142,val);
}
}
}
</script>
<style lang="scss" type="text/stylus" scoped>
/deep/.el-card__header p {
font-size: 18px;
}
/deep/.el-card__body {
padding: 10px 0 10px 0;
height: calc(100% - 45px);
overflow :hidden;
}
.content-menu {
height: 100%;
overflow: hidden;
}
.menu {
height :100%;
border-right: 1px solid #DCDFE6;
.el-menu {
border: none;
}
}
.pre-title {
padding-right:50px;
border-bottom: 1px solid #DCDFE6;
}
.content-text {
height: 100%;
padding: 0 20px;
}
.ql-container {
height : calc(100% - 59px);
overflow: hidden;
.ql-editor {
height :100%;
padding: 0 20px;
}
.ql-editor > div:nth-child(0){
height :100%;
.main-text {
height: 100%;
overflow-x: hidden;
overflow-y: scroll;
}
}
}
/*样式重置*/
/deep/.el-submenu__title {
//padding: 0 30px!important;
}
/deep/.el-submenu__title > span {
font-size: 16px;
}
.fade-enter-active, .fade-leave-active {
transition: opacity .5s;
}
.fade-enter, .fade-leave-to /* .fade-leave-active below version 2.1.8 */ {
opacity: 0;
}
</style>
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
<div class="app-container"> <div class="app-container">
<el-card class="box-card"> <el-card class="box-card">
<div slot="header" class="clearfix"> <div slot="header" class="clearfix">
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px" class="queryFormInline"> <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="82px" class="queryFormInline">
<el-form-item label="申请时间" prop="applyTime"> <el-form-item label="申请时间" prop="applyTime">
<el-date-picker <el-date-picker
size="small" size="small"
...@@ -34,6 +34,28 @@ ...@@ -34,6 +34,28 @@
@keyup.enter.native="handleQuery" @keyup.enter.native="handleQuery"
/> />
</el-form-item> </el-form-item>
<el-form-item label="退换货类型" prop="userNeed">
<el-select v-model="queryParams.userNeed" placeholder="全部原因" size="small" clearable @change="userNeedChange">
<el-option v-for="item in userNeedOptions" :key="item.value" :label="item.label"
:value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item label="退换货原因" prop="needMsg">
<el-select v-model="queryParams.needMsg" placeholder="全部类型" size="small" clearable @change="needMsgChange">
<el-option v-for="item in needMsgOptions" :key="item.value" :label="item.label"
:value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item label="处理状态" prop="processDes">
<el-select v-model="queryParams.processDes" placeholder="全部状态" size="small" clearable @change="processDesChange">
<el-option v-for="item in processDesOptions" :key="item.value" :label="item.label"
:value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button> <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
...@@ -280,9 +302,9 @@ ...@@ -280,9 +302,9 @@
<div class="el-table el-table--enable-row-hover el-table--medium"> <div class="el-table el-table--enable-row-hover el-table--medium">
<el-form :model="submitParam" ref="queryForm" label-width="68px"> <el-form :model="submitParam" ref="queryForm" label-width="68px">
<el-form-item label="退货地址"> <el-form-item label="退货地址">
<el-select v-model="submitParam.address" placeholder="退货地址"> <el-select v-model="submitParam.address" placeholder="退货地址" style="width:500px;">
<el-option v-for="(item,index) in form.address" :key="item.value" :label="item" v-if="item != '' " <el-option v-for="(item,index) in form.address" :key="item.value" :label="item.label" v-if="item != '' "
:value="getIndex(index)"></el-option> :value="item.value"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-form-item> </el-form-item>
...@@ -311,7 +333,7 @@ ...@@ -311,7 +333,7 @@
</div> </div>
</template> </template>
<script> <script>
import {listRetreat, getRetreat, retreatSubmit} from '@/api/module/retreat' import {listRetreat, getRetreat, retreatSubmit,getSearchParams} from '@/api/module/retreat'
export default { export default {
name: "retreat", name: "retreat",
...@@ -348,6 +370,33 @@ ...@@ -348,6 +370,33 @@
{label: "买家退回的商品不全", value: 13}, {label: "买家退回的商品不全", value: 13},
{label: "其他", value: 14}, {label: "其他", value: 14},
], ],
// 售后类型/退换货类型
userNeedOptions: [
{value: -1,label:'全部类型'},
{value: 1,label: '仅退款'},
{value: 2,label: '退货退款'},
{value: 3,label: '客服仲裁'}
],
// 退换货原因
needMsgOptions: [
{value: -1,label: '全部原因'},
{value: 1,label: '协商一致退款'},
{value: 2,label: '质量问题'},
{value: 3,label: '物流问题'},
{value: 4,label: '假冒品牌'},
{value: 5,label: '少件/漏发/破损/污渍'},
{value: 6,label: '7天无理由'},
{value: 7,label: '拍错/多拍/不想要'},
{value: 8,label: '其他'},
],
// 处理状态
processDesOptions: [
{value: -1,label: '全部状态'},
{value: 1,label: '未处理'},
{value: 2,label: '处理中'},
{value: 3,label: '已处理'},
{value: 4,label: '客服介入'},
],
//状态 //状态
orderInfo: true, orderInfo: true,
//拒绝框 //拒绝框
...@@ -376,11 +425,14 @@ ...@@ -376,11 +425,14 @@
queryParams: { queryParams: {
pageNum: 1, pageNum: 1,
pageSize: 10, pageSize: 10,
goodsId: null,
goodsName: null,
applyTime: [], applyTime: [],
beginTime: 0, beginTime: 0,
endTime: 0, endTime: 0,
goodsId: null,
goodsName: null,
userNeed: null,
needMsg: null,
processDes: null
}, },
data: {}, data: {},
...@@ -419,6 +471,7 @@ ...@@ -419,6 +471,7 @@
}; };
}, },
created() { created() {
this.getParams();
this.getList(); this.getList();
this.$nextTick(() => { this.$nextTick(() => {
this.fullHeight = document.getElementsByClassName('box-card')[0].clientHeight this.fullHeight = document.getElementsByClassName('box-card')[0].clientHeight
...@@ -439,6 +492,19 @@ ...@@ -439,6 +492,19 @@
} }
}, },
methods: { methods: {
getParams() {
getSearchParams().then(res => {
if(res.userNeed && res.userNeed.length > 0) {
this.userNeedOptions = res.userNeed;
}
if(res.needMsg && res.needMsg.length > 0) {
this.needMsgOptions = res.needMsg;
}
if(res.processDes && res.processDes.length > 0) {
this.processDesOptions = res.processDes;
}
});
},
//原因 卖家拒绝(1:买家要求退款金额过高2:买家举证无效,商品没问题3:买家未举证,商品没问题4:商品已超售后服务时限5:退回商品后才能退款6:过期未操作,7:其他) //原因 卖家拒绝(1:买家要求退款金额过高2:买家举证无效,商品没问题3:买家未举证,商品没问题4:商品已超售后服务时限5:退回商品后才能退款6:过期未操作,7:其他)
actCauses(actCause) { actCauses(actCause) {
if (actCause == 1) { if (actCause == 1) {
...@@ -493,11 +559,11 @@ ...@@ -493,11 +559,11 @@
return "未知" return "未知"
} }
}, },
//获取地址后缀id // //获取地址后缀id
getIndex(index) { // getIndex(index) {
index = index.slice(14) // index = index.slice(14);
return index // return index
}, // },
//商品状态 0:,1:,2:,3 //商品状态 0:,1:,2:,3
goodsStatus(status) { goodsStatus(status) {
if (status == 0) { if (status == 0) {
...@@ -547,8 +613,7 @@ ...@@ -547,8 +613,7 @@
getList() { getList() {
this.loading = true; this.loading = true;
listRetreat(this.queryParams).then(response => { listRetreat(this.queryParams).then(response => {
console.log(response.data) //console.log(response.data)
// for
this.retreatList = response.data.list; this.retreatList = response.data.list;
this.total = response.data.total; this.total = response.data.total;
...@@ -634,7 +699,7 @@ ...@@ -634,7 +699,7 @@
if (response.code == 0) { if (response.code == 0) {
this.msgSuccess(response.msg); this.msgSuccess(response.msg);
} }
console.log("拒绝提交返回", response) // console.log("拒绝提交返回", response)
this.loading = false; this.loading = false;
}); });
}, },
...@@ -661,7 +726,7 @@ ...@@ -661,7 +726,7 @@
const id = row.Id const id = row.Id
getRetreat(id).then(response => { getRetreat(id).then(response => {
this.loading = false; this.loading = false;
console.log("000", response.data) //console.log("000", response.data)
this.form = response.data; this.form = response.data;
this.open = true; this.open = true;
this.title = "售后申请信息详情"; this.title = "售后申请信息详情";
...@@ -671,10 +736,30 @@ ...@@ -671,10 +736,30 @@
handleCancel() { handleCancel() {
this.open = false; this.open = false;
}, },
//
userNeedChange(val) {
if(val === '') {
this.queryParams.userNeed = null;
}
},
needMsgChange(val) {
if(val === '') {
this.queryParams.needMsg = null;
}
},
processDesChange(val) {
if(val === '') {
this.queryParams.processDes = null;
}
}
} //methods结束 } //methods结束
}; };
</script> </script>
<style scoped lang="scss" type="text/stylus"> <style scoped lang="scss" type="text/stylus">
/deep/.queryFormInline {
.el-form-item {
margin-bottom: 5px ;
}
}
</style> </style>
...@@ -4,16 +4,16 @@ ...@@ -4,16 +4,16 @@
<div slot="header" class="clearfix"> <div slot="header" class="clearfix">
<p class="fs18">修改密码</p> <p class="fs18">修改密码</p>
</div> </div>
<el-form :model="setForm" label-width="160px" size="small" class="set-form"> <el-form :model="setForm" label-width="160px" size="small" class="set-form">
<el-form-item label="平台登录账号:"> <el-form-item label="平台登录账号:">
<el-input v-model="setForm.name" :disabled="true" style="width: 300px;margin-right:20px;"></el-input> <el-input v-model="setForm.name" :disabled="true" style="width: 300px;margin-right:20px;"></el-input>
<el-button type="primary" icon="el-icon-edit" @click="edit('accountForm')">修改账号</el-button> <el-button type="primary" icon="el-icon-edit" @click="editAccount('accountForm')">修改账号</el-button>
</el-form-item> </el-form-item>
<el-form-item label="登录密码:"> <el-form-item label="登录密码:">
<el-input v-model="setForm.loginpsd" :disabled="true" style="width: 300px;margin-right:20px;"></el-input> <el-input v-model="setForm.loginpsd" :disabled="true" style="width: 300px;margin-right:20px;"></el-input>
<el-button type="primary" icon="el-icon-edit" @click="edit('loginForm')">修改密码</el-button> <el-button type="primary" icon="el-icon-edit" @click="editLogin('loginForm')">修改密码</el-button>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
...@@ -21,12 +21,12 @@ ...@@ -21,12 +21,12 @@
</el-form-item> </el-form-item>
<div style="width: 320px;margin:30px 160px 50px;"> <div style="width: 320px;margin:30px 160px 50px;">
<el-divider ></el-divider> <el-divider></el-divider>
</div> </div>
<el-form-item label="支付密码:"> <el-form-item label="支付密码:">
<el-input v-model="setForm.paypsd" :disabled="true" style="width: 300px;margin-right:20px;"></el-input> <el-input v-model="setForm.paypsd" :disabled="true" style="width: 300px;margin-right:20px;"></el-input>
<el-button type="primary" icon="el-icon-edit" @click="edit('payForm')">修改密码</el-button> <el-button type="primary" icon="el-icon-edit" @click="editPay('payForm')">修改密码</el-button>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
...@@ -35,118 +35,377 @@ ...@@ -35,118 +35,377 @@
</el-form> </el-form>
</el-card> </el-card>
<!--修改账号 对话框--> <!--修改账号 对话框-->
<el-dialog title="修改登录账号" :visible.sync="isAccount" center> <el-dialog title="修改登录账号" :visible.sync="isAccount" width="50%">
<el-form :model="accountForm" label-width="160px" size="small"> <el-form :model="accountForm" :rules="accountRules" ref="accountForm" label-width="200px" size="small">
<el-form-item label="登录密码:"> <el-form-item label="登录密码:" prop="loginpsd">
<el-input v-model="accountForm" style="width: 300px"></el-input> <el-input v-model="accountForm.loginpsd" placeholder="请输入登录密码" style="width: 300px"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="平台登录账号:"> <el-form-item label="新手机号:" prop="newTelphone">
<el-input v-model="accountForm.name" :disabled="true" style="width: 300px;margin-right:20px;"></el-input> <el-input v-model="accountForm.newTelphone" placeholder="请输入新的手机号码"
<el-button type="primary" icon="el-icon-edit" @click="edit('accountForm')">修改账号</el-button> style="width: 300px;margin-right:20px;"></el-input>
<el-button type="primary" icon="el-icon-edit" @click="getAccountCode()" v-if="isAccountCode">获取验证码</el-button>
<el-button type="info" style="width: 109px" :disabled="true" v-if="!isAccountCode">倒计时 {{ accountCountDown }}
S
</el-button>
</el-form-item>
<el-form-item label="短信验证码:" prop="verification">
<el-input v-model="accountForm.verification" placeholder="请输入短信验证码" style="width: 300px"></el-input>
</el-form-item> </el-form-item>
</el-form> </el-form>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<el-button @click="cancel">取 消</el-button> <el-button @click="cancel('accountForm')">取 消</el-button>
<el-button type="primary" @click="submit('accountForm')">确 定</el-button> <el-button type="primary" @click="submitAccount('accountForm')">确 定</el-button>
</span> </span>
</el-dialog> </el-dialog>
<!--修改登录密码 对话框--> <!--修改登录密码 对话框-->
<el-dialog title="修改登录密码" :visible.sync="isLogin" center> <el-dialog title="修改登录密码" :visible.sync="isLogin" width="50%">
<span>需要注意的是内容是默认不居中的</span> <el-form :model="loginForm" :rules="loginRules" ref="loginForm" label-width="200px" size="small">
<el-form-item label="新密码:" prop="newLoginpsd">
<el-input v-model="loginForm.newLoginpsd" plackeholder="请输入新密码" style="width: 300px" show-password></el-input>
</el-form-item>
<el-form-item label="确认新密码:" prop="newLoginpsdCheck">
<el-input v-model="loginForm.newLoginpsdCheck" plackeholder="请输入新密码" style="width: 300px"
show-password></el-input>
</el-form-item>
<el-form-item label="短信验证码:" prop="loginVerificationCode">
<el-input v-model="loginForm.loginVerificationCode" placeholder="请输入手机158****8888的验证码"
style="width: 300px;margin-right:20px;"></el-input>
<el-button type="primary" icon="el-icon-edit" @click="getLoginCode()" v-if="isLoginCode">获取验证码</el-button>
<el-button type="info" style="width: 109px" :disabled="true" v-if="!isLoginCode">倒计时 {{ loginCountDown }} S
</el-button>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<el-button @click="cancel">取 消</el-button> <el-button @click="cancel('loginForm')">取 消</el-button>
<el-button type="primary" @click="submit('loginForm')">确 定</el-button> <el-button type="primary" @click="submitLogin('loginForm')">确 定</el-button>
</span> </span>
</el-dialog> </el-dialog>
<!--修改支付密码 对话框--> <!--修改支付密码 对话框-->
<el-dialog title="修改支付密码" :visible.sync="isPay" center> <el-dialog title="修改支付密码" :visible.sync="isPay" width="50%">
<span>需要注意的是内容是默认不居中的</span> <el-form :model="payForm" :rules="payRules" ref="payForm" label-width="200px" size="small">
<el-form-item label="新密码:" prop="newPaypsd">
<el-input v-model="payForm.newPaypsd" plackeholder="请输入新密码" style="width: 300px" show-password></el-input>
</el-form-item>
<el-form-item label="确认新密码:" prop="newPaypsdCheck">
<el-input v-model="payForm.newPaypsdCheck" plackeholder="请输入新密码" style="width: 300px"
show-password></el-input>
</el-form-item>
<el-form-item label="短信验证码:" prop="payVerificationCode">
<el-input v-model="payForm.payVerificationCode" placeholder="请输入手机158****8888的验证码"
style="width: 300px;margin-right:20px;"></el-input>
<el-button type="primary" icon="el-icon-edit" @click="getPayCode()" v-if="isPayCode">获取验证码</el-button>
<el-button type="info" style="width: 109px" :disabled="true" v-if="!isPayCode">倒计时 {{payCountDown}} S
</el-button>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<el-button @click="cancel">取 消</el-button> <el-button @click="cancel('payForm')">取 消</el-button>
<el-button type="primary" @click="submit('payForm')">确 定</el-button> <el-button type="primary" @click="submitPay">确 定</el-button>
</span> </span>
</el-dialog> </el-dialog>
</div> </div>
</template> </template>
<script> <script>
import {changeTelphone, getTelphoneCode} from '@/api/module/settings'
export default { export default {
name: "Setpsd", name: "Setpsd",
data() { data() {
// 手机号码格式校验
let checkTel = (rule, value, callback) => {
const reg = /^1[3456789]\d{9}$/;
if (value === '') {
callback(new Error('手机号码不能为空'));
} else if (!reg.test(value)) {
callback(new Error('手机号码格式不对,请重新输入'));
} else {
callback();
}
};
// 校验新 登录密码
let checkNewPsd = (rule, value, callback) => {
const reg = /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{8,16}$/;
if (value === '') {
callback(new Error('密码不能为空'));
} else if (!reg.test(value)) {
callback(new Error('密码为8-16位,由数字和字母组成'));
} else {
callback();
}
};
// 二次输入 登录密码
let checkNewPsdAgain = (rule, value, callback) => {
if (value === '') {
callback(new Error('密码不能为空'));
} else if (value !== this.loginForm.newLoginpsd) {
callback(new Error('两次密码不一致,请检查后重新输入'));
} else {
callback();
}
};
// 校验 支付密码
let checkPayPsd = (rule, value, callback) => {
const reg = /^[0-9]{6}$/;
if (value === '') {
callback(new Error('密码不能为空'));
} else if (!reg.test(value)) {
callback(new Error('密码位8位数字'));
} else {
callback();
}
};
// 二次输入 登录密码
let checkPayPsdAgain = (rule, value, callback) => {
if (value === '') {
callback(new Error('密码不能为空'));
} else if (value !== this.payForm.newPaypsd) {
callback(new Error('两次密码不一致,请检查后重新输入'));
} else {
callback();
}
};
return { return {
isAccount: false, isAccount: false,
isLogin: false, isLogin: false,
isPay: false, isPay: false,
isAccountCode: true,
isLoginCode: true,
isPayCode: true,
accountCountDown: '',
loginCountDown: '',
payCountDown: '',
setForm: { setForm: {
name: '', name: '',
loginpsd: '******', loginpsd: '******',
paypsd: '******' paypsd: '******'
}, },
accountForm: { accountForm: {
loginpsd: '',
newTelphone: '',
verification: ''
},
accountRules: {
loginpsd: [{required: true, message: '登录密码不能为空', trigger: 'blur'}],
newTelphone: [{required: true, validator: checkTel, trigger: 'blur'}],
verification: [{required: true, message: '验证码不能为空', trigger: 'blur'}],
}, },
loginForm: { loginForm: {
newLoginpsd: '',
newLoginpsdCheck: '',
loginVerificationCode: ''
},
loginRules: {
newLoginpsd: [{required: true, validator: checkNewPsd, trigger: 'blur'}],
newLoginpsdCheck: [{required: true, validator: checkNewPsdAgain, trigger: 'blur'}],
loginVerificationCode: [{required: true, message: '验证码不能为空', trigger: 'blur'}]
}, },
payForm: { payForm: {
newPaypsd: '',
newPaypsdCheck: '',
payVerificationCode: '',
},
payRules: {
newPaypsd: [{required: true, validator: checkPayPsd, trigger: 'blur'}],
newPaypsdCheck: [{required: true, validator: checkPayPsdAgain, trigger: 'blur'}],
payVerificationCode: [{required: true, message: '验证码不能为空', trigger: 'blur'}],
} }
} }
}, },
mounted() { mounted() {
this.setForm.name = this.$store.state.user.name;
}, },
methods: { methods: {
// 修改 // 修改 账号
edit(formName) { editAccount() {
// 账号 this.isAccount = true;
if(formName === 'accountForm') { },
this.isAccount = true; // 修改 登录密码
editLogin() {
this.isLogin = true;
},
// 修改 支付密码
editPay() {
this.isPay = true;
},
// 获取验证码
getAccountCode() {
// 先校验
if (this.accountForm.loginpsd === '') {
this.$refs.accountForm.validateField('loginpsd');
return;
} }
// 登录密码 //
if(formName === 'loginForm') { const telphoneReg = /^1[3456789]\d{9}$/;
this.isLogin = true; if (!telphoneReg.test(this.accountForm.newTelphone)) {
this.$refs.accountForm.validateField('newTelphone');
return;
} }
// 支付密码 const TIME_COUNT = 60;
if(formName === 'payForm') { // let count =
this.isPay = true; if (!this.timer) {
this.accountCountDown = TIME_COUNT;
this.isAccountCode = false;
this.timer = setInterval(() => {
if (this.accountCountDown > 0 && this.accountCountDown <= TIME_COUNT) {
this.accountCountDown--;
} else {
this.isAccountCode = true;
clearInterval(this.timer);
this.timer = null;
}
}, 1000)
} }
}, },
submit(formName) { // 修改登录密码的 获取校验码 loginCountDown
if(formName === 'accountForm') { getLoginCode() {
this.isAccount = false; let loginpsdReg = /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{8,16}$/;
if (this.loginForm.newLoginpsd === '' || !loginpsdReg.test(this.loginForm.newLoginpsd)) {
this.$refs.loginForm.validateField('newLoginpsd');
return;
} }
// 登录密码
if(formName === 'loginForm') { if (this.loginForm.newLoginpsdCheck === '' || this.loginForm.newLoginpsdCheck !== this.loginForm.newLoginpsd) {
this.isLogin = false; this.$refs.loginForm.validateField('newLoginpsdCheck');
return;
} }
// 支付密码
if(formName === 'payForm') { const TIME_COUNT = 60;
this.isPay = false; if (!this.timer) {
this.loginCountDown = TIME_COUNT;
this.isLoginCode = false;
this.timer = setInterval(() => {
if (this.loginCountDown > 0 && this.loginCountDown <= TIME_COUNT) {
this.loginCountDown--;
} else {
this.isLoginCode = true;
clearInterval(this.timer);
this.timer = null;
}
}, 1000)
}
},
// 修改支付密码,获取手机验证码
getPayCode() {
let paypsdReg = /^[0-9]{6}$/;
if (this.payForm.newPaypsd === '' || !paypsdReg.test(this.payForm.newPaypsd)) {
this.$refs.payForm.validateField('newPaypsd');
return;
}
if (this.payForm.newPaypsdCheck === '' || this.payForm.newPaypsdCheck !== this.payForm.newPaypsd) {
this.$refs.payForm.validateField('newPaypsdCheck');
return;
}
const TIME_COUNT = 60;
if (!this.timer) {
this.payCountDown = TIME_COUNT;
this.isPayCode = false;
this.timer = setInterval(() => {
if (this.payCountDown > 0 && this.payCountDown <= TIME_COUNT) {
this.payCountDown--;
} else {
this.isPayCode = true;
clearInterval(this.timer);
this.timer = null;
}
}, 1000)
} }
// 获取手机验证码
// getTelphoneCode(this.loginForm).then(res => {
//
// });
}, },
cancel() { // 平台登录账号 确定
this.isAccount = false; submitAccount(formName) {
this.isLogin = false; this.$refs[formName].validate(valid => {
this.isPay = false; if (valid) {
// 接口
changeTelphone(this.accountForm).then(res => {
console.log('修改手机号返回结果', res);
});
this.clearAccountCodeDown();
this.isAccount = false;
}
});
}, },
// 登录密码 确定
submitLogin(formName) {
this.$refs[formName].validate(valid => {
if (valid) {
this.clearAccountCodeDown();
this.isLogin = false;
}
});
},
// 支付密码 确定
submitPay(formName) {
this.$refs[formName].validate(valid => {
if (valid) {
this.isPay = false;
}
});
},
// 取消
cancel(formName) {
// 清空倒计时
this.clearAccountCodeDown();
if (formName === 'accountForm') {
this.isAccount = false;
this.$refs[formName].resetFields();
} else if (formName === 'loginForm') {
this.isLogin = false;
this.$refs[formName].resetFields();
} else if (formName === 'payForm') {
this.isPay = false;
this.$refs[formName].resetFields();
}
},
// 强制清空倒计时
clearAccountCodeDown() {
this.isAccountCode = true;
this.isLoginCode = true;
this.isPayCode = true;
this.accountCountDown = '';
this.loginCountDown = '';
this.payCountDown = '';
}
} }
} }
</script> </script>
<style lang="scss" type="text/stylus" scoped> <style lang="scss" type="text/stylus" scoped>
.card-cont { .card-cont {
margin: 50px 0; margin: 50px 0;
} }
.set-form {
width: 90%; .set-form {
margin: 40px 0 30px 100px; width: 90%;
/deep/.el-form-item { margin: 40px 0 30px 100px;
margin-top: 18px!important;
/deep/ .el-form-item {
margin-top: 18px !important;
}
} }
}
.tipsGray { .tipsGray {
font-size: 14px; font-size: 14px;
color: #C9C9C9; color: #C9C9C9;
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论