|
@@ -103,7 +103,7 @@
|
|
|
<!-- 上面部分 -->
|
|
|
<div v-if="!displayTable && apk == false" class="tops" :style="'height:' +hubs+'px'">
|
|
|
<!-- 公共 -->
|
|
|
- <div class="ctons" style="width: 98%">
|
|
|
+ <div class="ctons" style="width: 98%;overflow: auto;">
|
|
|
<!-- 表单 -->
|
|
|
<el-form ref="addForm" :model="addForm" label-width="80px" :rules="addFormRules">
|
|
|
<!-- 请假类型 -->
|
|
@@ -170,6 +170,22 @@
|
|
|
<el-form-item :label="$t('bei-zhu')" style="width: 100%">
|
|
|
<el-input type="textarea" v-model="addForm.remark" :rows="5" style="width: 550px" maxlength="100" show-word-limit></el-input>
|
|
|
</el-form-item>
|
|
|
+ <el-form-item label="相关凭证" style="width: 100%">
|
|
|
+ <el-upload action="#" list-type="picture-card" multiple ref="leaveApplicationFormUploadRef" :limit="5" :http-request="imageUpload" :file-list="leaveAndUploadPictures">
|
|
|
+ <i slot="default" class="el-icon-plus"></i>
|
|
|
+ <div slot="file" slot-scope="{file}">
|
|
|
+ <img class="el-upload-list__item-thumbnail" :src="file.url" alt="">
|
|
|
+ <span class="el-upload-list__item-actions">
|
|
|
+ <span class="el-upload-list__item-preview" @click="handlePictureCardPreview(file)">
|
|
|
+ <i class="el-icon-zoom-in"></i>
|
|
|
+ </span>
|
|
|
+ <span v-if="!disabled" class="el-upload-list__item-delete" @click="handleRemove(file)">
|
|
|
+ <i class="el-icon-delete"></i>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </el-upload>
|
|
|
+ </el-form-item>
|
|
|
<!--请假流程显示-->
|
|
|
<el-form-item :label="$t('other.approvalProcess')" style="width: 100%;color:#606266" >
|
|
|
<span v-for="(item, index) in curWorkflowList" :key="item.id" >
|
|
@@ -195,7 +211,7 @@
|
|
|
<!-- 下面部分 -->
|
|
|
<div v-if="displayTable && apk == false" class="tops" :style="'height:' +hubs+'px'">
|
|
|
<!-- 公共 -->
|
|
|
- <div class="ctons" style="width: 98%;">
|
|
|
+ <div class="ctons" style="width: 98%;overflow: auto;">
|
|
|
<div class="flex">
|
|
|
<div>
|
|
|
<el-select v-if="user.userNameNeedTranslate != 1" v-model="ownerIds" :placeholder="$t('pleaseselectthepersonaskingforleave')" clearable @change="chufas()" style="width: 120px" size="small" v-show="permissions.leaveAll" filterable="true">
|
|
@@ -292,14 +308,18 @@
|
|
|
</div>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column prop="remark" :label="$t('bei-zhu')" min-width="200" header-align="center">
|
|
|
+ <el-table-column prop="remark" :label="$t('bei-zhu')" min-width="200">
|
|
|
<template slot-scope="scope">
|
|
|
- <!-- <div class="apls">{{scope.row.remark}}</div> -->
|
|
|
<el-popover placement="top-start" width="200" trigger="hover" :content="scope.row.remark">
|
|
|
<div slot="reference" class="apls">{{scope.row.remark}}</div>
|
|
|
</el-popover>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
+ <el-table-column label="相关凭证" min-width="200">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-button type="primary" size="mini" v-if="scope.row.fileUrlsList.length && scope.row.fileUrlsList[0].name" @click="clickToViewTheImage(scope.row.fileUrlsList)">点击查看</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
<el-table-column :label="$t('operation')" min-width="180" fixed="right" v-if="isAuditList && !isSyncData">
|
|
|
<template slot-scope="scope">
|
|
|
<div>
|
|
@@ -758,6 +778,22 @@
|
|
|
<el-form-item :label="$t('bei-zhu')" style="width: 100%">
|
|
|
<el-input type="textarea" v-model="addForm.remark" :rows="5" style="width: 62%" maxlength="100" show-word-limit></el-input>
|
|
|
</el-form-item>
|
|
|
+ <el-form-item label="相关凭证" style="width: 100%">
|
|
|
+ <el-upload action="#" list-type="picture-card" multiple ref="leaveApplicationFormUploadDetailRef" :limit="5" :http-request="imageDetailUpload" :file-list="addForm.fileUrlsList">
|
|
|
+ <i slot="default" class="el-icon-plus"></i>
|
|
|
+ <div slot="file" slot-scope="{file}">
|
|
|
+ <img class="el-upload-list__item-thumbnail" :src="file.url" alt="">
|
|
|
+ <span class="el-upload-list__item-actions">
|
|
|
+ <span class="el-upload-list__item-preview" @click="handlePictureCardDetailPreview(file)">
|
|
|
+ <i class="el-icon-zoom-in"></i>
|
|
|
+ </span>
|
|
|
+ <span v-if="!disabled" class="el-upload-list__item-delete" @click="handleDetailRemove(file)">
|
|
|
+ <i class="el-icon-delete"></i>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </el-upload>
|
|
|
+ </el-form-item>
|
|
|
</el-form>
|
|
|
<span slot="footer" class="dialog-footer">
|
|
|
<el-button @click="dialog = false">{{ $t('btn.cancel') }}</el-button>
|
|
@@ -797,6 +833,13 @@
|
|
|
<el-button @click="denyReasonVisible = false" >{{ $t('btn.cancel') }}</el-button>
|
|
|
</div>
|
|
|
</el-dialog> -->
|
|
|
+
|
|
|
+ <!-- 文件图片显示 -->
|
|
|
+ <div v-show="false">
|
|
|
+ <viewer :images="excessiveImagesList">
|
|
|
+ <img ref="imgsaListRef" v-for="src in excessiveImagesList" :src="src.url">
|
|
|
+ </viewer>
|
|
|
+ </div>
|
|
|
</section>
|
|
|
</template>
|
|
|
|
|
@@ -811,6 +854,7 @@ import selectPersonnel from '../../components/selectPersonnel.vue';
|
|
|
import vueCascader from "@/components/cascader.vue"
|
|
|
|
|
|
import { getThemeColor } from '@/utils/commonMethod.js'
|
|
|
+import { del } from 'vue';
|
|
|
export default {
|
|
|
name: "expense",
|
|
|
components: {
|
|
@@ -990,6 +1034,9 @@ export default {
|
|
|
auditLogList:[],
|
|
|
selectedAuuid: '',
|
|
|
syncLeaveLoading:false,
|
|
|
+ relatedVouchersList: [],
|
|
|
+ excessiveImagesList: [],
|
|
|
+ leaveAndUploadPictures: []
|
|
|
};
|
|
|
},
|
|
|
computed: {},
|
|
@@ -1022,6 +1069,85 @@ export default {
|
|
|
},
|
|
|
filters: {},
|
|
|
methods: {
|
|
|
+ imageUpload(res) {
|
|
|
+ const row = res.file
|
|
|
+ const formData = new FormData();
|
|
|
+ formData.append('multipartFile', row);
|
|
|
+ this.$refs.leaveApplicationFormUploadRef.uploadFiles = [];
|
|
|
+ this.http.uploadFile(`/common/uploadFile`, formData, res => {
|
|
|
+ if (res.code == "ok") {
|
|
|
+ const url = res.data
|
|
|
+ this.leaveAndUploadPictures.push({
|
|
|
+ name: url,
|
|
|
+ url: `/upload/${url}`,
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ this.$message({ message: res.msg, type: "error" });
|
|
|
+ }
|
|
|
+ }, err => {
|
|
|
+ this.$message({ message: error, type: "error" });
|
|
|
+ })
|
|
|
+ },
|
|
|
+ imageDetailUpload(res) {
|
|
|
+ const row = res.file
|
|
|
+ const formData = new FormData();
|
|
|
+ formData.append('multipartFile', row);
|
|
|
+ this.$refs.leaveApplicationFormUploadDetailRef.uploadFiles = [];
|
|
|
+ this.http.uploadFile(`/common/uploadFile`, formData, res => {
|
|
|
+ if (res.code == "ok") {
|
|
|
+ const url = res.data
|
|
|
+ this.addForm.fileUrlsList.push({
|
|
|
+ name: url,
|
|
|
+ url: `/upload/${url}`,
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ this.$message({ message: res.msg, type: "error" });
|
|
|
+ }
|
|
|
+ }, err => {
|
|
|
+ this.$message({ message: error, type: "error" });
|
|
|
+ })
|
|
|
+ },
|
|
|
+ handlePictureCardPreview(file) {
|
|
|
+ const list = this.$refs.leaveApplicationFormUploadRef.uploadFiles || [];
|
|
|
+ const fileIndex = list.findIndex(item => item.uid === file.uid);
|
|
|
+ this.excessiveImagesList = list
|
|
|
+
|
|
|
+ setTimeout(() => {
|
|
|
+ this.$refs.imgsaListRef[fileIndex].click()
|
|
|
+ }, 200);
|
|
|
+ },
|
|
|
+ handlePictureCardDetailPreview(file) {
|
|
|
+ const list = this.$refs.leaveApplicationFormUploadDetailRef.uploadFiles || [];
|
|
|
+ const fileIndex = list.findIndex(item => item.uid === file.uid);
|
|
|
+ this.excessiveImagesList = list
|
|
|
+
|
|
|
+ setTimeout(() => {
|
|
|
+ this.$refs.imgsaListRef[fileIndex].click()
|
|
|
+ }, 200);
|
|
|
+ },
|
|
|
+ clickToViewTheImage(list) {
|
|
|
+ this.excessiveImagesList = list
|
|
|
+ setTimeout(() => {
|
|
|
+ this.$refs.imgsaListRef[0].click()
|
|
|
+ }, 200);
|
|
|
+ },
|
|
|
+ handleRemove(file) {
|
|
|
+ const list = this.$refs.leaveApplicationFormUploadRef.uploadFiles || [];
|
|
|
+ const fileIndex = list.findIndex(item => item.uid === file.uid);
|
|
|
+ if(list.length) {
|
|
|
+ console.log(list)
|
|
|
+ this.$refs.leaveApplicationFormUploadRef.uploadFiles.splice(fileIndex, 1);
|
|
|
+ this.leaveAndUploadPictures.splice(fileIndex, 1)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ handleDetailRemove(file) {
|
|
|
+ const list = this.$refs.leaveApplicationFormUploadDetailRef.uploadFiles || [];
|
|
|
+ const fileIndex = list.findIndex(item => item.uid === file.uid);
|
|
|
+ if(list.length) {
|
|
|
+ this.$refs.leaveApplicationFormUploadDetailRef.uploadFiles.splice(fileIndex, 1);
|
|
|
+ this.addForm.fileUrlsList.splice(fileIndex, 1)
|
|
|
+ }
|
|
|
+ },
|
|
|
showDenyReason(sheetId) {
|
|
|
this.denyReasonVisible = true;
|
|
|
this.auditLogList = [];
|
|
@@ -1762,6 +1888,8 @@ export default {
|
|
|
this.apk2 = 9
|
|
|
this.restTime()
|
|
|
}
|
|
|
+
|
|
|
+ this.leaveAndUploadPictures = []
|
|
|
},
|
|
|
auditList() {
|
|
|
this.falg = 1
|
|
@@ -1784,7 +1912,13 @@ export default {
|
|
|
this.http.post('/leave-sheet/auditList', param,
|
|
|
res => {
|
|
|
if (res.code == "ok") {
|
|
|
- this.tableData = res.data.records
|
|
|
+ this.tableData = res.data.records.map(item => ({
|
|
|
+ ...item,
|
|
|
+ fileUrlsList: (item.fileUrls || '').split(',').map(em => ({
|
|
|
+ name: em,
|
|
|
+ url: `/upload/${em}`
|
|
|
+ }))
|
|
|
+ }));
|
|
|
this.total = res.data.total
|
|
|
this.loading = false
|
|
|
} else {
|
|
@@ -1843,7 +1977,14 @@ export default {
|
|
|
this.http.post('/leave-sheet/list', param,
|
|
|
res => {
|
|
|
if (res.code == "ok") {
|
|
|
- this.tableData = res.data.records
|
|
|
+ this.tableData = res.data.records.map(item => ({
|
|
|
+ ...item,
|
|
|
+ fileUrlsList: (item.fileUrls || '').split(',').map(em => ({
|
|
|
+ name: em,
|
|
|
+ url: `/upload/${em}`
|
|
|
+ }))
|
|
|
+ }));
|
|
|
+ console.log(this.tableData)
|
|
|
this.total = res.data.total
|
|
|
this.loading = false
|
|
|
} else {
|
|
@@ -1908,7 +2049,15 @@ export default {
|
|
|
this.addForm.endDate = this.buling(this.addForm.endDate)
|
|
|
this.addForm.startDate = this.buling(this.addForm.startDate)
|
|
|
if (valid) {
|
|
|
- this.http.post('/leave-sheet/add', this.addForm,
|
|
|
+ let formData = new FormData()
|
|
|
+ const fileList = this.leaveAndUploadPictures.map(item => item.name)
|
|
|
+ Object.keys(this.addForm).forEach(key => {
|
|
|
+ formData.append(key, this.addForm[key])
|
|
|
+ })
|
|
|
+
|
|
|
+ formData.append('fileUrls', fileList.join(','))
|
|
|
+
|
|
|
+ this.http.uploadFile('/leave-sheet/add', formData,
|
|
|
res => {
|
|
|
if (res.code == "ok") {
|
|
|
this.$message({
|
|
@@ -1922,8 +2071,9 @@ export default {
|
|
|
this.addForm.leaveType = 0
|
|
|
this.addForm.timeHours = 8
|
|
|
this.addForm.remark = ''
|
|
|
-
|
|
|
this.flg = true
|
|
|
+ this.$refs.leaveApplicationFormUploadRef.clearFiles()
|
|
|
+ this.leaveAndUploadPictures = []
|
|
|
} else {
|
|
|
this.$message({
|
|
|
message: res.msg,
|
|
@@ -2250,6 +2400,7 @@ export default {
|
|
|
});
|
|
|
},
|
|
|
editor(items) {
|
|
|
+ console.log(items, '<===== zhong-xin-ti-jiao')
|
|
|
this.dialog = true
|
|
|
this.addForm.ownerId = items.ownerId
|
|
|
this.addForm.tel = items.tel
|
|
@@ -2259,11 +2410,16 @@ export default {
|
|
|
this.addForm.timeDays = items.timeDays
|
|
|
this.addForm.timeHours = items.timeHours
|
|
|
this.addForm.remark = items.remark
|
|
|
+ this.addForm.fileUrlsList = items.fileUrlsList || []
|
|
|
this.affId = items.id
|
|
|
},
|
|
|
determine () {
|
|
|
var adl = this.addForm
|
|
|
adl.id = this.affId
|
|
|
+ adl.fileUrls = this.addForm.fileUrlsList.map(item => {
|
|
|
+ return item.name
|
|
|
+ }).join(',')
|
|
|
+ delete adl.fileUrlsList
|
|
|
this.http.post('/leave-sheet/add', adl,
|
|
|
res => {
|
|
|
if (res.code == "ok") {
|
|
@@ -2277,7 +2433,8 @@ export default {
|
|
|
leaveType: 0,
|
|
|
timeHours: '8',
|
|
|
tel: '',
|
|
|
- remark: ''
|
|
|
+ remark: '',
|
|
|
+ fileUrls: []
|
|
|
}
|
|
|
this.getUsers()
|
|
|
} else {
|