Files
dvcp_v2_webapp/packages/party/AppPartyScore/psDetail.vue
2022-04-18 16:21:15 +08:00

102 lines
2.4 KiB
Vue

<template>
<section class="psDetail">
<ai-detail>
<ai-title slot="title" title="积分详情" isShowBottomBorder isShowBack @onBackClick="back"/>
<template #content>
<el-row type="flex">
<ai-card hideTitle class="staCard fill">
<template #content>
<div class="color-999" v-text="`姓名`"/>
<b v-text="detail.name"/>
</template>
</ai-card>
<ai-card hideTitle class="staCard fill">
<template #content>
<div class="color-999" v-text="`个人积分`"/>
<b class="color-26f" v-text="detail.name||0"/>
</template>
</ai-card>
<ai-card hideTitle class="staCard fill">
<template #content>
<div class="color-999" v-text="`家庭积分`"/>
<b class="color-26f" v-text="detail.name||0"/>
</template>
</ai-card>
</el-row>
<ai-card title="余额变动明细">
<template #content>
<ai-table :tableData="detail.list" :isShowPagination="false" :col-configs="colConfigs" :dict="dict"/>
</template>
</ai-card>
</template>
</ai-detail>
</section>
</template>
<script>
export default {
name: "psDetail",
props: {
instance: Function,
dict: Object,
},
data() {
return {
detail: {},
colConfigs: [
{label: "时间", prop: "createTime", width: 120},
{label: "类型", prop: "createTime", align: 'center'},
{label: "变动积分", prop: "createTime", align: 'center'},
{label: "剩余积分", prop: "createTime", align: 'center'},
{label: "调整说明", prop: "createTime"},
]
}
},
methods: {
getDetail() {
let {id} = this.$route.query
this.instance.post("/app/apppartyintegralinfo/list", null, {
params: {id}
}).then(res => {
if (res?.data) {
this.detail = res.data
}
})
},
back() {
this.$router.push({})
}
},
created() {
this.getDetail()
}
}
</script>
<style lang="scss" scoped>
.psDetail {
height: 100%;
.color-999 {
color: #999;
}
.color-26f {
color: #26f;
}
.staCard {
font-size: 14px;
b {
margin-top: 8px;
font-size: 24px;
}
& + .staCard {
margin-left: 16px;
}
}
}
</style>