OA/pages/invoice/handle.vue

868 lines
20 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="leave_request">
<view class="leave_box">
<view class="cont_cell">
<view class="title">开票金额</view>
<input type="text" v-model="listobj.amount" placeholder="开票金额">
</view>
<view class="leava_type flex_a_c">
<view class="title">开票类型:</view>
<input type="text" v-model="project1" placeholder="请选择" disabled>
</view>
<view class="leava_type flex_a_c">
<view class="title">开票主体:</view>
<input type="text" v-model="project2" placeholder="请选择" disabled>
</view>
<view class="cont_cell">
<view class="title">抬头类型:</view>
<radio-group class="select_group" @change="deliveryWayChangetwo">
<label class="radio_select" style="margin-right:15rpx;display: flex; margin-bottom: 30rpx;">
<view style="margin-right:5rpx;">
<radio value="1" :checked="selected === '1'" />
</view>
企业
</label>
<label class="radio_select" style="margin-right:15rpx;display: flex;">
<view style="margin-right:5rpx;">
<radio value="2" :checked="selected === '2'" />
</view>
<view @click="branchShow = true" style="display: flex;">
<view class="title">个人</view>
</view>
</label>
</radio-group>
</view>
<view class="cont_cell">
<view class="title">开票抬头:</view>
<input type="text" v-model="listobj.invoice_title" placeholder="开票抬头">
</view>
<view class="cont_cell">
<view class="title">电话号码:</view>
<input type="text" v-model="listobj.invoice_phone" placeholder="电话号码">
</view>
<view class="cont_cell" v-if="isshow">
<view class="title">纳税人识别号 </view>
<input type="text" v-model="listobj.invoice_tax" placeholder="纳税人识别号">
</view>
<view class="cont_cell" v-if="isshow">
<view class="title">开户行:</view>
<input type="text" v-model="listobj.invoice_bank" placeholder="开户行">
</view>
<view class="cont_cell" v-if="isshow">
<view class="title">银行账号:</view>
<input type="text" v-model="listobj.invoice_account" placeholder="银行账号">
</view>
<view class="cont_cell" v-if="isshow">
<view class="title">银行营业网点 </view>
<input type="text" v-model="listobj.invoice_banking" placeholder="银行营业网点">
</view>
<view class="cont_cell" v-if="isshow">
<view class="title">地址:</view>
<input type="text" v-model="listobj.invoice_address" placeholder="地址">
</view>
</view>
<!-- <view class="leave_box" style="padding-top: 100rpx;"> -->
<!-- 附件 -->
<!-- <block v-for="(item, i) in fileArray" :key="i">
<view class="file flex_a_c_j_sb">
<view class="l_file">
<view class="file_name">{{ item.name }}</view>
<view class="file_size">{{ item.filesize | formatBytes }}</view>
<view class="upload_people">上传人:{{ item.admin_name }}</view>
</view>
</view>
</block> -->
<!-- <view class="upload_box flex_a_c_j_sb">
<view>
<view class="title">选择文件并上传</view>
<view class="text">
上传前请规范命名最大只能上传100M的文件<br />
超过请压缩成多个文件上传。
</view>
</view> -->
<!-- <view class="" style="margin-top: 60rpx;">
<lsjUpload ref="lsjUpload" childId="upload1" :size="10" :option="fileOption" height="200rpx"
style="margin-top: 28rpx;" :debug="false"
:formats="'pdf,txt,zip,rar,jpg,png,mp3,avi,mov,mp4,gif'" :multiple="false" :count="3"
:instantly="true" @change="changeFile" @uploadEnd='onuploadEnd' @progress='onprogre'> -->
<!-- <view class="change-file">请选择PDF类型的发票</view> -->
<!-- <u-icon name="plus-circle" color="#333333" size="28"
style="margin-top: 40rpx; margin-left: 60rpx;"></u-icon> -->
<!-- <u-icon name="plus-circle" color="#333333" size="28"></u-icon>
</lsjUpload>
</view>
</view>-->
<!-- </view> -->
<view class="flow_path">
<view class="cont_cell">
<view class="title">审批流程:</view>
</view>
<view style="padding-bottom: 40rpx;">
<block v-for="(item,i) in check_record" :key="i">
<view class="record" style="display: flex;">
<view class="circle"></view>
<text class="text">{{item.check_time_str}} {{item.name}} {{item.status_str}}
了此申请。操作意见:{{item.content}}</text>
</view>
</block>
</view>
<block>
<view class="cont_cell">
<view class="title">审核状态:</view>
{{listobj.check_status=='0'?'待审核':listobj.check_status=='1'?'审核中':listobj.check_status=='2'?'审核通过':listobj.check_status=='3'?'审核不通过':listobj.check_status=='4'?'已撤销':listobj.check_status=='5'?'已开具':'已作废'}}
</view>
<view class="cont_cell">
<view class="title">当前审核人:</view>
<input type="text" v-model="admin_name" placeholder="请选择" disabled>
</view>
<view class="cont_cell">
<view class="title">抄送人:</view>
<input type="text" v-model="copy_names" placeholder="请选择" disabled>
</view>
<view class="" v-if="listobj.check_status!= 5&&listobj.check_status!= 2">
<view class="title" style="margin-bottom: 30rpx;">审核节点:</view>
<radio-group class="select_group" @change="deliveryWayChangetwo1">
<label class="radio_select" style="margin-right:15rpx;display: flex; margin-bottom: 30rpx;">
<view style="margin-right:5rpx;">
<radio value="1" />
</view>
审核结束
</label>
<label class="radio_select" style="margin-right:15rpx;display: flex;">
<view style="margin-right:5rpx;">
<radio value="2" />
</view>
<view @click="branchShow = true" style="display: flex;">
<view class="title"> 下一位审批人:</view>
<input type="text" v-model="check_admin_name" placeholder="请选择" disabled>
</view>
</label>
</radio-group>
</view>
</block>
<view class="cont_cell" style="padding-top: 20rpx;"
v-if="listobj.check_status!= 4&&listobj.check_status!= 5&&listobj.check_status!= 2">
<view class="title" style="width: 200rpx;">审核意见</view>
<textarea v-model="mscontent" placeholder="请输入审核意见" />
</view>
</view>
<view class="bot_btn" v-if="listobj.check_status!= 5&&listobj.check_status!= 2">
<view class="reset" @click="appflowcheck()">拒绝</view>
<view class="submit_btn" @click=" appflowcheck1()">通过</view>
</view>
<u-action-sheet :show="leavaTypeShow2" keyName="name" :actions="columns1" title="请选择"
@close="leavaTypeShow2 = false" @select="leavaType2">
</u-action-sheet>
<u-action-sheet :show="leavaTypeShow" keyName="name" :actions="columns" title="请选择"
@close="leavaTypeShow = false" @select="leavaType">
</u-action-sheet>
<u-action-sheet :show="leavaTypeShow1" keyName="name" :actions="actions4" title="请选择"
@close="leavaTypeShow1 = false" @select="leavaType1">
</u-action-sheet>
<!-- 选择审批流程 -->
<u-action-sheet :actions="flowPathSheet" @select="flowPathSelect" title="选择审批流程" :show="flowPathShow"
@close="flowPathShow=false" :closeOnClickOverlay="true" :closeOnClickAction="true">
</u-action-sheet>
<!-- 部门选择 -->
<u-picker :show="branchShow" :defaultIndex='defaultIndex' ref="branchRef" :columns="branchColumns"
@confirm="branchConfirm" @change="columnCode" :closeOnClickOverlay="true" @close="branchShowclose"
keyName="name">
</u-picker>
<u-picker :show="branchShow1" :defaultIndex='defaultIndex1' ref="branchRef" :columns="branchColumns1"
@confirm="branchConfirm1" @change="columnCode1" :closeOnClickOverlay="true" @close="branchShowclose1"
keyName="name">
</u-picker>
<!-- 选择时间 -->
<u-datetime-picker :show="timeShow" mode="datetime" :maxDate="1786778555000" :minDate="timestamp"
closeOnClickOverlay @confirm="timeConfirm($event)" @cancel="timeShow = false"
@close="timeShow = false"></u-datetime-picker>
<u-datetime-picker :show="timeShow1" mode="datetime" :maxDate="1786778555000" :minDate="timestamp"
closeOnClickOverlay @confirm="timeConfirm1($event)" @cancel="timeShow1 = false"
@close="timeShow1 = false"></u-datetime-picker>
</view>
</template>
<script>
import {
Toast
} from '../../libs/uniApi'
import {
getPersonInfoApi,
appexpensecate,
appexpenseflow,
userdepartment,
getemployee,
addinvoice,
invoicecate,
appflow_check,
invoiceview,
invoiceflow
} from '@/api/oa.js'
import lsjUpload from '@/uni_modules/lsj-upload/components/lsj-upload/lsj-upload.vue'
import {
FILE_URL
} from '@/api/file.js'
export default {
components: {
lsjUpload
},
data() {
return {
selected: "2",
defaultIndex: [0, 0, 0],
defaultIndex1: [0, 0, 0],
timestamp: '',
personInfo: {},
company: '',
listobj: {},
project1: '',
project2: '',
mscontent: '',
timeShow: false,
timeShow1: false,
branchShow: false,
flowPathShow: false,
leavaTypeShow: false,
leavaTypeShow1: false,
leavaTypeShow2: false,
branchColumns: [],
branchColumns1: [],
flowPathSheet: [],
actions4: [],
branchShow1: false,
flowPath: '',
columns: [],
check_admin_name: '',
copy_names: '',
isshow: true,
columns1: [{
name: '增值税专用发票',
id: 1,
},
{
name: '普通发票',
id: 2,
}, {
name: '专用发票',
id: 3
}
],
list: [{
cate_title: "",
amount: '',
remarks: ''
}],
fileOption: {},
files: new Map(),
fileArray: [],
check_record: [],
dnum: 0,
check: '',
admin_name: ""
}
},
onLoad(option) {
this.detail(option.type)
},
onShow() {
this.fileOption = {
url: FILE_URL,
name: 'file',
header: {
token: this.$store.state.app.token
}
},
// 获取当前时间戳
this.timestamp = Date.parse(new Date());
// this.getlist()
this.getlist1()
this.getDocumentList()
this.getDocumentList1()
},
methods: {
async detail(id) {
let res = await invoiceview({
id: id
})
this.listobj = res.data.detail
this.project1 = this.columns1.find(obj => obj.id === res.data.detail.type).name;
this.project2 = this.actions4.find(obj => obj.id === res.data.detail.invoice_subject).name;
this.check_record = res.data.check_record
this.admin_name = res.data.detail.check_user
this.copy_names = res.data.detail.copy_user
this.selected = res.data.detail.type.toString()
if (res.data.detail.type == 2) {
this.isshow = false
} else {
this.isshow = true
}
},
reset() {
this.list = [{
name: "",
num: ''
}],
this.listobj = {}
this.fileArray = []
this.copy_names = ''
this.flowPath = ''
this.check_admin_name = ''
},
async getDocumentList1() {
let res = await invoicecate()
this.actions4 = res.data.map((step, index) => {
return {
name: step.title,
id: step.id,
};
});
},
//获取部门
async getDocumentList() {
const res = await userdepartment()
const deArr = res.data
let codelist = [
[], //顶级部门
[], //次级部门
[] // 负责人
]
codelist[0] = res.data.map((item) => { // 赋值
return {
id: item.id,
name: item.title
}
})
codelist[1] = res.data[0].children.map((item) => { // 赋值
return {
id: item.id,
name: item.title
}
})
let dat = await getemployee({
did: codelist[1][0].id
})
codelist[2] = dat.data.map((item) => {
return {
id: item.id,
name: item.name
}
})
this.$forceUpdate()
this.$nextTick(() => {
this.branchColumns = codelist
this.branchColumns1 = codelist
this.branchColumns2 = codelist
})
},
//流程审批
async appflowcheck() {
let data = {
id: this.listobj.id,
type: 3,
check_node: this.check,
content: this.mscontent,
check: 2,
check_admin_ids: this.listobj.check_admin_ids
}
let res = await appflow_check(data)
Toast(res.msg)
},
async appflowcheck1() {
console.log(this.listobj)
let data = {
id: this.listobj.id,
type: 3,
check_node: this.check,
check: 1,
content: this.mscontent,
check_admin_ids: this.listobj.check_admin_ids
}
let res = await appflow_check(data)
console.log(res)
if (res.code == 0) {
uni.navigateBack({
delta: 1
})
}
Toast(res.msg)
},
//监听人员加载数据
async columnCode(e) {
if (e.columnIndex == 1) {
let arr1 = []
let dat = await getemployee({
did: this.branchColumns[e.columnIndex][e.index].id
})
if (dat.data.length > 0) {
const newColumn = dat.data.map((item) => {
return {
id: item.id,
name: item.name
}
})
// 使用 Vue.set 或 this.$set 方法将新数组赋值给 columns3 数组对应位置
this.$set(this.branchColumns, 2, newColumn);
}
}
},
//监听人员加载数据
async columnCode1(e) {
if (e.columnIndex == 1) {
let arr1 = []
let dat = await getemployee({
did: this.branchColumns1[e.columnIndex][e.index].id
})
if (dat.data.length > 0) {
const newColumn = dat.data.map((item) => {
return {
id: item.id,
name: item.name
}
})
// 使用 Vue.set 或 this.$set 方法将新数组赋值给 columns3 数组对应位置
this.$set(this.branchColumns1, 2, newColumn);
}
}
},
//选择是否结束
deliveryWayChangetwo1(e) {
console.log(e)
this.check = e.detail.value
},
deliveryWayChangetwo(e) {
this.listobj.type = e.detail.value
},
//弹窗显示
leavaShow(item, i) {
this.dnum = i
this.leavaTypeShow = true
},
leavaShow1() {
this.leavaTypeShow1 = true
},
branchConfirm(e) {
// console.log('confirm', e, e.value[2].name)
this.check_admin_name = e.value[2].name
this.listobj.check_admin_ids = e.value[2].id
this.branchShow = false
},
branchConfirm1(e) {
console.log('confirm', e, e.value[2].name)
if (this.listobj.copy_uids) {
this.listobj.copy_uids += e.value[2].id
} else {
this.listobj.copy_uids = e.value[2].id
}
this.copy_names += e.value[2].name + ','
this.branchShow1 = false
},
async submiteBtn() {
console.log(this.list)
let data = {
id: this.listobj.id,
type: 3,
check: 3,
content: this.mscontent,
}
let res = await appflow_check(data)
// console.log(res)
Toast(res.msg)
// const res = await appexpense(this.listobj)
Toast('提交成功')
},
bianjiBtn() {
uni.navigateTo({
url: '/pages/invoice/bianji?type=' + this.listobj.id
})
},
async getlist() {
const res = await appexpensecate()
// this.personInfo = res.data
const reformattedData = res.data.map(item => {
return {
name: item.title,
id: item.id
};
});
this.columns = reformattedData
},
async getlist1() {
const res = await invoiceflow()
this.flowPathSheet = res.data
// console.log('个人信息2', res.data);
},
flowPathSelect(value) {
this.flowPath = value.name
this.flow_id = value.id
},
/** 类型 */
leavaType(e) {
this.list[this.dnum].cate_title = e.name
this.list[this.dnum].id = e.id
this.leavaTypeShow = false
},
leavaType1(e) {
this.project2 = e.name
this.listobj.invoice_subject = e.id
this.leavaTypeShow1 = false
},
leavaType2(e) {
this.project1 = e.name
this.listobj.invoice_type = e.id
this.leavaTypeShow1 = false
},
branchShowclose() {
this.branchShow = false
},
branchShowclose1() {
this.branchShow1 = false
},
/**
* 某文件上传结束回调(成功失败都回调)
* @param {Object} item 当前上传完成的文件
*/
onuploadEnd(item) {
console.log(`${item.name}已上传结束,上传状态=${item.type}`);
if (item['responseText']) {
this.files.get(item.name).responseText = JSON.parse(item.responseText);
}
// 更新当前窗口状态变化的文件
this.files.set(item.name, item);
let arr1 = this.files.get(item.name).responseText
this.fileArray.push(arr1.data)
// 强制更新视图
this.$forceUpdate();
},
/**
* 上传进度回调
* 如果网页上md文档没有渲染出事件名称onprogre请复制代码的小伙伴自行添加上哈没有哪个事件是只(item)的
* @param {Object} item 当前正在上传的文件
*/
onprogre(item) {
console.log('打印对象', JSON.stringify(this.files.get(item.name)));
// 更新当前状态变化的文件
this.files.set(item.name, item);
// 强制更新视图
this.$forceUpdate();
},
/**
* 文件选择回调
* @param {Object} files 已选择的所有文件Map集合
*/
changeFile(files) {
console.log('当前选择的文件列表:', JSON.stringify([...files.values()]));
// 更新选择的文件
this.files = files
console.log(files.values())
// 强制更新视图
this.$forceUpdate();
},
/**
* 指定上传某个文件
* @param {Object} name 带后缀名的文件名称
*/
resetUpload(name) {
this.$refs.lsjUpload.upload(name);
},
},
onPullDownRefresh() {
uni.stopPullDownRefresh()
}
}
</script>
<style lang="scss">
.leave_request {
position: relative;
padding-bottom: 100px;
}
.leave_box,
.flow_path {
width: 100%;
padding: 0 28.07rpx;
background: #fff;
margin-bottom: 35.09rpx;
padding-bottom: 28.07rpx;
}
.bot_btn {
position: fixed;
bottom: 0;
left: 0;
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
height: 87.72rpx;
>view {
width: 50%;
text-align: center;
line-height: 87.72rpx;
}
.reset {
background-color: #fff;
}
.submit_btn {
color: #fff;
height: 87.72rpx;
background: $theme-oa-color;
}
}
.leava_type {
height: 100rpx;
border-bottom: 1px solid #999;
.title {
font-size: 31.58rpx;
}
}
.cont_cell {
display: flex;
align-items: center;
width: 100%;
min-height: 87.72rpx;
border-bottom: 1px solid #f7f7f7;
.title {
font-size: 31.58rpx;
}
}
// 审批流程
.audit_process {
.process_item {
position: relative;
height: 100%;
margin: 17.54rpx 0;
}
:last-child {
.circle {
&::before {
display: none;
}
}
}
.tag {
font-size: 21.05rpx;
color: #fff;
padding: 0 4px;
margin-left: 10.53rpx;
background-color: #3c9cff;
border-radius: 2px;
}
.verifier {
margin: 17.54rpx 0;
}
}
.circle {
width: 31.58rpx;
height: 31.58rpx;
background-color: #fff;
border: 2px solid #34A853;
border-radius: 50%;
margin: 0 5px;
display: flex;
flex-direction: column;
align-items: center;
&::before {
content: "";
display: block;
position: absolute;
clear: both;
width: 1px;
height: 100%;
background-color: rgba(204, 204, 204, 0.5);
margin: 31.58rpx;
}
}
// 附件
.upload_box {
padding: 17.54rpx;
background-color: #F7F7F7;
border-radius: 4px;
.title {
font-size: 28.07rpx;
}
.text {
margin-top: 7.02rpx;
font-size: 21.05rpx;
color: #999;
}
}
.record {
position: relative;
margin-bottom: 14.04rpx;
.circle {
width: 31.58rpx;
height: 31.58rpx;
background-color: #fff;
border: 2px solid #34A853;
border-radius: 50%;
margin: 5px;
display: flex;
flex-direction: column;
align-items: center;
&::before {
content: "";
display: block;
position: absolute;
clear: both;
width: 1px;
height: 100%;
background-color: rgba(204, 204, 204, 0.5);
margin: 31.58rpx;
}
}
.text {
flex: 1;
margin-left: 7.02rpx;
}
}
.file_name {
width: 526.32rpx;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.file {
padding: 17.54rpx;
border-radius: 4px;
border: 1px solid #F2F2F2;
margin: 17.54rpx 0;
.file_size {
margin-top: 7.02rpx;
}
.file_size,
.upload_people {
font-size: 21.05rpx;
color: #999;
}
}
</style>