mz666
/
bocai_supplyChain_pc
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

2.5

Browse Source
cyl/dev
wangxia 4 years ago
parent 03ebceb300
commit 98702d291a
21 changed files with 1055 additions and 140 deletions
Show Stats Download Patch File Download Diff File

54
src/api/userinfo.js
Unescape Escape View File

@ -48,3 +48,57 @@ export function userBaseInfoApi(data) {
params: data,
});
}
// 获取用户积分信息
export function getPointApi(data) {
return request({
url: "/yishoudan/wallet/getPoint",
// method: "post",
params: data,
});
}
// 获取用户积分使用信息
export function getPointDetailApi(data) {
return request({
url: "/yishoudan/pointUseRecord/list",
// method: "post",
params: data,
});
}
// 登录状态账号设置修改密码
export function setUserPswApi(data) {
return request({
url: "/yishoudan/changePassword",
// method: "post",
params: data,
});
}
// 登录状态账号修改绑定手机号
export function setUserTelApi(data) {
return request({
url: "/yishoudan/user/changeTel",
// method: "post",
params: data,
});
}
// 账号修改绑定银行卡
export function getUserBankListApi(data) {
return request({
url: "/yishoudan/user/bank/getUserBankList",
// method: "post",
params: data,
});
}
// 实名认证
export function setUserRealNameApi(data) {
return request({
url: "/yishoudan/user/realNameAuth",
// method: "post",
params: data,
});
}

104
src/components/userinfo/accountsetting/components/boundbankcard.vue
Unescape Escape View File

@ -0,0 +1,104 @@
<template>
<div class="boundbankcard-container">
<div class="contenttitle">
<span>绑定银行卡</span>
</div>
<div class="contentbody">
<ul v-if="userbanklist.length > 0">
<li v-for="(item, index) in userbanklist" :key="index">
<div class="logo">
<img
src="http://matripe.oss-cn-beijing.aliyuncs.com/bankCard.png"
alt=""
/>
</div>
<div class="bankname">{{ item.bankName }} 借记卡</div>
<div class="bankcode">
•••• •••• •••• •••• <span>{{ item.newbankNo }}</span>
</div>
</li>
</ul>
<div style="text-align: center">扫一扫</div>
</div>
</div>
</template>
<script>
export default {
// 组件名称
name: "",
// 局部注册的组件
components: {},
// 组件参数 接收来自父组件的数据
props: {
userbanklist: {
require: true,
type: Array,
},
},
// 组件状态值
data() {
return {};
},
// 计算属性
computed: {},
// 侦听器
watch: {},
// 生命周期钩子 注：没用到的钩子请自行删除
/**
* 组件实例创建完成，属性已绑定，但DOM还未生成，$ el属性还不存在
*/
created() {},
/**
* el 被新创建的 vm.el 替换，并挂载到实例上去之后调用该钩子。
* 如果 root 实例挂载了一个文档内元素，当 mounted 被调用时 vm.el 也在文档内。
*/
mounted() {},
// 组件方法
methods: {},
};
</script>
<style scoped lang="less">
.boundbankcard-container {
.contentbody {
ul {
padding-bottom: 16px;
border-bottom: 1px solid #f9f9f9;
li {
width: 790px;
height: 76px;
display: flex;
justify-content: left;
align-items: center;
background: #fff1e7;
border: 1px solid #ff6a00;
border-radius: 8px;
.logo {
width: 32px;
height: 32px;
margin-left: 60px;
img {
width: 100%;
height: 100%;
}
}
.bankname {
font-size: 18px;
margin-left: 16px;
min-width: 250px;
color: #4d575e;
}
.bankcode {
font-size: 30px;
line-height: 36px;
color: #a2a2a2;
span {
color: #4d575e;
}
}
}
}
}
}
</style>

191
src/components/userinfo/accountsetting/components/boundtel.vue
Unescape Escape View File

@ -0,0 +1,191 @@
<template>
<div class="boundtel-container">
<div class="contenttitle">
<span v-if="!istelshow">绑定手机</span>
<span v-else>已绑定手机</span>
</div>
<div class="contentbody" v-if="!istelshow">
<div class="warninginfo">
您的账号可能存在安全风险，为了确保为您本人操作，请先进行安全验证
</div>
<div class="tel">
<div>手机号</div>
<input
type="text"
v-model.trim="usertelinfo.tel"
maxlength="11"
/><br />
<input type="text" v-model.trim="usertelinfo.code" maxlength="4" />
<span class="getrulecode"
><span
@click="getPhoneCode"
data-mark="getcode"
v-if="timedata.isfinish"
>获取验证码</span
><timmer :timedata="timedata" v-if="!timedata.isfinish"
/></span>
</div>
<button @click="submit">确定</button>
</div>
<div class="contentbody" v-else>
<div>{{ userinfo.hidetel }}</div>
<button style="width: 106px; margin-top: 16px" @click="istelshow = false">
更换手机号
</button>
</div>
</div>
</template>
<script>
import { getPhoneCodeApi } from "@/api/login.js";
import { setUserTelApi } from "../../../../api/userinfo";
import timmer from "../../../Login/components/countback.vue";
export default {
// 组件名称
name: "",
// 局部注册的组件
components: {
timmer,
},
// 组件参数 接收来自父组件的数据
props: {
userinfo: {
require: true,
},
},
// 组件状态值
data() {
return {
usertelinfo: {
tel: "",
code: "",
},
timedata: {
isfinish: true,
deadline: 60,
timmer: null,
},
istelshow: false,
};
},
// 计算属性
computed: {},
// 侦听器
watch: {},
// 生命周期钩子 注：没用到的钩子请自行删除
/**
* 组件实例创建完成，属性已绑定，但DOM还未生成，$ el属性还不存在
*/
created() {
if (this.userinfo.tel) {
this.istelshow = true;
console.log(this.istelshow);
}
},
/**
* el 被新创建的 vm.el 替换，并挂载到实例上去之后调用该钩子。
* 如果 root 实例挂载了一个文档内元素，当 mounted 被调用时 vm.el 也在文档内。
*/
mounted() {},
// 组件方法
methods: {
async submit() {
try {
var reg_tel =
/^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/;
if (this.usertelinfo.tel.length === 0) {
this.$message.warning("请输入手机号");
} else if (!reg_tel.test(this.usertelinfo.tel)) {
this.$message.warning("请输入正确的手机号");
} else if (this.usertelinfo.code.length === 0) {
this.$message.warning("请输入验证码");
} else {
this.timedata.isfinish = false;
const { data } = await setUserTelApi(this.usertelinfo);
console.log(data);
if (data.status === 200) {
this.$message.success("绑定手机成功");
}
}
} catch (error) {
console.log(error);
}
},
async getPhoneCode() {
// 获取手机验证码
var reg_tel =
/^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/;
if (this.usertelinfo.tel.length === 0) {
this.$message.warning("请输入手机号");
} else if (!reg_tel.test(this.usertelinfo.tel)) {
this.$message.warning("请输入正确的手机号");
} else {
this.timedata.isfinish = false;
const { data } = await getPhoneCodeApi({ tel: this.usertelinfo.tel });
console.log(data);
}
},
},
};
</script>
<style scoped lang="less">
.boundtel-container {
.warninginfo {
font-size: 14px;
color: #4d575e;
}
.tel {
position: relative;
margin-top: 24px;
> div {
font-size: 16px;
margin-bottom: 8px;
line-height: 16px;
}
input {
outline: none;
width: 430px;
height: 40px;
text-indent: 10px;
margin-bottom: 16px;
font-size: 16px;
background: #fff;
border: 1px solid #dddddd;
border-radius: 4px;
}
.getrulecode {
padding: 0 0 0 10px;
position: absolute;
width: 89px;
font-size: 14px;
text-align: center;
border-left: 1px #cccccc solid;
line-height: 14px;
color: #4d575e;
right: 390px;
bottom: 30px;
div {
margin-bottom: 0;
}
span[data-mark="getcode"] {
cursor: pointer;
}
}
}
button {
width: 64px;
height: 32px;
background: #ff6a00;
border-radius: 4px;
border: none;
font-size: 14px;
color: #fff;
&:hover {
background-color: #fe8034;
}
}
}
</style>

70
src/components/userinfo/accountsetting/components/boundwx.vue
Unescape Escape View File

@ -0,0 +1,70 @@
<template>
<div class="boundwx-container">
<div class="contenttitle">
<span v-if="!userinfo.tel">绑定微信</span>
<span v-else>已绑定微信</span>
</div>
<div class="contentbody" v-if="!userinfo.tel"></div>
<div class="contentbody" v-else>
<div class="username">{{ userinfo.userName }}</div>
<button @click="submit">更换微信号</button>
</div>
</div>
</template>
<script>
export default {
// 组件名称
name: "",
// 局部注册的组件
components: {},
// 组件参数 接收来自父组件的数据
props: {
userinfo: {
require: true,
},
},
// 组件状态值
data() {
return {};
},
// 计算属性
computed: {},
// 侦听器
watch: {},
// 生命周期钩子 注：没用到的钩子请自行删除
/**
* 组件实例创建完成，属性已绑定，但DOM还未生成，$ el属性还不存在
*/
created() {},
/**
* el 被新创建的 vm.el 替换，并挂载到实例上去之后调用该钩子。
* 如果 root 实例挂载了一个文档内元素，当 mounted 被调用时 vm.el 也在文档内。
*/
mounted() {},
// 组件方法
methods: {
submit() {},
},
};
</script>
<style scoped lang="less">
.boundwx-container {
.contentbody {
button {
// width: 64px;
// height: 32px;
padding: 5px 18px;
background: #ff6a00;
border-radius: 4px;
border: none;
font-size: 14px;
color: #fff;
&:hover {
background-color: #fe8034;
}
}
}
}
</style>

129
src/components/userinfo/accountsetting/components/loginpsw.vue
Unescape Escape View File

@ -0,0 +1,129 @@
<template>
<div class="loginpsw-container">
<div class="contenttitle">
<span>设置新的密码</span>
</div>
<div class="contentbody">
<div class="username">
<div>用户名</div>
<input type="text" :value="username" disabled="disabled" />
</div>
<div class="password">
<div>密码</div>
<input type="password" v-model.trim="password" />
</div>
<button @click="submit">确定</button>
</div>
</div>
</template>
<script>
import { setUserPswApi } from "../../../../api/userinfo";
export default {
// 组件名称
name: "",
// 局部注册的组件
components: {},
// 组件参数 接收来自父组件的数据
props: {
userinfo: {
require: true,
},
},
// 组件状态值
data() {
return {
username: "",
password: null,
};
},
// 计算属性
computed: {},
// 侦听器
watch: {
userinfo() {
this.$nextTick(() => {
console.log(this.userinfo.tel);
this.username = this.userinfo.tel;
console.log(this.username);
});
},
},
// 生命周期钩子 注：没用到的钩子请自行删除
/**
* 组件实例创建完成，属性已绑定，但DOM还未生成，$ el属性还不存在
*/
created() {
this.username = this.userinfo.tel;
},
/**
* el 被新创建的 vm.el 替换，并挂载到实例上去之后调用该钩子。
* 如果 root 实例挂载了一个文档内元素，当 mounted 被调用时 vm.el 也在文档内。
*/
mounted() {},
// 组件方法
methods: {
async submit() {
if (this.password === null || this.password.length === 0) {
this.$message.warning("请输入密码");
} else {
try {
const { data } = await setUserPswApi({ password: this.password });
console.log(data);
if (data.status === 200) {
this.$message.success("密码修改成功");
}
} catch (error) {
console.log(error);
}
}
console.log(this.password);
},
},
};
</script>
<style scoped lang="less">
.loginpsw-container {
.contentbody {
.username,
.password {
margin-top: 16px;
div {
font-size: 16px;
line-height: 16px;
margin-bottom: 8px;
}
input {
outline: none;
width: 430px;
height: 40px;
text-indent: 10px;
font-size: 16px;
background: #eeeeee;
border: 1px solid #dddddd;
border-radius: 4px;
}
}
.password {
input {
background-color: #fff;
}
}
button {
width: 64px;
height: 32px;
margin-top: 21px;
background: #ff6a00;
border-radius: 4px;
border: none;
font-size: 14px;
color: #fff;
&:hover {
background-color: #fe8034;
}
}
}
}
</style>

149
src/components/userinfo/accountsetting/components/realname.vue
Unescape Escape View File

@ -0,0 +1,149 @@
<template>
<div class="realname-container">
<div class="contenttitle">
<span>实名认证</span>
</div>
<div class="contentbody" v-if="userinfo.IDAuth === 0">
<div class="warningmsg">智能加密，保障您的信息安全</div>
<div class="idcardbox">
<div class="realname">
<div>真实姓名</div>
<input
type="text"
placeholder="请输入真实姓名"
v-model.trim="userinfoobj.realName"
/>
</div>
<div class="idcard">
<div>身份证号</div>
<input
type="text"
placeholder="请输入本人真实身份证号"
v-model.trim="userinfoobj.idCard"
/>
</div>
<button @click="submit">确定</button>
</div>
</div>
<div class="contentbody" v-else>
<div class="warningmsg">智能加密，保障您的信息安全</div>
<div>真实姓名：{{ userinfo.realName }}</div>
<div>身份证号：{{ userinfo.IDCard }}</div>
</div>
</div>
</template>
<script>
import { setUserRealNameApi } from "@/api/userinfo.js";
export default {
inject: ["reload"],
// 组件名称
name: "",
// 局部注册的组件
components: {},
// 组件参数 接收来自父组件的数据
props: {
userinfo: {
require: true,
},
},
// 组件状态值
data() {
return {
userinfoobj: {
realName: "",
idCard: "",
},
};
},
// 计算属性
computed: {},
// 侦听器
watch: {},
// 生命周期钩子 注：没用到的钩子请自行删除
/**
* 组件实例创建完成，属性已绑定，但DOM还未生成，$ el属性还不存在
*/
created() {},
/**
* el 被新创建的 vm.el 替换，并挂载到实例上去之后调用该钩子。
* 如果 root 实例挂载了一个文档内元素，当 mounted 被调用时 vm.el 也在文档内。
*/
mounted() {},
// 组件方法
methods: {
async submit() {
try {
if (
this.userinfoobj.realName.length !== 0 &&
this.userinfoobj.idCard.length !== 0
) {
const { data } = await setUserRealNameApi(this.userinfoobj);
console.log(data);
if (data.status === 200) {
this.$message.success("实名认证成功");
this.reload();
}
} else {
this.$message.warning("信息不完整");
}
} catch (error) {
console.log(error);
}
},
},
};
</script>
<style scoped lang="less">
.realname-container {
.contentbody {
> div {
font-size: 16px;
margin-bottom: 16px;
}
}
.warningmsg {
font-size: 14px;
color: #4d575e;
margin: 24px 0;
}
.idcardbox {
> div {
> div {
font-size: 16px;
margin-bottom: 8px;
line-height: 16px;
}
input {
outline: none;
width: 430px;
height: 40px;
text-indent: 10px;
margin-bottom: 16px;
font-size: 16px;
background: #fff;
border: 1px solid #dddddd;
border-radius: 4px;
&::placeholder {
color: #c2c5c8;
font-size: 16px;
}
}
}
button {
width: 64px;
height: 32px;
background: #ff6a00;
border-radius: 4px;
border: none;
font-size: 14px;
color: #fff;
&:hover {
background-color: #fe8034;
}
}
}
}
</style>

163
src/components/userinfo/accountsetting/inedex.vue
Unescape Escape View File

@ -6,37 +6,82 @@
<div class="avatarbox">
<i class="iconfont icon-morentouxiang"></i>
</div>
<div class="username">Hi,{{ 1 }}</div>
<div class="username" v-if="userinfo.userName">
Hi,{{ userinfo.userName }}
</div>
<div class="username" v-else>Hi,{{ userinfo.hidetel }}</div>
</div>
<ul>
<li>
<li
@click="pushto('/userinfo/accountsetting/loginpsw')"
:class="{ tagactive: activelist === 0 }"
>
<span><i class="iconfont icon-gerenzhongxin-mima"></i>登录密码</span
><i class="iconfont icon-youjiantou"></i>
><span
><span>已设置</span>
<i class="iconfont icon-youjiantou"></i>
</span>
</li>
<li>
<li
@click="pushto('/userinfo/accountsetting/boundtel')"
:class="{ tagactive: activelist === 1 }"
>
<span
><i class="iconfont icon-gerenzhongxin-bangdingshouji"></i
>绑定手机</span
><i class="iconfont icon-youjiantou"></i>
><span
><span>{{ userinfo.hidetel }}</span>
<i class="iconfont icon-youjiantou"></i>
</span>
</li>
<li>
<li
@click="pushto('/userinfo/accountsetting/boundwx')"
:class="{ tagactive: activelist === 2 }"
>
<span><i class="iconfont icon-weixin1"></i>绑定微信</span
><i class="iconfont icon-youjiantou"></i>
><span
><span>已绑定</span>
<i class="iconfont icon-youjiantou"></i>
</span>
</li>
<li>
<li
@click="pushto('/userinfo/accountsetting/boundbankcard')"
:class="{ tagactive: activelist === 3 }"
>
<span
><i class="iconfont icon-bangdingyinhangka"></i>绑定银行卡</span
><i class="iconfont icon-youjiantou"></i>
><span
><span>{{ userbanklist.length }}张</span>
<i class="iconfont icon-youjiantou"></i>
</span>
</li>
</ul>
<ul>
<li
@click="pushto('/userinfo/accountsetting/realname')"
:class="{ tagactive: activelist === 4 }"
>
<span><i class="iconfont icon-shimingrenzheng"></i>实名认证</span
><span
><span v-if="userinfo.realName">已认证</span
><span v-else>未认证</span>
<i class="iconfont icon-youjiantou"></i>
</span>
</li>
</ul>
</div>
<div class="rightcontent"></div>
<div class="rightcontent">
<router-view
:userinfo="userinfo"
:userbanklist="userbanklist"
></router-view>
</div>
</div>
</div>
</template>
<script>
import { userBaseInfoApi } from "../../../api/userinfo";
import { userBaseInfoApi, getUserBankListApi } from "../../../api/userinfo";
export default {
// 组件名称
@ -47,18 +92,32 @@ export default {
props: {},
// 组件状态值
data() {
return {};
return {
userinfo: {}, // 用户基础信息
activelist: "",
userbanklist: [],
};
},
// 计算属性
computed: {},
computed: {
path() {
return this.$route.fullPath;
},
},
// 侦听器
watch: {},
watch: {
path() {
this.changeactive();
},
},
// 生命周期钩子 注：没用到的钩子请自行删除
/**
* 组件实例创建完成，属性已绑定，但DOM还未生成，$ el属性还不存在
*/
created() {
this.getUserInfo();
this.changeactive();
this.getuserbnak();
},
/**
* el 被新创建的 vm.el 替换，并挂载到实例上去之后调用该钩子。
@ -70,7 +129,46 @@ export default {
async getUserInfo() {
try {
const { data } = await userBaseInfoApi();
if (data.status === 200) {
this.userinfo = data.data;
console.log(this.userinfo);
const beforetel = this.userinfo.tel.substr(0, 3);
const aftertel = this.userinfo.tel.substr(7, 4);
this.userinfo.hidetel = beforetel + "****" + aftertel;
console.log(aftertel);
console.log(beforetel);
}
console.log(data);
} catch (error) {
console.log(error);
}
},
pushto(url) {
this.$router.push(url);
},
changeactive() {
if (this.path.indexOf("/loginpsw") > -1) {
this.activelist = 0;
} else if (this.path.indexOf("/boundtel") > -1) {
this.activelist = 1;
} else if (this.path.indexOf("/boundwx") > -1) {
this.activelist = 2;
} else if (this.path.indexOf("/boundbankcard") > -1) {
this.activelist = 3;
} else if (this.path.indexOf("/realname") > -1) {
this.activelist = 4;
}
},
async getuserbnak() {
try {
const { data } = await getUserBankListApi();
console.log(data);
this.userbanklist = data.data;
this.userbanklist.forEach((ele) => {
ele.newbankNo = ele.bankNo.substr(14, 4);
});
// const newdata = this.userbanklist.bankNo.substr(14, 4);
// console.log(newdata);
} catch (error) {
console.log(error);
}
@ -83,12 +181,13 @@ export default {
.accountcontent {
height: 1000px;
margin-top: 16px;
background-color: pink;
// background-color: pink;
display: flex;
.accountSetList {
width: 346px;
height: 500px;
background-color: skyblue;
// background-color: skyblue;
margin-right: 16px;
.userinfobox {
width: 346px;
@ -96,14 +195,18 @@ export default {
background: #ffffff;
border-radius: 4px;
padding: 24px 0;
text-align: center;
.avatarbox {
text-align: center;
i {
font-size: 60px;
line-height: 60px;
font-size: 54px;
line-height: 54px;
color: #ff6a00;
}
}
.username {
margin-top: 18px;
}
}
> ul {
background-color: #fff;
@ -111,6 +214,7 @@ export default {
// padding: 0 16px;
border-radius: 4px;
overflow: hidden;
li {
position: relative;
display: flex;
@ -129,16 +233,26 @@ export default {
left: 16px;
background-color: #f3f4f4;
}
span {
> span:first-child {
font-size: 16px;
i {
margin-right: 12px;
font-size: 20px;
}
}
> i {
color: #888;
font-size: 22px;
> span:last-child {
line-height: 22px;
span {
color: #999;
font-size: 14px;
}
> i {
color: #888;
margin-left: 12px;
vertical-align: middle;
font-size: 22px;
}
}
}
}
@ -146,7 +260,8 @@ export default {
.rightcontent {
width: 838px;
height: 600px;
background-color: gray;
padding: 0 16px;
background-color: #fff;
}
}
</style>

21
src/components/userinfo/usercenter/components/mybalance.vue
Unescape Escape View File

@ -24,6 +24,7 @@
:data-source="data"
:pagination="false"
@change="onChange"
:rowKey="(record) => record.index"
>
<a slot="name" slot-scope="text">{{ text }}</a>
</a-table>
@ -50,7 +51,7 @@
</template>
<script>
import { userBalanceApi, userDetailApi } from "../../../../api/userinfo";
import { userDetailApi } from "../../../../api/userinfo";
import { formatDateYMD } from "../../../../utils/commonUtil";
export default {
// 组件名称
@ -58,7 +59,11 @@ export default {
// 局部注册的组件
components: {},
// 组件参数 接收来自父组件的数据
props: {},
props: {
userbalance: {
require: true,
},
},
// 组件状态值
data() {
return {
@ -104,7 +109,6 @@ export default {
},
],
data: [],
userbalance: "",
};
},
// 计算属性
@ -116,7 +120,6 @@ export default {
* 组件实例创建完成，属性已绑定，但DOM还未生成，$ el属性还不存在
*/
created() {
this.getUserBalanceInfo();
this.getUserDetailInfo();
},
/**
@ -136,15 +139,7 @@ export default {
// this.getJobList();
console.log(e);
},
async getUserBalanceInfo() {
try {
const { data } = await userBalanceApi();
this.userbalance = data.data.balance;
console.log(data);
} catch (error) {
console.log(error);
}
},
async getUserDetailInfo() {
try {
const { data } = await userDetailApi(this.pagination);

15
src/components/userinfo/usercenter/components/mybill.vue
Unescape Escape View File

@ -2,7 +2,7 @@
<div class="mybill-container">
<div class="contenttitle">
<span>我的工单</span>
<div @click="getBill">
<div @click="resetpag">
<button
@click="pagination.searchTag = 0"
:class="{ townsmanactive: pagination.searchTag === 0 }"
@ -34,6 +34,7 @@
tip: '加载中',
wrapperClassName: 'spinstyle',
}"
:rowKey="(record) => record.index"
>
<a slot="name" slot-scope="text">{{ text }}</a>
</a-table>
@ -75,7 +76,7 @@ export default {
pagination: {
pageNum: 1,
pageSize: 2,
total: 8, //分页配置
total: null, //分页配置
searchTag: 0,
},
columns: [
@ -153,6 +154,7 @@ export default {
},
async getBill() {
console.log("click");
console.log(this.pagination.searchTag);
try {
this.isspinning = true;
const { data } = await userBillApi(this.pagination);
@ -174,6 +176,15 @@ export default {
console.log(error);
}
},
resetpag() {
this.pagination = {
pageNum: 1,
pageSize: 2,
total: 8, //分页配置
searchTag: this.pagination.searchTag,
};
this.getBill();
},
},
};
</script>

112
src/components/userinfo/usercenter/components/myintegral.vue
Unescape Escape View File

@ -10,7 +10,7 @@
><i class="iconfont icon-zhengyan" v-if="showbalance"></i
><i class="iconfont icon-biyan" v-else></i></i
></span>
<p v-if="showbalance">999</p>
<p v-if="showbalance">{{ userpoint }}</p>
<p v-else>***</p>
</div>
</div>
@ -24,6 +24,7 @@
:data-source="data"
:pagination="false"
@change="onChange"
:rowKey="(record) => record.index"
>
<!-- <a slot="name" slot-scope="text">{{ text }}</a> -->
</a-table>
@ -50,13 +51,19 @@
</template>
<script>
import { getPointDetailApi } from "../../../../api/userinfo";
import { formatDateYMD } from "../../../../utils/commonUtil";
export default {
// 组件名称
name: "",
// 局部注册的组件
components: {},
// 组件参数 接收来自父组件的数据
props: {},
props: {
userpoint: {
require: true,
},
},
// 组件状态值
data() {
return {
@ -70,84 +77,43 @@ export default {
},
{
title: "兑换物品",
dataIndex: "money",
key: "money",
dataIndex: "goodsName",
key: "goodsName",
width: 120,
},
{
title: "物品数量",
dataIndex: "num",
key: "num",
dataIndex: "goodsNum",
key: "goodsNum",
width: 90,
// ellipsis: true,
},
{
title: "扣除积分",
dataIndex: "deduct",
key: "deduct",
dataIndex: "point",
key: "point",
// ellipsis: true,
width: 140,
},
{
title: "状态",
dataIndex: "state",
key: "state",
dataIndex: "state1",
key: "state1",
// ellipsis: true,
// width: 90,
},
{
title: "更新时间",
dataIndex: "time",
key: "time",
dataIndex: "updateTime",
key: "updateTime",
width: 160,
},
],
data: [
{
index: "1",
money: "现金20元",
state: "交易成功",
num: "12",
deduct: "1000",
time: "2021-09-13 15:41",
},
{
index: "2",
money: "水杯",
state: "审核中",
num: "123",
deduct: "1430",
time: "2021-09-13 15:41",
},
{
index: "3",
money: "枕头",
state: "交易关闭",
num: "12",
deduct: "1100",
time: "2021-09-13 15:41",
},
{
index: "4",
money: "现金10元",
state: "交易关闭",
num: "32",
deduct: "1200",
time: "2021-09-13 15:41",
},
{
index: "5",
money: "指甲剪",
state: "交易关闭",
num: "21",
deduct: "3000",
time: "2021-09-13 15:41",
},
],
data: [],
pagination: {
pageNum: 1,
pageSize: 2,
total: 8, //分页配置
pageSize: 1,
total: null, //分页配置
},
showbalance: true,
};
@ -160,7 +126,9 @@ export default {
/**
* 组件实例创建完成，属性已绑定，但DOM还未生成，$ el属性还不存在
*/
created() {},
created() {
this.getPointDetail();
},
/**
* el 被新创建的 vm.el 替换，并挂载到实例上去之后调用该钩子。
* 如果 root 实例挂载了一个文档内元素，当 mounted 被调用时 vm.el 也在文档内。
@ -178,6 +146,36 @@ export default {
// this.getJobList();
console.log(e);
},
async getPointDetail() {
try {
const { data } = await getPointDetailApi(this.pagination);
console.log(data);
if (data.status === 200) {
// console.log();
this.data = data.data.recordList;
this.data.forEach((item, index) => {
console.log(item);
item.updateTime = formatDateYMD(item.updateTime);
if (item.state === 0) {
item.state1 = "初始";
} else if (item.state === 10) {
item.state1 = "审核中";
} else if (item.state === 20) {
item.state1 = "已完成";
} else if (item.state === 90) {
item.state1 = "提现失败";
}
item.index = index + 1;
});
console.log(true);
this.pagination.total = data.data.recordCount;
this.isspinning = false;
}
} catch (error) {
console.log(error);
}
},
},
};
</script>

1
src/components/userinfo/usercenter/components/townsman.vue
Unescape Escape View File

@ -28,6 +28,7 @@
tip: '加载中',
wrapperClassName: 'spinstyle',
}"
:rowKey="(record) => record.index"
>
<a slot="name" slot-scope="text">{{ text }}</a>
</a-table>

66
src/components/userinfo/usercenter/index.vue
Unescape Escape View File

@ -28,7 +28,8 @@
>
<span><i class="iconfont icon-jifen"></i>我的积分</span
><span
><span>5000分</span><i class="iconfont icon-youjiantou"></i
><span>{{ userpoint ? userpoint : "--" }}分</span
><i class="iconfont icon-youjiantou"></i
></span>
</li>
<li
@ -37,7 +38,11 @@
>
<span><i class="iconfont icon-kaquan"></i>我的卡券</span
><span
><span>3张</span><i class="iconfont icon-youjiantou"></i
><span
>{{
cardinfo.recordCount ? cardinfo.recordCount : "--"
}}张</span
><i class="iconfont icon-youjiantou"></i
></span>
</li>
<li
@ -46,27 +51,32 @@
>
<span><i class="iconfont icon-yue"></i>我的余额</span
><span
><span v-if="userbalance.length !== 0"
>{{ userbalance }}元</span
>
<span v-else>--元</span><i class="iconfont icon-youjiantou"></i
><span>{{ userbalance >= 0 ? userbalance : "--" }}元</span>
<i class="iconfont icon-youjiantou"></i
></span>
</li>
</ul>
</div>
</div>
<div class="rightcontent">
<router-view></router-view>
<router-view
:userpoint="userpoint"
:userbalance="userbalance"
></router-view>
</div>
</div>
</div>
</template>
<script>
import { userBalanceApi } from "../../../api/userinfo";
import {
userBalanceApi,
getPointApi,
userCardApi,
} from "../../../api/userinfo";
export default {
// 组件名称
name: "",
name: "usercenter-container",
// 局部注册的组件
components: {},
// 组件参数 接收来自父组件的数据
@ -76,6 +86,8 @@ export default {
return {
activelist: "",
userbalance: "",
userpoint: "",
cardinfo: {},
// path:,
};
},
@ -98,6 +110,8 @@ export default {
created() {
this.listactive();
this.getUserBalanceInfo();
this.getPoint();
this.getcardcount();
},
/**
* el 被新创建的 vm.el 替换，并挂载到实例上去之后调用该钩子。
@ -129,6 +143,25 @@ export default {
const { data } = await userBalanceApi();
this.userbalance = data.data.balance;
console.log(data);
console.log(this.userbalance);
} catch (error) {
console.log(error);
}
},
async getPoint() {
try {
const { data } = await getPointApi();
console.log(data);
this.userpoint = data.data.pointTotal;
} catch (error) {
console.log(error);
}
},
async getcardcount() {
try {
const { data } = await userCardApi();
console.log(data);
this.cardinfo = data.data;
} catch (error) {
console.log(error);
}
@ -138,21 +171,6 @@ export default {
</script>
<style scoped lang="less">
.tagactive {
background-color: #ff6a00 !important;
color: #fff !important;
span {
span {
color: #fff !important;
}
i {
color: #fff !important;
}
}
i {
color: #fff !important;
}
}
.usercontent {
// height: 1000px;
margin-top: 16px;

1
src/main.js
Unescape Escape View File

@ -5,6 +5,7 @@ import store from "./store";
import antd from "ant-design-vue";
import "ant-design-vue/dist/antd.css";
import "../src/style/index.less";
import "../src/style/userinfo.less"; //用户账号设置和个人中心的样式
import "@/permission"; // permission control
Vue.config.productionTip = false;
Vue.use(antd);

3
src/permission.js
Unescape Escape View File

@ -6,13 +6,14 @@ router.beforeEach(async (to, from, next) => {
console.log(from);
// 路由守卫
const whiteList = [
// 设置白名单
"/login",
"/404",
"/serviceoutlets",
"/aboutus",
"/main",
"/updatepsw",
]; // 设置白名单
];
const isLogin = localStorage.getItem("LOGIN_DATA") !== null ? true : false;
// if (to.fullPath === from.fullPath) {
// next(to.path);

45
src/router/index.js
Unescape Escape View File

@ -114,10 +114,53 @@ const routes = [
],
},
{
path: "/accountsetting",
path: "accountsetting",
name: "accountsetting",
component: () =>
import("../components/userinfo/accountsetting/inedex.vue"),
redirect: "loginpsw",
children: [
{
path: "loginpsw",
name: "loginpsw",
component: () =>
import(
"../components/userinfo/accountsetting/components/loginpsw.vue"
),
},
{
path: "boundtel",
name: "boundtel",
component: () =>
import(
"../components/userinfo/accountsetting/components/boundtel.vue"
),
},
{
path: "boundwx",
name: "boundwx",
component: () =>
import(
"../components/userinfo/accountsetting/components/boundwx.vue"
),
},
{
path: "boundbankcard",
name: "boundbankcard",
component: () =>
import(
"../components/userinfo/accountsetting/components/boundbankcard.vue"
),
},
{
path: "realname",
name: "realname",
component: () =>
import(
"../components/userinfo/accountsetting/components/realname.vue"
),
},
],
},
],
},

6
src/style/index.less
Unescape Escape View File

@ -91,6 +91,12 @@ select,
textarea {
font-size: 100%;
}
button{
cursor: pointer;
&:focus-visible {
outline: none;
}
}
table {
border-collapse: collapse;
border-spacing: 0;

29
src/style/userinfo.less
Unescape Escape View File

@ -0,0 +1,29 @@
// 左侧列表的active样式
.tagactive {
background-color: #ff6a00 !important;
color: #fff !important;
span {
span {
color: #fff !important;
}
i {
color: #fff !important;
}
}
i {
color: #fff !important;
}
}
// 右侧title的样式
.contenttitle {
display: flex;
padding-bottom: 16px;
justify-content: space-between;
border-bottom: 1px solid rgba(77, 87, 94, 0.1);
margin-top: 16px;
margin-bottom: 24px;
span {
font-size: 20px;
color: #ff6a00;
}
}

2
src/utils/request.js
Unescape Escape View File

@ -6,7 +6,7 @@ import axios from "axios";
// const baseURL = "http://localhost:8001";
axios.defaults.withCredentials = true; //添加这行代码
console.log(axios);
const service = axios.create({
baseURL: "/api_prod", // url = base url + request url
// baseURL: baseURL, // baseURL: "/api", // url = base url + request url // url = base url + request url

4
src/views/main.vue
Unescape Escape View File

@ -61,7 +61,7 @@
><i class="iconfont icon-gerenzhongxin"></i>个人中心</span
><i class="iconfont icon-youjiantou"></i></div
></router-link>
<router-link to="/accountsetting"
<router-link to="/userinfo/accountsetting/loginpsw"
><div>
<span
><i class="iconfont icon-zhanghaoshezhi"></i
@ -435,7 +435,7 @@ export default {
height: 100%;
/deep/ .pagetitle {
background-color: #fff;
padding: 14px;
padding: 14px 0;
font-size: 16px;
.titleactive {

12
src/views/userinfo.vue
Unescape Escape View File

@ -28,7 +28,7 @@
</li>
<li>
<router-link
to="/accountsetting"
to="/userinfo/accountsetting/loginpsw"
:class="routertitleindex === 2 ? 'titleactive' : ''"
>账号设置
</router-link>
@ -48,7 +48,7 @@
><i class="iconfont icon-youjiantou"></i>
</div>
</router-link>
<router-link to="/accountsetting">
<router-link to="/userinfo/accountsetting/loginpsw">
<div>
<span
><i class="iconfont icon-zhanghaoshezhi"></i
@ -164,11 +164,7 @@ import { logoutApi } from "../api/login";
export default {
inject: ["reload"],
provide() {
return {
getJobList: this.getJobList,
};
},
// 组件名称
name: "",
// 局部注册的组件
@ -338,7 +334,7 @@ export default {
height: 100%;
/deep/ .pagetitle {
background-color: #fff;
padding: 14px;
padding: 14px 0;
font-size: 16px;
.titleactive {

18
接口路径.txt
Unescape Escape View File

@ -1,4 +1,4 @@
接口地址：
接口地址：
正式：https://d.matripe.com.cn
测试：http://bl7.matripe.com.cn:8001
@ -72,6 +72,14 @@
/yishoudan/logout
13.修改密码
/yishoudan/changePassword
密码：password
@ -102,8 +110,8 @@
18.实名认证
/yishoudan/user/realNameAuth
参数：
手机号：realName
验证码：idCard
人名：realName
身份证号：idCard
19.我的余额（账户信息）
@ -135,10 +143,6 @@
23.查询积分
/yishoudan/wallet/getPoint
参数：
状态：searchTag 0为在职、1在职
当前页：pageNum
每页条数：pageSize
23.查询积分使用列表

Write Preview
Loading…
Cancel
Save