<template>
|
<el-dialog
|
title="编辑"
|
:visible="value"
|
width="40%"
|
:show-close="false"
|
:modal='false'
|
:before-close="onCancel">
|
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="ruleForm">
|
<el-form-item label="积分任务">
|
<span>{{itemData.name}}</span>
|
</el-form-item>
|
|
<el-form-item label="积分值" prop="amount">
|
<el-input v-model="ruleForm.amount"></el-input>
|
</el-form-item>
|
|
<el-form-item label="次数限制" prop="isRestrict">
|
<el-radio-group v-model="ruleForm.isRestrict">
|
<el-radio
|
v-for="item in configTyperadio"
|
:key="item.value"
|
:label="item.value"
|
>{{item.label}}</el-radio>
|
</el-radio-group>
|
|
<el-form-item class="isShowinpput" label="" prop="count" v-if="ruleForm.isRestrict !== '2'">
|
<el-select class="width50" v-model="ruleForm.type" placeholder="请选择">
|
<el-option
|
v-for="item in configTypeSelect"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value"
|
>
|
</el-option>
|
</el-select>
|
<el-input class="input-width" v-model="ruleForm.count" placeholder="输入次数"></el-input>
|
</el-form-item>
|
</el-form-item>
|
|
<el-form-item label="描述">
|
<el-input
|
type="textarea"
|
placeholder="请输入内容"
|
maxlength="100"
|
rows="5"
|
show-word-limit
|
v-model="ruleForm.integralDescribe"
|
></el-input>
|
</el-form-item>
|
</el-form>
|
<span slot="footer" class="dialog-footer">
|
<el-button @click="onCancel('ruleForm')">取 消</el-button>
|
<el-button type="primary" @click="onOk('ruleForm')" :loading="okLoading">确 定</el-button>
|
</span>
|
</el-dialog>
|
</template>
|
|
<script>
|
import vUpload from "com/upload/upload1";
|
export default {
|
props: {
|
value: {type: Boolean},
|
item: {type:Object}
|
},
|
components:{vUpload},
|
|
data() {
|
const validateNum = (rule, value, callback) => {
|
const num= /^[0-9]*$/
|
if (!num.test(value)) {
|
callback(new Error('只能输入0或正整数'))
|
}else{
|
callback()
|
}
|
};
|
|
return {
|
ruleForm: {
|
isRestrict:"2",
|
amount:"",
|
type:"2",
|
integralDescribe:"",
|
count: '',
|
id: '',
|
},
|
okLoading: false,
|
rules: {
|
amount: [
|
{ required: true, message: '请输入积分值', trigger: 'blur' },
|
{validator:validateNum,trigger: 'blur'}
|
],
|
count: [
|
{ required: true, message: '请输入次数限制', trigger: 'blur' },
|
{validator:validateNum,trigger: 'blur'}
|
],
|
// isRestrict: [
|
// { required: true, trigger: 'change'},
|
// ],
|
},
|
itemData:{},
|
configTypeSelect:[
|
{
|
value:"2",
|
label:"每日"
|
},
|
{
|
value:"1",
|
label:"每月"
|
},
|
],
|
configTyperadio: [
|
{
|
value:"2",
|
label:"无限制"
|
},
|
{
|
value:"1",
|
label:"限制"
|
},
|
]
|
}
|
},
|
|
watch: {
|
item (val) {
|
if (val) {
|
console.log(val)
|
this.itemData = val;
|
this.ruleForm.id = val.id;
|
this.ruleForm = val;
|
this.ruleForm.isRestrict = String(val.isRestrict);
|
if(val.type) {
|
this.ruleForm.type = String(val.type);
|
}
|
}
|
}
|
},
|
|
mounted() {
|
},
|
|
methods: {
|
/** 取消 */
|
onCancel (formName) {
|
this.$emit('change', false);
|
this.$refs[formName].resetFields();
|
},
|
|
/** 确认表单提交 */
|
onOk(formName) {
|
console.log(this.ruleForm)
|
if(this.ruleForm.isRestrict === '1') {
|
if(!this.ruleForm.type) {
|
demo.toast("请选择限制的方式")
|
return;
|
}
|
// if(!this.ruleForm.count) {
|
// demo.toast("请填写限制的次数")
|
// return;
|
// }
|
// if (this.ruleForm.count.match(/^[0-9]*$/)) {
|
// return demo.toast("请填写整数")
|
// }
|
|
}
|
|
this.$refs[formName].validate((valid) => {
|
if (valid) {
|
this.okLoading = true;
|
this.$api.post("integral/rule/edit", this.ruleForm,
|
e => {
|
demo.toast("编辑成功");
|
this.$emit('success');
|
this.onCancel();
|
},
|
err=> {
|
demo.toast(err.msg)
|
}
|
)
|
this.okLoading = false;
|
|
} else {
|
// demo.toast("验证不通过")
|
return false;
|
}
|
});
|
}
|
}
|
|
}
|
</script>
|
|
<style>
|
.width50 {
|
width: 80px;
|
height: 30px;
|
}
|
.input-width {
|
width: 150px;
|
}
|
.isShowinpput {
|
display: initial;
|
}
|
</style>
|
