+
+
+
+
+
+
+
预览
+
+
+
![]()
+
+
+
+
+
+
+
+ {{ }}
+
+
Hi,{{ userinfo.userName }}
Hi,{{ userinfo.hidetel }}
+
+
+ -
+ 我的积分{{ userpoint >= 0 ? userpoint : "--" }}分
+
+ -
+ 我的卡券{{
+ cardinfo.recordCount ? cardinfo.recordCount : "0"
+ }}张
+
+ -
+ 我的余额{{ userbalance >= 0 ? userbalance : "0" }}元
+
+
+
+
@@ -81,21 +185,59 @@
@@ -196,10 +466,9 @@ export default {
margin-top: 16px;
// background-color: pink;
display: flex;
-
.accountSetList {
width: 346px;
- height: 500px;
+ // height: 500px;
// background-color: skyblue;
margin-right: 16px;
.userinfobox {
@@ -211,16 +480,117 @@ export default {
text-align: center;
.avatarbox {
+ margin: 0 auto;
+ width: 64px;
+
+ &:hover {
+ .mask {
+ display: block;
+ }
+ }
i {
- font-size: 54px;
- line-height: 54px;
+ position: relative;
+ font-size: 64px;
+ line-height: 64px;
color: #ff6a00;
+ .mask {
+ position: absolute;
+ display: none;
+ width: 100%;
+ height: 100%;
+ left: 0;
+ top: 0;
+ border-radius: 50%;
+ background-color: rgba(0, 0, 0, 0.7);
+
+ div {
+ position: relative;
+ padding: 2px;
+ width: 40px;
+ margin-top: 11px !important;
+ margin-left: 13px !important;
+ font-size: 14px;
+ line-height: 19px;
+ font-weight: bold;
+ letter-spacing: 2px;
+ color: rgba(255, 255, 255, 0.8);
+ top: 0;
+ right: 0;
+ left: 0;
+ bottom: 0;
+ margin: auto;
+ }
+ }
}
}
.username {
margin-top: 18px;
}
}
+ .priceinfo {
+ margin-top: 16px;
+ ul {
+ // margin-top: 16px;
+ // padding: 0 16px;
+ background-color: #fff;
+ border-radius: 4px;
+ overflow: hidden;
+ li {
+ position: relative;
+ display: flex;
+ padding: 16px 16px 16px 16px;
+
+ line-height: 24px;
+ justify-content: space-between;
+ // border-bottom: 1px solid #f3f4f4;
+ cursor: pointer;
+ &:nth-child(-n + 2):after {
+ position: absolute;
+ content: "";
+ display: inline-block;
+ height: 1px;
+ width: 314px;
+ bottom: -1px;
+ left: 16px;
+ background-color: #f3f4f4;
+ }
+ span:first-of-type {
+ font-size: 16px;
+ i:first-of-type {
+ margin-right: 12px;
+ font-size: 20px;
+ vertical-align: middle;
+ }
+ }
+ span:last-of-type {
+ span {
+ color: #999999;
+ font-size: 14px;
+ }
+ i {
+ color: #888;
+ font-size: 22px;
+ vertical-align: middle;
+ }
+ }
+ &:hover {
+ // background-color: #ff6a00 !important;
+ color: #ff6a00;
+ span {
+ span {
+ color: #ff6a00;
+ }
+ i {
+ color: #ff6a00;
+ }
+ }
+ i {
+ color: #ff6a00;
+ }
+ }
+ }
+ }
+ }
> ul {
background-color: #fff;
margin-top: 16px;
@@ -261,12 +631,27 @@ export default {
}
> i {
color: #888;
- margin-left: 12px;
+ // margin-left: 12px;
vertical-align: middle;
font-size: 22px;
}
}
+ &:hover {
+ // background-color: #ff6a00 !important;
+ color: #ff6a00;
+ span {
+ span {
+ color: #ff6a00;
+ }
+ i {
+ color: #ff6a00;
+ }
+ }
+ i {
+ color: #ff6a00;
+ }
+ }
}
}
}
@@ -277,4 +662,100 @@ export default {
background-color: #fff;
}
}
+
+::v-deep .ant-modal-footer {
+ display: none;
+}
+::v-deep .ant-modal-header {
+ height: 48px;
+ border-bottom: 0px solid #000;
+}
+::v-deep .ant-modal-title {
+ font-size: 20px;
+ font-weight: 400;
+ text-align: left;
+ color: #222222;
+ line-height: 28px;
+}
+::v-deep .ant-modal-content {
+ margin-top: 100px;
+ width: 576px;
+ height: 409px;
+}
+
+::v-deep .vue-cropper {
+ width: 290px !important;
+ margin: 0 !important;
+}
+.cropper-content {
+ display: flex;
+ display: -webkit-flex;
+ justify-content: space-around;
+ /deep/ .cropper-box {
+ flex: 1;
+ width: 100%;
+ .cropper-view-box,
+ .cropper-crop-box {
+ border-radius: 50%;
+ }
+ .cropper-crop-box {
+ .cropper-face {
+ border-radius: 50%;
+ }
+ span:last-child {
+ // display: none;
+ span:nth-child(5) {
+ display: none;
+ }
+ span:nth-child(7) {
+ display: none;
+ }
+ span:nth-child(10) {
+ display: none;
+ }
+ span:nth-child(12) {
+ display: none;
+ }
+ }
+ }
+ .cropper {
+ width: auto;
+ height: 300px;
+ }
+ }
+ .previewcontainer {
+ text-align: center;
+ margin-right: 50px !important;
+ p {
+ margin-bottom: 20px;
+ margin-left: -150px;
+ }
+ }
+ .show-preview {
+ flex: 1;
+ -webkit-flex: 1;
+ display: flex;
+ display: -webkit-flex;
+ justify-content: center;
+ border-radius: 50%;
+ border: 1px solid #666;
+ .preview {
+ overflow: hidden;
+ background: #cccccc;
+ }
+ }
+}
+
+.btncontainer {
+ position: absolute;
+ bottom: 25px;
+ button {
+ margin: 9px;
+ height: 35px;
+ width: 63px;
+ }
+ button:nth-child(1) {
+ margin-left: -25px;
+ }
+}
diff --git a/src/components/userinfo/usercenter/components/mybalance.vue b/src/components/userinfo/usercenter/components/mybalance.vue
index 55b8b04..c6d11d0 100644
--- a/src/components/userinfo/usercenter/components/mybalance.vue
+++ b/src/components/userinfo/usercenter/components/mybalance.vue
@@ -74,6 +74,7 @@ export default {
// 组件状态值
data() {
return {
+ mark: [],
tablenodata: {
// 空状态文本内容
emptyText: () => (
@@ -245,11 +246,13 @@ export default {
font-size: 16px;
// line-height: 22px;
i {
+ cursor: pointer;
margin-left: 4px;
font-size: 12px;
}
}
p {
+ color: #fff;
margin-top: 10px;
font-size: 32px;
line-height: 32px;
diff --git a/src/components/userinfo/usercenter/components/mybill.vue b/src/components/userinfo/usercenter/components/mybill.vue
index 2bacd2c..6cf44b9 100644
--- a/src/components/userinfo/usercenter/components/mybill.vue
+++ b/src/components/userinfo/usercenter/components/mybill.vue
@@ -111,7 +111,7 @@
{{ item.tel }}
{{ item.storeJobName }}
-
{{ item.policy }}
+
{{ item.policy }}
{{ item.statusTag }}面试时间: {{ item.interviewTime }}
diff --git a/src/components/userinfo/usercenter/components/myintegral.vue b/src/components/userinfo/usercenter/components/myintegral.vue
index 9fceda2..0bca112 100644
--- a/src/components/userinfo/usercenter/components/myintegral.vue
+++ b/src/components/userinfo/usercenter/components/myintegral.vue
@@ -256,11 +256,13 @@ export default {
font-size: 16px;
// line-height: 22px;
i {
+ cursor: pointer;
margin-left: 4px;
font-size: 12px;
}
}
p {
+ color: #fff;
margin-top: 10px;
font-size: 32px;
line-height: 32px;
diff --git a/src/permission.js b/src/permission.js
index 6a240c2..8020d43 100644
--- a/src/permission.js
+++ b/src/permission.js
@@ -6,12 +6,12 @@ router.beforeEach(async (to, from, next) => {
// console.log(from);
// 路由守卫
console.log(from);
- if (from.fullPath === "/list") {
- // console.log(213);
- sessionStorage.setItem("ISLIST", JSON.stringify(true));
- } else {
- sessionStorage.setItem("ISLIST", JSON.stringify(false));
- }
+ // if (from.fullPath === "/list") {
+ // // console.log(213);
+ // sessionStorage.setItem("ISLIST", JSON.stringify(true));
+ // } else {
+ // sessionStorage.setItem("ISLIST", JSON.stringify(false));
+ // }
const whiteList = [
// 设置白名单
"/login",
diff --git a/src/router/index.js b/src/router/index.js
index 6fdd25e..151bd87 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -95,6 +95,77 @@ const routes = [
component: () =>
import("../components/userinfo/usercenter/components/mybill.vue"),
},
+ {
+ path: "accountsetting",
+ name: "accountsetting",
+ component: () =>
+ import("../components/userinfo/accountsetting/inedex.vue"),
+ redirect: "accountsetting/myintegral",
+ 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"
+ ),
+ },
+ {
+ path: "myintegral",
+ name: "myintegral",
+ component: () =>
+ import(
+ "../components/userinfo/usercenter/components/myintegral.vue"
+ ),
+ },
+ {
+ path: "mycard",
+ name: "mycard",
+ component: () =>
+ import("../components/userinfo/usercenter/components/mycard.vue"),
+ },
+ {
+ path: "mybalance",
+ name: "mybalance",
+ component: () =>
+ import(
+ "../components/userinfo/usercenter/components/mybalance.vue"
+ ),
+ },
+ ],
+ },
],
},
{
@@ -147,55 +218,7 @@ const routes = [
},
],
},
- {
- 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"
- ),
- },
- ],
- },
+
{
path: "mytownsman",
name: "mytownsman",
diff --git a/src/style/userinfo.less b/src/style/userinfo.less
index 675010d..295a31f 100644
--- a/src/style/userinfo.less
+++ b/src/style/userinfo.less
@@ -27,3 +27,6 @@
color: #ff6a00;
}
}
+// .ant-table-thead {
+// height: 40px !important;
+// }
diff --git a/src/style/userinfo.wxss b/src/style/userinfo.wxss
new file mode 100644
index 0000000..569285c
--- /dev/null
+++ b/src/style/userinfo.wxss
@@ -0,0 +1,25 @@
+.tagactive {
+ background-color: #ff6a00 !important;
+ color: #fff !important;
+}
+.tagactive span span {
+ color: #fff !important;
+}
+.tagactive span i {
+ color: #fff !important;
+}
+.tagactive i {
+ color: #fff !important;
+}
+.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;
+}
+.contenttitle span {
+ font-size: 20px;
+ color: #ff6a00;
+}
diff --git a/src/views/main.vue b/src/views/main.vue
index 310bd35..b2e634f 100644
--- a/src/views/main.vue
+++ b/src/views/main.vue
@@ -56,21 +56,26 @@
-
{{ loginValue.tel }}
-
+
+ {{
+ loginValue.userName || loginValue.nickName || loginValue.tel
+ }}
+
+
个人中心
-
账号设置
-
+ -->
@@ -317,6 +322,7 @@ export default {
sessionStorage.getItem("LOGIN_DATA") !== null
? JSON.parse(sessionStorage.getItem("LOGIN_DATA"))
: { tel: "" };
+ console.log(this.loginValue);
// console.log(document.querySelector(".ant-pagination-options-quick-jumper"));
},
// 组件方法
@@ -546,6 +552,7 @@ export default {
}
}
}
+
.login {
float: right;
// width: 36px;
@@ -566,6 +573,7 @@ export default {
margin-right: -3px;
text-align: center;
}
+
i {
font-size: 32px;
line-height: 30px;
@@ -757,4 +765,36 @@ export default {
}
}
}
+.loginbox {
+ line-height: 36px;
+ > div:first-child {
+ display: flex;
+ align-items: center;
+ padding: 16px 0;
+ }
+ .username {
+ max-width: 120px;
+ display: block;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ }
+ .avatar {
+ display: block;
+ line-height: 24px;
+ font-size: 24px !important;
+ color: #ff6a00;
+ margin-right: 8px;
+ }
+
+ a {
+ div {
+ padding: 10px 0;
+ align-items: center;
+ }
+ }
+ button {
+ line-height: 28px;
+ }
+}
diff --git a/yarn.lock b/yarn.lock
index 6d54887..30846b6 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -5444,6 +5444,11 @@ javascript-stringify@^2.0.1:
resolved "https://registry.npmjs.org/javascript-stringify/-/javascript-stringify-2.1.0.tgz"
integrity sha512-JVAfqNPTvNq3sB/VHQJAFxN/sPgKnsKrCwyRt15zwNCdrMMJDdcEOdubuy+DuJYYdm0ox1J4uzEuYKkN+9yhVg==
+jquery@^3.6.0:
+ version "3.6.0"
+ resolved "https://registry.npmmirror.com/jquery/-/jquery-3.6.0.tgz"
+ integrity sha512-JVzAR/AjBvVt2BmYhxRCSYysDsPcssdmTFnzyLEts9qNwmjmu4JTAMYubEfwVOSwpQ1I1sKKFcxhZCI2buerfw==
+
js-message@1.0.7:
version "1.0.7"
resolved "https://registry.npmjs.org/js-message/-/js-message-1.0.7.tgz"
@@ -6097,16 +6102,11 @@ mkdirp@^0.5.1, mkdirp@^0.5.3, mkdirp@^0.5.5, mkdirp@~0.5.1:
dependencies:
minimist "^1.2.5"
-moment@^2.21.0:
+moment@^2.21.0, moment@^2.29.1:
version "2.29.1"
resolved "https://registry.npmjs.org/moment/-/moment-2.29.1.tgz"
integrity sha512-kHmoybcPV8Sqy59DwNDY3Jefr64lK/by/da0ViFcuA4DH0vQg5Q6Ze5VimxkfQNSC+Mls/Kx53s7TjP1RhFEDQ==
-moment@^2.29.1:
- version "2.29.1"
- resolved "https://registry.npmmirror.com/moment/-/moment-2.29.1.tgz#b2be769fa31940be9eeea6469c075e35006fa3d3"
- integrity sha512-kHmoybcPV8Sqy59DwNDY3Jefr64lK/by/da0ViFcuA4DH0vQg5Q6Ze5VimxkfQNSC+Mls/Kx53s7TjP1RhFEDQ==
-
move-concurrently@^1.0.1:
version "1.0.1"
resolved "https://registry.npmjs.org/move-concurrently/-/move-concurrently-1.0.1.tgz"
@@ -8918,6 +8918,11 @@ vm-browserify@^1.0.1:
resolved "https://registry.npmjs.org/vm-browserify/-/vm-browserify-1.1.2.tgz"
integrity sha512-2ham8XPWTONajOR0ohOKOHXkm3+gaBmGut3SRuu75xLd/RRaY6vqgh8NBYYk7+RW3u5AtzPQZG8F10LHkl0lAQ==
+vue-cropper@^0.5.8:
+ version "0.5.8"
+ resolved "https://registry.npmmirror.com/vue-cropper/-/vue-cropper-0.5.8.tgz#df5c8b923bfc2f1db5280054f73640b0c6a75a8d"
+ integrity sha512-Xgi/aLQCcNCiBTUdovy/i4LWx0G7fQnAENBpDWA3J4i87Zlk9DJRksXrClsQ6nnaFRfQVkMimij5GEvAMaXdYw==
+
vue-eslint-parser@^7.0.0:
version "7.11.0"
resolved "https://registry.npmjs.org/vue-eslint-parser/-/vue-eslint-parser-7.11.0.tgz"