|
@@ -1,87 +1,64 @@
|
|
|
<template>
|
|
|
<HcCard>
|
|
|
<template #header>
|
|
|
- <div class="hc-expense-total-title">报销总额(元):1520</div>
|
|
|
+ <div class="hc-expense-total-title">车量:1520</div>
|
|
|
</template>
|
|
|
<div class="hac-expense-record-body">
|
|
|
<div class="record-form-box">
|
|
|
<el-scrollbar>
|
|
|
- <HcCardItem title="报销明细1" ui="hac-bg-grey">
|
|
|
- <el-form ref="formRef" :model="formModel" :rules="formRules" label-position="left" label-width="auto" size="large">
|
|
|
- <div class="hc-form-item">
|
|
|
- <el-form-item label="所属项目:" prop="key1">
|
|
|
- <el-select block v-model="formModel.key1">
|
|
|
- <el-option label="选项1" value="选项1"/>
|
|
|
- <el-option label="选项2" value="选项2"/>
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- <div class="ml-2">
|
|
|
- <el-button type="default" @click="budgetModalShow">
|
|
|
- <HcIcon name="add"/>
|
|
|
- <span>关联预算计划</span>
|
|
|
- </el-button>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
+ <el-form ref="formRef" :model="formModel" :rules="formRules" label-position="top" size="large">
|
|
|
+ <el-form-item label="用车事由:">
|
|
|
+ <el-input type="textarea" v-model="formModel.key1" :autosize="{ minRows: 2, maxRows: 3 }"/>
|
|
|
+ </el-form-item>
|
|
|
+ <div class="hc-form-item">
|
|
|
+ <el-form-item label="始发地点:">
|
|
|
+ <el-input v-model="formModel.key2"/>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="返回地点:" prop="key3">
|
|
|
+ <el-input v-model="formModel.key3"/>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ <div class="hc-form-item">
|
|
|
+ <el-form-item label="用车日期:" prop="key4">
|
|
|
+ <el-date-picker type="date" class="block" v-model="formModel.key4" format="YYYY-MM-DD" value-format="YYYY-MM-DD"/>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="返回日期:" prop="key5">
|
|
|
+ <el-date-picker type="date" class="block" v-model="formModel.key5" format="YYYY-MM-DD" value-format="YYYY-MM-DD"/>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ </el-form>
|
|
|
+
|
|
|
+ <HcCardItem title="车辆明细1" ui="hac-bg-grey" class="mt-6">
|
|
|
+ <el-form ref="formRef" :model="formModel" :rules="formRules" label-position="top" size="large">
|
|
|
<div class="hc-form-item">
|
|
|
- <el-form-item label="报销金额(元):" prop="key2">
|
|
|
- <el-input v-model="formModel.key2" placeholder="请输入报销金额" />
|
|
|
+ <el-form-item label="车辆类型:">
|
|
|
+ <el-input v-model="formModel.key2"/>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="费用发生日期:" prop="key3">
|
|
|
- <el-date-picker type="date" class="block" v-model="formModel.key3" format="YYYY-MM-DD" value-format="YYYY-MM-DD"/>
|
|
|
+ <el-form-item label="数量:" prop="key2">
|
|
|
+ <el-input v-model="formModel.key2">
|
|
|
+ <template slot="append">辆</template>
|
|
|
+ </el-input>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="费用类型:" prop="key4">
|
|
|
- <el-select block v-model="formModel.key4">
|
|
|
- <el-option label="选项1" value="选项1"/>
|
|
|
- <el-option label="选项2" value="选项2"/>
|
|
|
- </el-select>
|
|
|
+ <el-form-item label="其它要求:" prop="key3">
|
|
|
+ <el-input v-model="formModel.key2"/>
|
|
|
</el-form-item>
|
|
|
</div>
|
|
|
- <el-form-item label="费用说明:">
|
|
|
- <el-input type="textarea"
|
|
|
- v-model="formModel.key5"
|
|
|
- :autosize="{ minRows: 3, maxRows: 5 }"
|
|
|
- placeholder="请输入费用说明"
|
|
|
- />
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="电子发票:">
|
|
|
- <HcFormUpload :src="formModel.key6" @item="formInvoiceClick"/>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="附件文件:">
|
|
|
- <HcFormUpload :src="formModel.key6" @item="formFileClick"/>
|
|
|
- </el-form-item>
|
|
|
</el-form>
|
|
|
</HcCardItem>
|
|
|
-
|
|
|
- <div class="record-form-action-box mt-16">
|
|
|
+ <div class="text-gray text-sm mt-6">如需多种车型,请点击增加车辆</div>
|
|
|
+ <div class="record-form-action-box mt-8">
|
|
|
<el-divider content-position="right" border-style="dashed">
|
|
|
<el-button type="primary" hc-btn>
|
|
|
<HcIcon name="add"/>
|
|
|
- <span>添加明细</span>
|
|
|
+ <span>增加车辆</span>
|
|
|
</el-button>
|
|
|
</el-divider>
|
|
|
- <el-form class="mt-16" inline :model="formInline" label-position="top">
|
|
|
- <el-form-item label="归属人">
|
|
|
- <el-select v-model="formInline.key1">
|
|
|
- <el-option label="选项1" value="1" />
|
|
|
- <el-option label="选项2" value="2" />
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="是否抵消借款金额">
|
|
|
- <el-select v-model="formInline.key2">
|
|
|
- <el-option label="是" value="1" />
|
|
|
- <el-option label="否" value="2" />
|
|
|
- </el-select>
|
|
|
+ <el-form ref="formRef" :model="formModel" :rules="formRules" label-position="top" size="large">
|
|
|
+ <el-form-item label="备注:">
|
|
|
+ <el-input type="textarea" v-model="formInline.key1" :autosize="{ minRows: 3, maxRows: 5 }"/>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="选择借款项">
|
|
|
- <el-select v-model="formInline.key3">
|
|
|
- <el-option label="选项1" value="1" />
|
|
|
- <el-option label="选项2" value="2" />
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="冲抵后的实际报销金额">
|
|
|
- <el-input v-model="formInline.key2" disabled>
|
|
|
- <template #append>元</template>
|
|
|
- </el-input>
|
|
|
+ <el-form-item label="图片:">
|
|
|
+ <HcFormUpload :src="formModel.key6" @item="formFileClick"/>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
</div>
|
|
@@ -114,21 +91,6 @@
|
|
|
|
|
|
<!--上传控件-->
|
|
|
<HcUploadFile ref="HcUploadFileRef" :options="uploadFileOptions" :echoParams="uploadEchoParams" @success="HcUploadFileSuccess"/>
|
|
|
-
|
|
|
- <!--关联预算计划-->
|
|
|
- <HcDialog bgColor="#ffffff" isToBody isTable
|
|
|
- title="关联预算计划" widths="80%" saveText="保存"
|
|
|
- :show="budgetModal"
|
|
|
- @close="budgetCloseClick"
|
|
|
- @save="budgetSaveClick"
|
|
|
- >
|
|
|
- <HcTable :column="tableBudgetColumn" :datas="tableBudgetData">
|
|
|
- <template #action="{row,index}">
|
|
|
- <el-button size="small" type="danger" @click="row.relevance = false" v-if="row.relevance">取消关联</el-button>
|
|
|
- <el-button size="small" type="primary" @click="row.relevance = true" v-else>关联</el-button>
|
|
|
- </template>
|
|
|
- </HcTable>
|
|
|
- </HcDialog>
|
|
|
</HcCard>
|
|
|
</template>
|
|
|
|
|
@@ -153,39 +115,6 @@ const formModel = ref({
|
|
|
})
|
|
|
const formRules = {}
|
|
|
|
|
|
-//关联预算计划
|
|
|
-const budgetModal = ref(false)
|
|
|
-const budgetModalShow = () => {
|
|
|
- budgetModal.value = true
|
|
|
-}
|
|
|
-const budgetCloseClick = () => {
|
|
|
- budgetModal.value = false
|
|
|
-}
|
|
|
-const budgetSaveClick = () => {
|
|
|
-
|
|
|
-}
|
|
|
-
|
|
|
-//关联预算计划表格
|
|
|
-const tableBudgetColumn = [
|
|
|
- {key: 'key1', name: '任务所属项目'},
|
|
|
- {key: 'key2', name: '状态', width: '120', align: 'center'},
|
|
|
- {key: 'key3', name: '任务描述'},
|
|
|
- {key: 'key4', name: '完成指标', width: '120', align: 'center'},
|
|
|
- {key: 'action', name: '操作', width: '100', align: 'center'},
|
|
|
-]
|
|
|
-const tableBudgetData = ref([
|
|
|
- {id: 1, key1: 'xxxx'},
|
|
|
- {id: 2, key1: 'xxxx'},
|
|
|
- {id: 3, key1: 'xxxx'},
|
|
|
- {id: 4, key1: 'xxxx'},
|
|
|
-])
|
|
|
-
|
|
|
-
|
|
|
-//电子发票
|
|
|
-const formInvoiceClick = () => {
|
|
|
- HcUploadFileRef.value?.selectFile();
|
|
|
-}
|
|
|
-
|
|
|
//附件
|
|
|
const formFileClick = () => {
|
|
|
HcUploadFileRef.value?.selectFile();
|