yudao-dev/src/views/cost/deep/costDeepOthercostLog/add-or-updata.vue
2024-09-10 15:19:44 +08:00

125 lines
2.7 KiB
Vue

<!--
* @Author: zwq
* @Date: 2021-11-18 14:16:25
* @LastEditors: zwq
* @LastEditTime: 2024-09-05 15:35:07
* @Description:
-->
<template>
<el-form
:model="dataForm"
:rules="dataRule"
ref="dataForm"
@keyup.enter.native="dataFormSubmit()"
label-position="top"
label-width="80px">
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="成本名称" prop="name">
<el-select
v-model="dataForm.name"
filterable
clearable
:style="{ width: '100%' }"
@change="setLabel"
placeholder="请选择成本名称">
<el-option
v-for="item in nameArr"
:key="item.name"
:label="item.label"
:value="item.name"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="成本金额" prop="price">
<el-input-number
:min="0"
style="width: 80%"
v-model="dataForm.price"
clearable
placeholder="请输入成本金额" />
(元)
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="所属日期" prop="recTime">
<el-date-picker
v-model="dataForm.recTime"
type="date"
value-format="timestamp"
:style="{ width: '100%' }"
placeholder="选择所属日期"></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="备注" prop="remark">
<el-input
v-model="dataForm.remark"
clearable
placeholder="请输入备注" />
</el-form-item>
</el-col>
</el-row>
</el-form>
</template>
<script>
import basicAdd from '@/mixins/basic-add';
import {
createRawOthercostLog,
updateRawOthercostLog,
getRawOthercostLog,
} from '@/api/cost/costOthercostLogDeep';
import moment from 'moment';
const nowData = moment().format('YYYY-MM-DD').valueOf()
export default {
mixins: [basicAdd],
props: {
nameArr: {
type: Array,
default: () => [],
},
},
data() {
return {
urlOptions: {
createURL: createRawOthercostLog,
updateURL: updateRawOthercostLog,
infoURL: getRawOthercostLog,
},
dataForm: {
id: undefined,
price: undefined,
name: undefined,
recTime: new Date().getTime(),
remark: undefined,
},
dataRule: {
price: [
{ required: true, message: '成本金额不能为空', trigger: 'blur' },
],
name: [
{ required: true, message: ' 成本名称不能为空', trigger: 'blur' },
],
recTime: [
{
required: true,
message: '所属日期不能为空',
trigger: 'change',
},
],
},
};
},
methods: {
setLabel(val){
this.dataForm.label = this.nameArr.find(item=>item.name===val).label
}
},
};
</script>