Browse Source

用户卡片信息修改

zhangyong/feature-20250815160302-金币优化
ZhangYong 2 months ago
parent
commit
3cb394b378
  1. 43
      src/views/consume/gold/addCoinConsume.vue
  2. 137
      src/views/recharge/gold/addCoinRecharge.vue
  3. 137
      src/views/refund/gold/addCoinRefund.vue

43
src/views/consume/gold/addCoinConsume.vue

@ -528,15 +528,15 @@ onMounted(async function () {
<template> <template>
<div class="father1"> <div class="father1">
<div class="left"> <div class="left">
<el-form :model="addConsume" ref="Ref" :rules="rules" style="max-width: 800px;" class="add-form" label-width="auto" label-position="right">
<el-form :model="addConsume" ref="Ref" :rules="rules" style="min-width: 420px;" class="add-form" label-width="auto" label-position="right">
<el-form-item prop="jwcode" label="精网号" style="margin-top: 50px"> <el-form-item prop="jwcode" label="精网号" style="margin-top: 50px">
<el-input v-model="addConsume.jwcode" style="width: 10vw;"/>
<el-button type="primary" @click="getUser(addConsume.jwcode)" style="margin-left: 10px">查询
<el-input v-model="addConsume.jwcode" style="width: 200px;"/>
<el-button type="primary" @click="getUser(addConsume.jwcode)" style="margin-left: 20px">查询
</el-button> </el-button>
</el-form-item> </el-form-item>
<el-form-item prop="goodsName" label="商品名称" style="flex: 1; margin-right: 0px">
<el-select v-model="addConsume.goodsName" placeholder="请选择商品" style="width: 10vw;" clearable filterable
<el-form-item prop="goodsName" label="商品名称" >
<el-select v-model="addConsume.goodsName" placeholder="请选择商品" style="width: 200px" clearable filterable
> >
<el-option v-for="(item, index) in goods" :key="index" :label="item.label" :value="item"/> <el-option v-for="(item, index) in goods" :key="index" :label="item.label" :value="item"/>
@ -544,7 +544,7 @@ onMounted(async function () {
</el-form-item> </el-form-item>
<el-form-item prop="sumGold" label="消耗金币总数"> <el-form-item prop="sumGold" label="消耗金币总数">
<el-input v-model="addConsume.sumGold" style="width: 10vw;" @input="validateInput()"
<el-input v-model="addConsume.sumGold" style="width: 120px" @input="validateInput()"
@change="calculateCoins(addConsume.sumGold)"/> @change="calculateCoins(addConsume.sumGold)"/>
</el-form-item> </el-form-item>
@ -552,24 +552,24 @@ onMounted(async function () {
<!-- 三类金币自动计算禁用状态不可编辑 --> <!-- 三类金币自动计算禁用状态不可编辑 -->
<el-form-item prop="permanentGold" label="永久金币"> <el-form-item prop="permanentGold" label="永久金币">
<el-input v-model="addConsume.permanentGold" disabled style="width: 10vw;">
<el-input v-model="addConsume.permanentGold" disabled style="width: 120px">
<template #default="scope">{{ scope.row.permanentGold }}</template> <template #default="scope">{{ scope.row.permanentGold }}</template>
</el-input> </el-input>
<p style="margin-right: 0px">&nbsp;&nbsp;</p> <p style="margin-right: 0px">&nbsp;&nbsp;</p>
</el-form-item> </el-form-item>
<el-form-item prop="freeCoin" label="免费金币"> <el-form-item prop="freeCoin" label="免费金币">
<el-input disabled v-model="addConsume.freeGold" style="width: 10vw;"/>
<el-input disabled v-model="addConsume.freeGold" style="width: 120px"/>
<p style="margin-right: 0px">&nbsp;&nbsp;</p> <p style="margin-right: 0px">&nbsp;&nbsp;</p>
</el-form-item> </el-form-item>
<el-form-item prop="taskGold" label="任务金币"> <el-form-item prop="taskGold" label="任务金币">
<el-input disabled v-model="addConsume.taskGold" style="width: 10vw;"/>
<el-input disabled v-model="addConsume.taskGold" style="width: 120px"/>
<p style="margin-right: 20px">&nbsp;&nbsp;</p> <p style="margin-right: 20px">&nbsp;&nbsp;</p>
</el-form-item> </el-form-item>
<el-form-item prop="remark" label="备注"> <el-form-item prop="remark" label="备注">
<el-input v-model="addConsume.remark" style="width: 13.5vw;" :rows="4" maxlength="100"
<el-input v-model="addConsume.remark" style="width: 250px" :rows="4" maxlength="100"
show-word-limit type="textarea"/> show-word-limit type="textarea"/>
</el-form-item> </el-form-item>
@ -615,15 +615,18 @@ onMounted(async function () {
<p>{{ user.jwcode }}</p> <p>{{ user.jwcode }}</p>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="14">
<el-form-item label="充值次数">
<p style="color: #2fa1ff">{{ user.rechargeNum }}</p>
<el-col :span="14">
<el-form-item label="消费次数">
<p style="color: #2fa1ff">{{ user.consumeNum }} </p>
</el-form-item>
<el-form-item style="margin-top: -23px"> <!-- 负边距减少间距 -->
<p style="font-size: small; color: #b1b1b1">(仅统计2025-01-01后的数据)</p>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<!-- 第三行首次充值日期 + 充值次数 --> <!-- 第三行首次充值日期 + 充值次数 -->
<el-row >
<!-- <el-row >
<el-col :span="9"> <el-col :span="9">
<el-form-item label="首次充值日期"> <el-form-item label="首次充值日期">
<p v-if="user.firstRecharge"> <p v-if="user.firstRecharge">
@ -631,12 +634,8 @@ onMounted(async function () {
</p> </p>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="14">
<el-form-item label="消费次数">
<p style="color: #2fa1ff">{{ user.consumeNum }}</p>
</el-form-item>
</el-col>
</el-row>
</el-row> -->
<!-- 第四行消费次数 + 所属门店 --> <!-- 第四行消费次数 + 所属门店 -->
<el-row> <el-row>
@ -793,10 +792,6 @@ p {
margin: 0px; margin: 0px;
} }
.el-form-item {
margin-left: 20px;
}
/* 上传图片的格式 */ /* 上传图片的格式 */
.avatar-uploader .avatar { .avatar-uploader .avatar {
width: 50px; width: 50px;

137
src/views/recharge/gold/addCoinRecharge.vue

@ -722,74 +722,73 @@ onMounted(() => {
<div class="right"> <div class="right">
<!-- 客户信息栏 --> <!-- 客户信息栏 -->
<el-card v-if="user.jwcode" style="max-width: 800px" class="beautiful">
<el-form :model="user" label-width="auto" style="min-width: 650px" label-position="left">
<el-text size="large" style="margin-left: 20px">客户信息</el-text>
<!-- 第一行姓名 + 历史金币 -->
<el-row style="margin-top: 20px">
<el-col :span="9">
<el-form-item label="姓名">
<p>{{ user.name }}</p>
</el-form-item>
</el-col>
<el-col :span="14">
<el-form-item label="当前金币总数" style="width: 500px">
<span style="color: #2fa1ff; margin-right: 5px" v-if="user.nowSumGold !== undefined">{{
user.nowSumGold
}}</span>
</el-form-item>
<!-- 金币详情独立显示 -->
<el-form-item style="margin-top: -23px"> <!-- 负边距减少间距 -->
<span style="color: #b1b1b1; margin-left: 0px" v-if="user.nowPermanentGold !== undefined">(永久金币:{{
user.nowPermanentGold
}};
免费金币:{{ user.nowFreeGold }};
任务金币:{{ user.nowTaskGold }})</span>
</el-form-item>
</el-col>
</el-row>
<!-- 第二行精网号 + 当前金币独立行 -->
<el-row>
<el-col :span="9">
<el-form-item label="精网号">
<p>{{ user.jwcode }}</p>
</el-form-item>
</el-col>
<el-col :span="14">
<el-form-item label="充值次数">
<p style="color: #2fa1ff">{{ user.rechargeNum }}</p>
</el-form-item>
</el-col>
</el-row>
<!-- 第三行首次充值日期 + 充值次数 -->
<el-row>
<el-col :span="9">
<el-form-item label="首次充值日期">
<p v-if="user.firstRecharge">
{{ moment(user.firstRecharge).format('YYYY-MM-DD HH:mm:ss') }}
</p>
</el-form-item>
</el-col>
<el-col :span="14">
<el-form-item label="消费次数">
<p style="color: #2fa1ff">{{ user.consumeNum }}</p>
</el-form-item>
</el-col>
</el-row>
<!-- 第四行消费次数 + 所属门店 -->
<el-row>
<el-col :span="9">
<el-form-item label="所属门店">
<p>{{ user.market }}</p>
</el-form-item>
</el-col>
</el-row>
</el-form>
</el-card>
<el-card v-if="user.jwcode" style="width: 800px; float: right" class="customer-info">
<el-form :model="user" label-width="auto" style="max-width: 1000px" label-position="left">
<el-text size="large" style="margin-left: 20px">客户信息</el-text>
<!-- 第一行姓名 + 历史金币 -->
<el-row style="margin-top: 20px">
<el-col :span="9">
<el-form-item label="姓名">
<p>{{ user.name }}</p>
</el-form-item>
</el-col>
<el-col :span="14">
<el-form-item label="当前金币总数" style="width: 500px">
<span style="color: #2fa1ff; margin-right: 5px" v-if="user.nowSumGold !== undefined">{{
user.nowSumGold
}}</span>
</el-form-item>
<!-- 金币详情独立显示 -->
<el-form-item style="margin-top: -23px"> <!-- 负边距减少间距 -->
<span style="color: #b1b1b1; margin-left: 0px" v-if="user.nowPermanentGold !== undefined">(永久金币:{{
user.nowPermanentGold
}};
免费金币:{{ user.nowFreeGold }};
任务金币:{{ user.nowTaskGold }})</span>
</el-form-item>
</el-col>
</el-row>
<!-- 第二行精网号 + 当前金币独立行 -->
<el-row>
<el-col :span="9">
<el-form-item label="精网号">
<p>{{ user.jwcode }}</p>
</el-form-item>
</el-col>
<el-col :span="14">
<el-form-item label="消费次数">
<p style="color: #2fa1ff">{{ user.consumeNum }} </p>
</el-form-item>
<el-form-item style="margin-top: -23px"> <!-- 负边距减少间距 -->
<p style="font-size: small; color: #b1b1b1">(仅统计2025-01-01后的数据)</p>
</el-form-item>
</el-col>
</el-row>
<!-- 第三行首次充值日期 + 充值次数 -->
<!-- <el-row >
<el-col :span="9">
<el-form-item label="首次充值日期">
<p v-if="user.firstRecharge">
{{ moment(user.firstRecharge).format('YYYY-MM-DD HH:mm:ss') }}
</p>
</el-form-item>
</el-col>
</el-row> -->
<!-- 第四行消费次数 + 所属门店 -->
<el-row>
<el-col :span="9">
<el-form-item label="所属门店">
<p>{{ user.market }}</p>
</el-form-item>
</el-col>
</el-row>
</el-form>
</el-card>
</div> </div>
</div> </div>
@ -929,7 +928,7 @@ onMounted(() => {
margin-left: 20px; margin-left: 20px;
display: flex; display: flex;
.beautiful {
.customer-info{
width: 90%; width: 90%;
display: flex; display: flex;
margin-left: 20px; margin-left: 20px;

137
src/views/refund/gold/addCoinRefund.vue

@ -552,74 +552,73 @@ onMounted(async function () {
<div class="right"> <div class="right">
<!-- 客户信息栏 --> <!-- 客户信息栏 -->
<el-card v-if="user.jwcode" style="max-width: 800px" class="beautiful">
<el-form :model="user" label-width="auto" style="min-width: 650px" label-position="left">
<el-text size="large" style="margin-left: 20px">客户信息</el-text>
<!-- 第一行姓名 + 历史金币 -->
<el-row style="margin-top: 20px">
<el-col :span="9">
<el-form-item label="姓名">
<p>{{ user.name }}</p>
</el-form-item>
</el-col>
<el-col :span="14">
<el-form-item label="当前金币总数" style="width: 500px">
<span style="color: #2fa1ff; margin-right: 5px" v-if="user.nowSumGold !== undefined">{{
user.nowSumGold
}}</span>
</el-form-item>
<!-- 金币详情独立显示 -->
<el-form-item style="margin-top: -23px"> <!-- 负边距减少间距 -->
<span style="color: #b1b1b1; margin-left: 0px" v-if="user.nowPermanentGold !== undefined">(永久金币:{{
user.nowPermanentGold
}};
免费金币:{{ user.nowFreeGold }};
任务金币:{{ user.nowTaskGold }})</span>
</el-form-item>
</el-col>
</el-row>
<!-- 第二行精网号 + 当前金币独立行 -->
<el-row>
<el-col :span="9">
<el-form-item label="精网号">
<p>{{ user.jwcode }}</p>
</el-form-item>
</el-col>
<el-col :span="14">
<el-form-item label="充值次数">
<p style="color: #2fa1ff">{{ user.rechargeNum }}</p>
</el-form-item>
</el-col>
</el-row>
<!-- 第三行首次充值日期 + 充值次数 -->
<el-row>
<el-col :span="9">
<el-form-item label="首次充值日期">
<p v-if="user.firstRecharge">
{{ moment(user.firstRecharge).format('YYYY-MM-DD HH:mm:ss') }}
</p>
</el-form-item>
</el-col>
<el-col :span="14">
<el-form-item label="消费次数">
<p style="color: #2fa1ff">{{ user.consumeNum }}</p>
</el-form-item>
</el-col>
</el-row>
<!-- 第四行消费次数 + 所属门店 -->
<el-row>
<el-col :span="9">
<el-form-item label="所属门店">
<p>{{ user.market }}</p>
</el-form-item>
</el-col>
</el-row>
</el-form>
</el-card>
<el-card v-if="user.jwcode" style="width: 800px; float: right" class="customer-info">
<el-form :model="user" label-width="auto" style="max-width: 1000px" label-position="left">
<el-text size="large" style="margin-left: 20px">客户信息</el-text>
<!-- 第一行姓名 + 历史金币 -->
<el-row style="margin-top: 20px">
<el-col :span="9">
<el-form-item label="姓名">
<p>{{ user.name }}</p>
</el-form-item>
</el-col>
<el-col :span="14">
<el-form-item label="当前金币总数" style="width: 500px">
<span style="color: #2fa1ff; margin-right: 5px" v-if="user.nowSumGold !== undefined">{{
user.nowSumGold
}}</span>
</el-form-item>
<!-- 金币详情独立显示 -->
<el-form-item style="margin-top: -23px"> <!-- 负边距减少间距 -->
<span style="color: #b1b1b1; margin-left: 0px" v-if="user.nowPermanentGold !== undefined">(永久金币:{{
user.nowPermanentGold
}};
免费金币:{{ user.nowFreeGold }};
任务金币:{{ user.nowTaskGold }})</span>
</el-form-item>
</el-col>
</el-row>
<!-- 第二行精网号 + 当前金币独立行 -->
<el-row>
<el-col :span="9">
<el-form-item label="精网号">
<p>{{ user.jwcode }}</p>
</el-form-item>
</el-col>
<el-col :span="14">
<el-form-item label="消费次数">
<p style="color: #2fa1ff">{{ user.consumeNum }} </p>
</el-form-item>
<el-form-item style="margin-top: -23px"> <!-- 负边距减少间距 -->
<p style="font-size: small; color: #b1b1b1">(仅统计2025-01-01后的数据)</p>
</el-form-item>
</el-col>
</el-row>
<!-- 第三行首次充值日期 + 充值次数 -->
<!-- <el-row >
<el-col :span="9">
<el-form-item label="首次充值日期">
<p v-if="user.firstRecharge">
{{ moment(user.firstRecharge).format('YYYY-MM-DD HH:mm:ss') }}
</p>
</el-form-item>
</el-col>
</el-row> -->
<!-- 第四行消费次数 + 所属门店 -->
<el-row>
<el-col :span="9">
<el-form-item label="所属门店">
<p>{{ user.market }}</p>
</el-form-item>
</el-col>
</el-row>
</el-form>
</el-card>
</div> </div>
</div> </div>
@ -653,7 +652,7 @@ p {
margin-left: 20px; margin-left: 20px;
display: flex; display: flex;
.beautiful {
.customer-info {
width: 90%; width: 90%;
display: flex; display: flex;
margin-left: 20px; margin-left: 20px;

Loading…
Cancel
Save