kubbo/dvcp_v2_wxcp_app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

信用积分

Browse Source
This commit is contained in:
liuye
2022-02-15 10:48:33 +08:00
parent f168a86f31
commit 8b5da40e0c
8 changed files with 1364 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

509
src/apps/AppSuperMarket/AppSuperMarket.vue Normal file
View File

@@ -0,0 +1,509 @@
<template>
<div class="page">
<div class="supermarket">
<div
class="fixed-top title"
@click="$linkTo(`./system?areaName=${areaName}`)"
v-if="propAreaId == '341021104000'"
>
{{ areaName }}信用好超市管理制度，点击查看 >>
</div>
<div
class="goods-list"
v-if="numList.length"
:style="
propAreaId == '341021104000'
? 'padding-top: 80rpx;'
: 'padding-top: 0;'
"
>
<div class="left">
<div
:class="numIndex == index ? 'item active' : 'item'"
v-for="(item, index) in numList"
:key="index"
@click="numClick(index)"
>
<i v-show="item.total > 0">{{ item.total }}</i>
{{ item.type }}分区
</div>
</div>
<div class="right">
<div
class="item"
v-for="(item, index) in goodsList[numIndex]"
:key="index"
>
<img :src="item.photo[0].url" alt="" />
<div class="item-info">
<p class="item-name">{{ item.merchandiseName }}</p>
<div class="item-point">
<span class="num">{{ item.costIntegral }}</span
>积分
</div>
<div class="item-bottom">
<div></div>
<div class="item-bottom__right">
<image
v-show="item.num > 0"
@click="cut(numIndex, index)"
src="/static/img/cut.png"
/>
<input v-show="item.num > 0" v-model="item.num" />
<image
src="/static/img/add.png"
@click="add(numIndex, index)"
/>
</div>
</div>
</div>
</div>
</div>
</div>
<AiEmpty v-else />
<div class="goods-footer" v-if="numList.length">
<div class="goods-footer__top">
<h2>
{{ userInfo.familyName || user.nickName
}}{{ userInfo.familyName ? "家" : "" }}
</h2>
<span>剩余积分:{{ userInfo.familyIntegral || 0 }}分</span>
</div>
<div class="goods-footer__bottom">
<div class="goods-footer__bottom__left">
<h3>共{{ total }}件商品</h3>
<div class="goods-footer__bottom--middle">
<span>合计 ：</span>
<i>{{ money }}</i>
<em>积分</em>
</div>
</div>
<div
class="goods-footer__bottom--btn"
@click="toOrder"
hover-class="text-hover"
>
去结算
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import { mapState } from "vuex";
export default {
name: "AppSuperMarket",
appName: '信用好超市',
data() {
return {
numList: [],
numIndex: 0,
goodsList: [],
areaId: "",
userInfo: {},
areaName: "",
propAreaId: "",
};
},
computed: {
...mapState(["global", "user", "token"]),
total() {
let total = 0;
if (!this.numList.length) {
return total;
}
this.numList.forEach((item) => {
total = item.total + total;
});
return total;
},
money() {
let money = 0;
if (!this.goodsList.length) {
return money;
}
this.goodsList.forEach((arr) => {
arr.forEach((item) => {
money = money + Number(item.num) * item.costIntegral;
});
});
return money;
},
},
onLoad() {
this.propAreaId = this.$areaId;
uni.$on("update", () => {
this.getInfo();
});
if (uni.getStorageSync("areaId")) {
this.areaId = uni.getStorageSync("areaId");
}
this.getUserInfo();
this.getInfo();
},
onShow() {
this.getUserInfo();
},
methods: {
getInfo() {
this.$http
.post(`/admin/area/queryAreaByAreaid?id=${this.areaId}`, null, {})
.then((res) => {
if (res.code === 0) {
if (res.data) {
this.areaName = res.data.name;
this.getList();
}
}
});
},
getUserInfo() {
this.$http
.post(
`/app/appresident/queryFamilyById?id=${this.user.residentId}`,
null,
{}
)
.then((res) => {
if (res.code === 0) {
this.userInfo = res.data;
}
});
},
toOrder() {
if (this.user.status == 0) {
if (!this.user.phone) {
return this.$linkTo("/pages/phone/bingPhoneNumber?from=auth");
} else {
return this.$linkTo("/pages/auth/authenticationInfo");
}
}
if (!this.total) {
return this.$toast("请选择商品");
}
if (this.money > this.userInfo.familyIntegral) {
return this.$toast("积分不足");
}
let goods = [];
this.goodsList.forEach((arr) => {
arr.forEach((item) => {
if (item.num) {
goods.push(item);
}
});
});
this.$linkTo(
`/subPages/creditPoints/submitOrder?familyId=${
this.userInfo.familyId
}&userName=${this.userInfo.familyName}&memberId=${
this.userInfo.memberId
}&goods=${JSON.stringify(goods)}&total=${this.total}&money=${
this.money
}&familyIntegral=${this.userInfo.familyIntegral}`
);
},
getList() {
this.$http
.post(
`/app/appvillagerintegralmerchandise/listByIntegral?areaId=${this.areaId}`,
null,
{}
)
.then((res) => {
if (res.code === 0) {
if (res.data) {
this.numList = Object.keys(res.data).map((item) => {
return {
type: item,
total: 0,
};
});
this.goodsList = Object.values(res.data).map((item) => {
item.map((items) => {
items.num = 0;
items.photo = JSON.parse(items.photo);
return items;
});
return item;
});
}
}
});
},
add(index, i) {
this.$set(
this.goodsList[index][i],
"num",
Number(this.goodsList[index][i].num) + 1
);
let total = 0;
this.goodsList[index].forEach((item) => {
total = total + item.num;
});
this.$set(this.numList[index], "total", total);
},
cut(index, i) {
this.$set(
this.goodsList[index][i],
"num",
Number(this.goodsList[index][i].num) - 1
);
let total = 0;
this.goodsList[index].forEach((item) => {
total = total + item.num;
});
this.$set(this.numList[index], "total", total);
},
numClick(index) {
this.numIndex = index;
},
},
};
</script>
<style scoped lang="scss">
.item-bottom {
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 28rpx;
.item-bottom__right {
display: flex;
align-items: center;
height: 60rpx;
}
image {
width: 27rpx;
height: 27rpx;
}
input {
width: 90rpx;
height: 60rpx;
padding: 0 20rpx;
margin: 0 10rpx;
background: #f6f6f6;
border-radius: 10rpx;
font-size: 26rpx;
color: #666;
text-align: center;
}
}
.goods-footer {
position: fixed;
left: 0;
bottom: 0;
z-index: 111;
width: 100%;
background: #fff;
.goods-footer__top {
display: flex;
align-items: center;
justify-content: space-between;
height: 80rpx;
padding: 0 30rpx;
background: #eff4ff;
color: #333333;
font-size: 32px;
}
.goods-footer__bottom--btn {
width: 212rpx;
height: 104rpx;
line-height: 104rpx;
font-size: 36rpx;
color: #fff;
text-align: center;
background: #197df0;
}
.goods-footer__bottom__left {
display: flex;
align-items: center;
justify-content: space-between;
flex: 1;
padding: 0 32rpx;
h3 {
color: #f94246;
font-size: 32rpx;
}
.goods-footer__bottom--middle {
display: flex;
align-items: baseline;
span {
color: #f94246;
font-size: 32rpx;
}
i {
position: relative;
top: 2rpx;
margin-right: 12px;
color: #fa444b;
font-size: 40rpx;
}
em {
color: #f94246;
font-size: 24rpx;
}
}
}
.goods-footer__bottom {
display: flex;
align-items: center;
justify-content: space-between;
height: 104rpx;
}
}
.page {
width: 100%;
background-color: #fff;
.supermarket {
height: 100%;
overflow-y: hidden;
.title {
width: 100%;
height: 80rpx;
line-height: 80rpx;
background: #eff4ff;
padding-left: 30rpx;
color: #3a7ee2;
font-size: 28rpx;
}
.goods-list {
// padding-top: 80rpx;
padding-bottom: 184px;
height: 100%;
box-sizing: border-box;
overflow-y: hidden;
.left {
width: 168rpx;
height: 100%;
overflow-y: scroll;
overflow-x: hidden;
float: left;
background: #faf9fb;
.item {
display: flex;
align-items: center;
justify-content: center;
position: relative;
width: 100%;
height: 104rpx;
line-height: 1.1;
border-bottom: 2rpx solid #d8e5ff;
text-align: center;
color: #333;
font-size: 28rpx;
border-left: 6rpx solid #faf9fb;
i {
position: absolute;
right: 8rpx;
top: 8rpx;
height: 28rpx;
line-height: 28rpx;
padding: 0 12rpx;
color: #fff;
font-size: 20rpx;
border-radius: 13rpx;
background: #fb4e44;
}
}
.active {
border-left: 6rpx solid #1d58fe;
background: linear-gradient(
270deg,
#ffffff 0%,
#ffffff 77%,
#e7eafa 100%
);
}
}
.right {
float: left;
width: calc(100% - 168rpx);
height: 100%;
overflow-y: scroll;
.item {
width: 100%;
padding: 28rpx 30rpx 44rpx;
box-sizing: border-box;
img {
width: 192rpx;
height: 192rpx;
border: 2rpx solid #d7d5d5;
}
.item-info {
display: inline-block;
width: 276rpx;
padding-left: 30rpx;
vertical-align: top;
.item-name {
width: 100%;
word-break: break-all;
line-height: 42rpx;
margin-bottom: 30rpx;
font-size: 30rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
}
.item-point {
color: #fa4a51;
font-size: 24rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #fa4a51;
line-height: 34rpx;
.num {
font-size: 40rpx;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
margin-right: 8rpx;
}
}
}
}
}
}
}
}
</style>

39
src/apps/AppSuperMarket/Search.vue Normal file
View File

@@ -0,0 +1,39 @@
<template>
<div class="Search">
<AiTopFixed>
<u-search placeholder="请输入标题" :show-action="false" search-icon-color="#ccc" v-model="search.title" @search="search.current = 1, getList()"/>
</AiTopFixed>
</div>
</template>
<script>
export default {
name: 'Search',
data() {
return {
search: {
title: '',
current: 1
}
};
},
onLoad() {
},
methods: {
getList() {
}
},
};
</script>
<style lang="scss" scoped>
.Search {
::v-deep .u-search{
margin-bottom: 0!important;
}
}
</style>

244
src/apps/AppSuperMarket/SubmitOrder.vue Normal file
View File

@@ -0,0 +1,244 @@
<template>
<div class="order">
<div class="order-info">
<h2>{{ userName }}家</h2>
<span>剩余积分:{{ familyIntegral }}分</span>
</div>
<image class="line" src="/static/img/line.png" />
<div class="order-list">
<div class="order-item" v-for="(item, index) in goods" :key="index">
<image :src="item.photo[0].url" />
<div class="order-item__right flex1">
<h2>{{ item.merchandiseName }}</h2>
<div class="order-item__right--info">
<span>{{ item.costIntegral }}</span>
<i>积分</i>
</div>
<div class="item-bottom">
<div></div>
<div class="item-bottom__right">
<span>x {{ item.num }}</span>
</div>
</div>
</div>
</div>
</div>
<div class="goods-footer">
<div class="goods-footer__bottom">
<div class="goods-footer__bottom__left">
<h3>共{{ total }}件商品</h3>
<div class="goods-footer__bottom--middle">
<span>合计 ：</span>
<i>{{ money }}</i>
<em>积分</em>
</div>
</div>
<div class="goods-footer__bottom--btn" @click="submit" hover-class="text-hover">确认提交</div>
</div>
</div>
</div>
</template>
<script>
export default {
data () {
return {
total: 0,
money: 0,
goods: [],
memberId: '',
userName: '',
familyId: '',
familyIntegral: 0
}
},
onLoad (query) {
this.userName = query.userName
this.total = query.total
this.familyIntegral = query.familyIntegral
this.money = query.money
this.memberId = query.memberId
this.familyId = query.familyId
this.goods = JSON.parse(query.goods)
},
methods: {
submit () {
this.$loading()
this.$http.post(`/app/appvillagerintegralshoporder/createOrderForWx`, {
memberId: this.memberId,
familyId: this.familyId,
orderIntegral: this.money,
shopId: this.goods[0].shopId,
merchandiseList: this.goods.map(item => {
return {
merchandiseId: item.id,
merchandiseNumber: item.num
}
})
}).then(res => {
if (res.code === 0) {
uni.$emit('update')
this.$linkTo('/subPages/creditPoints/result?type=0')
} else {
this.$linkTo('/subPages/creditPoints/result?type=1')
}
})
}
},
}
</script>
<style lang="scss" scoped>
.order {
min-height: 100%;
background: #fff;
.line {
width: 100%;
height: 8rpx;
}
.order-item {
display: flex;
padding: 28rpx 30rpx 44rpx;
.order-item__right--info {
display: flex;
align-items: baseline;
span {
margin-right: 8rpx;
color: #FA4A51;
font-size: 40rpx;
}
i {
color: #FA4A51;
font-size: 24rpx;
}
}
h2 {
margin-top: 2rpx;
margin-bottom: 30rpx;
color: #333333;
font-size: 30rpx;
text-align: justify;
}
& > image {
width: 192rpx;
height: 192rpx;
margin-right: 30rpx;
}
}
.order-list {
margin-top: 20rpx;
padding-bottom: 110rpx;
}
.order-info {
display: flex;
align-items: center;
justify-content: space-between;
height: 128rpx;
padding: 0 30rpx;
color: #333333;
font-size: 32rpx;
}
.goods-footer {
position: fixed;
left: 0;
bottom: 0;
z-index: 11;
width: 100%;
box-shadow: 0px -1px 4px 0px rgba(214, 214, 214, 0.5);
background: #fff;
.goods-footer__bottom--btn {
width: 212rpx;
height: 104rpx;
line-height: 104rpx;
font-size: 36rpx;
color: #fff;
text-align: center;
background: #197DF0;
}
.goods-footer__bottom__left {
display: flex;
align-items: center;
justify-content: space-between;
flex: 1;
padding: 0 32rpx;
h3 {
color: #F94246;
font-size: 32rpx;
}
.goods-footer__bottom--middle {
display: flex;
align-items: baseline;
span {
color: #F94246;
font-size: 32rpx;
}
i {
position: relative;
top: 2rpx;
margin-right: 6px;
color: #FA444B;
font-size: 40rpx;
}
em {
color: #F94246;
font-size: 24rpx;
}
}
}
.goods-footer__bottom {
display: flex;
align-items: center;
justify-content: space-between;
height: 104rpx;
}
}
.item-bottom {
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 28rpx;
.item-bottom__right {
display: flex;
align-items: center;
color: #666;
}
image {
width: 40rpx;
height: 40rpx;
}
input {
width: 90rpx;
height: 60rpx;
padding: 0 20rpx;
margin: 0 10rpx;
background: #F6F6F6;
border-radius: 10rpx;
font-size: 26rpx;
color: #666;
}
}
}
</style>

68
src/apps/AppSuperMarket/Success.vue Normal file
View File

@@ -0,0 +1,68 @@
<template>
<div class="success">
<img src="./components/img/success.png" alt="" v-if="status">
<img src="./components/img/fail.png" alt="" v-else>
<p>{{status ? '上报成功！' : '上报失败！'}}</p>
<div class="footer" @click="back">{{status ? '确定' : '我知道了'}}</div>
</div>
</template>
<script>
import { mapState } from 'vuex'
export default {
data() {
return {
status: 1
}
},
onShow() {
document.title = '健康上报'
},
onLoad(option) {
this.status = option.status
},
methods: {
back() {
uni.navigateBack()
}
},
}
</script>
<style lang="scss" scoped>
uni-page-body{
height: 100%;
background-color: #fff;
}
.success {
text-align: center;
img{
width: 192px;
height: 192px;
margin: 96px 0 16px 0;
}
p{
line-height: 50px;
color: #333;
font-size: 36px;
font-weight: 500;
text-align: center;
margin-bottom: 72px;
}
.footer{
width: calc(100% - 96px);
height: 88px;
line-height: 88px;
background: #1365DD;
box-shadow: inset 0px 1px 0px 0px #EEEEEE;
font-size: 32px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #FFF;
text-align: center;
border-radius: 8px;
margin-left: 48px;
}
}
</style>

BIN
src/apps/AppSuperMarket/components/img/fail.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 15 KiB

BIN
src/apps/AppSuperMarket/components/img/success.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 18 KiB