132 lines
3.7 KiB
Vue
132 lines
3.7 KiB
Vue
|
<template>
|
||
|
|
<n-form label-placement="left" label-width="auto" :model="form">
|
||
|
|
<n-form-item label="分值*" path="scroe.value">
|
||
|
|
<n-input-number v-model:value="form.score.value" placeholder="输入分值" :max="form.score.maxValue"
|
||
|
|
:min="form.score.minValue"/>
|
||
|
|
</n-form-item>
|
||
|
|
<n-form-item label="分值原因*" path="score.reason">
|
||
|
|
<n-input type="textarea" v-model:value="form.score.reason" placeholder="输入分值原因" @keydown.enter.prevent />
|
||
|
|
</n-form-item>
|
||
|
|
<n-space>
|
||
|
|
<n-form-item label="填报人*" path="score.userName">
|
||
|
|
<n-input v-model:value="form.score.userName" placeholder="输入填报人" readonly />
|
||
|
|
</n-form-item>
|
||
|
|
<n-form-item label="填报日期*" path="score.date">
|
||
|
|
<n-input v-model:value="form.score.date" placeholder="输入填报日期" readonly />
|
||
|
|
</n-form-item>
|
||
|
|
</n-space>
|
||
|
|
<n-space justify="end">
|
||
|
|
<n-button type="primary" @click="onConfirmClick">确定</n-button>
|
||
|
|
</n-space>
|
||
|
|
</n-form>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import {
|
||
|
|
NForm,
|
||
|
|
NFormItem,
|
||
|
|
NInput,
|
||
|
|
NInputNumber,
|
||
|
|
NButton,
|
||
|
|
NSpace,
|
||
|
|
|
||
|
|
useMessage
|
||
|
|
} from 'naive-ui'
|
||
|
|
|
||
|
|
export default {
|
||
|
|
name: 'Scroing',
|
||
|
|
components: {
|
||
|
|
NForm,
|
||
|
|
NFormItem,
|
||
|
|
NInput,
|
||
|
|
NInputNumber,
|
||
|
|
NButton,
|
||
|
|
NSpace,
|
||
|
|
},
|
||
|
|
props: {
|
||
|
|
rowKey: {
|
||
|
|
required: true
|
||
|
|
},
|
||
|
|
rowIndex: {
|
||
|
|
required: true
|
||
|
|
},
|
||
|
|
score: {
|
||
|
|
required: false,
|
||
|
|
default: 0
|
||
|
|
},
|
||
|
|
reason: {
|
||
|
|
required: false,
|
||
|
|
},
|
||
|
|
minScore: {
|
||
|
|
required: false,
|
||
|
|
default: 0
|
||
|
|
},
|
||
|
|
maxScore: {
|
||
|
|
required: false,
|
||
|
|
default: 100
|
||
|
|
}
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
let vueSelf = this;
|
||
|
|
return {
|
||
|
|
message: useMessage(),
|
||
|
|
form: {
|
||
|
|
score: {
|
||
|
|
value: vueSelf.score,
|
||
|
|
maxValue: vueSelf.maxScore,
|
||
|
|
minValue: vueSelf.minScore,
|
||
|
|
reason: vueSelf.reason,
|
||
|
|
userId: '1',
|
||
|
|
userName: '管理员',
|
||
|
|
date: ''
|
||
|
|
},
|
||
|
|
},
|
||
|
|
rules: {
|
||
|
|
scroe: {
|
||
|
|
value: [
|
||
|
|
{
|
||
|
|
required: true,
|
||
|
|
message: '请输入分值'
|
||
|
|
}
|
||
|
|
],
|
||
|
|
},
|
||
|
|
}
|
||
|
|
}
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
onConfirmClick() {
|
||
|
|
if(this.form.score.value === null) {
|
||
|
|
this.message.error('请输入分值')
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
if(!this.form.score.reason) {
|
||
|
|
this.message.error('请输入分值原因')
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
this.$emit('confirm', this.rowKey, this.rowIndex, {
|
||
|
|
score: this.form.score.value,
|
||
|
|
reason: this.form.score.reason,
|
||
|
|
userId: this.form.score.userId,
|
||
|
|
userName: this.form.score.userName,
|
||
|
|
date: this.form.score.date,
|
||
|
|
});
|
||
|
|
},
|
||
|
|
getCurrentDate() {
|
||
|
|
let date = new Date();
|
||
|
|
let year = date.getFullYear();
|
||
|
|
let month = date.getMonth() + 1;
|
||
|
|
month = month < 10 ? `0${month}` : month;
|
||
|
|
let day = date.getDay();
|
||
|
|
day = day < 10 ? `0${day}` : day;
|
||
|
|
return `${year}-${month}-${day}`;
|
||
|
|
}
|
||
|
|
},
|
||
|
|
mounted() {
|
||
|
|
this.form.score.date = this.getCurrentDate()
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="stylus" scoped>
|
||
|
|
|
||
|
|
</style>
|