Files
dvcp_v2_webapp/packages/party/AppPartyScore/psDetail.vue
2022-12-01 09:35:20 +08:00

155 lines
4.1 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="`学习强国`"/>
<el-button type="text" @click="handleEditLearningIntergral(detail.id)">编辑</el-button>
<b class="color-26f" v-text="detail.learningIntegral||0"/>
</template>
</ai-card>
<ai-card hideTitle class="staCard fill">
<template slot="content">
<div class="color-999" v-text="`个人积分`"/>
<b class="color-26f" v-text="detail.integral||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.familySurplusIntegral||0"/>
</template>
</ai-card>
</el-row>
<ai-card title="余额变动明细">
<template #content>
<ai-table :tableData="detail.integralInfoList" :isShowPagination="false" :col-configs="colConfigs"
:dict="dict"/>
</template>
</ai-card>
</template>
</ai-detail>
<ai-dialog :visible.sync="dialog" title="学习强国设置" width="500px" @close="form={}" @onConfirm="submit">
<el-form :model="form" size="small" ref="DialogForm" :rules="rules" label-width="110px">
<el-form-item label="学习强国积分" prop="learningIntegral">
<el-input v-model.number="form.learningIntegral" placeholder="请输入正整数" clearable/>
</el-form-item>
</el-form>
</ai-dialog>
</section>
</template>
<script>
export default {
name: "psDetail",
props: {
instance: Function,
dict: Object,
},
data() {
return {
detail: {},
colConfigs: [
{label: "时间", prop: "createTime"},
{label: "类型", prop: "integralType", align: 'center', dict: "partyIntegralType"},
{label: "变动积分", prop: "integral", align: 'center'},
{label: "剩余积分", prop: "residualIntegral", align: 'center'},
{label: "调整说明", prop: "remark"},
],
dialog: false,
form: {},
rules: {
learningIntegral: [
{required: true, message: "请输入学习强国积分"},
{pattern: /^\d+$/g, message: "请输入正整数"}
]
}
}
},
methods: {
getDetail() {
let {id} = this.$route.query
this.instance.post("/app/appparty/getPartyIntegralDetail", null, {
params: {id}
}).then(res => {
if (res?.data) {
this.detail = res.data
}
})
},
back() {
this.$router.push({})
},
submit() {
this.$refs.DialogForm.validate(v => {
if (v) {
this.instance.post("/app/appparty/editLearningIntegral", null,{
params:this.form
}).then(res => {
if (res?.code == 0) {
this.$message.success("提交成功!")
this.dialog = false
this.getDetail()
}
})
}
})
},
handleEditLearningIntergral(partyMemberId) {
this.dialog = true
this.form = {partyMemberId}
}
},
created() {
this.getDetail()
}
}
</script>
<style lang="scss" scoped>
.psDetail {
height: 100%;
.color-999 {
color: #999;
}
.color-26f {
color: #26f;
}
:deep(.staCard ){
font-size: 14px;
b {
font-size: 24px;
line-height: 40px;
}
& + .staCard {
margin-left: 16px;
}
.ai-card__body {
position: relative;
.el-button {
position: absolute;
right: 32px;
top: 6px;
}
}
}
}
</style>