DIGITAL_MANAGEMENT
/
finance
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

我的历史申请

apply
aBin 4 years ago
parent
3869ff242e 7bc5def9b3
commit
b6f2d4006e
3 changed files with 535 additions and 505 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 234
      pages/Initiate-application.vue
  2. 16
      pages/application-details.vue
  3. 4
      plugins/vant.js

234
pages/Initiate-application.vue
View File

@ -1,11 +1,7 @@
<template> <template>
<div> <div>
<!-- 导航返回上一页 --> <!-- 导航返回上一页 -->
<van-nav-bar <van-nav-bar title="发起申请" left-arrow @click-left="onClickLeft" />
title="发起申请"
left-arrow
@click-left="onClickLeft"
/>
<!-- 申请发票需要输入的数据 --> <!-- 申请发票需要输入的数据 -->
<div class="bg-white pb-3"> <div class="bg-white pb-3">
<div class="text-gray-500 px-4 py-3 font-semibold">发票信息</div> <div class="text-gray-500 px-4 py-3 font-semibold">发票信息</div>
@ -18,9 +14,19 @@
<span class="text-gray-500">上传票据凭证 </span> <span class="text-gray-500">上传票据凭证 </span>
<span class="text-gray-400 text-xs">(仅支持ipg格式)</span> <span class="text-gray-400 text-xs">(仅支持ipg格式)</span>
</div> </div>
<van-button plain type="primary" size="mini" @click="data.isInvoice = false">手动输入</van-button> <van-button
plain
type="primary"
size="mini"
@click="data.isInvoice = false"
>手动输入</van-button
>
</div> </div>
<div class="text-center border-b w-52 h-24 bg-gray-100 border-dashed border-2" @click="uploadBill" v-show="!data.isSuccess"> <div
class="text-center border-b w-52 h-24 bg-gray-100 border-dashed border-2"
@click="uploadBill"
v-show="!data.isSuccess"
>
<p class="text-gray-400 text-xl pt-3">+</p> <p class="text-gray-400 text-xl pt-3">+</p>
<p class="text-gray-400 text-xs">上传并识别凭证</p> <p class="text-gray-400 text-xs">上传并识别凭证</p>
</div> </div>
@ -36,7 +42,7 @@
/> />
</div> </div>
</div> </div>
</div > </div>
<!-- 手动输入信息 --> <!-- 手动输入信息 -->
<div v-show="!data.isInvoice"> <div v-show="!data.isInvoice">
<van-field <van-field
@ -75,10 +81,14 @@
size="mini" size="mini"
v-for="item in data.reviewerList" v-for="item in data.reviewerList"
:key="item.userId" :key="item.userId"
:type="data.checkerList.find(checker => checker === item.userId) ? 'primary' : 'default'" :type="
data.checkerList.find(checker => checker === item.userId)
? 'primary'
: 'default'
"
@click="handleSelectChecker(item.userId)" @click="handleSelectChecker(item.userId)"
> >
{{item.name}} {{ item.name }}
</van-button> </van-button>
</div> </div>
</div> </div>
@ -118,10 +128,7 @@
disabled disabled
/> />
<van-popup v-model:show="data.projectName" round position="bottom"> <van-popup v-model:show="data.projectName" round position="bottom">
<van-cascader <van-cascader active-color="#1989fa" class="p-0" />
active-color="#1989fa"
class="p-0"
/>
</van-popup> </van-popup>
<!-- 所属任务的 --> <!-- 所属任务的 -->
<van-field <van-field
@ -135,10 +142,7 @@
disabled disabled
/> />
<van-popup v-model:show="data.taskName" round position="bottom"> <van-popup v-model:show="data.taskName" round position="bottom">
<van-cascader <van-cascader active-color="#1989fa" class="p-0" />
active-color="#1989fa"
class="p-0"
/>
</van-popup> </van-popup>
<!-- 类目选择 --> <!-- 类目选择 -->
<van-field <van-field
@ -178,10 +182,19 @@
<!-- 个人手动申请 --> <!-- 个人手动申请 -->
<div v-show="!data.isInvoice"> <div v-show="!data.isInvoice">
<div class="pl-2"> <div class="pl-2">
<van-cell title="单元格" is-link :value="data.personalType" required/> <van-cell
<van-cell title="单元格" is-link :value="data.personalCategory" required/> title="单元格"
is-link
:value="data.personalType"
required
/>
<van-cell
title="单元格"
is-link
:value="data.personalCategory"
required
/>
</div> </div>
</div> </div>
</div> </div>
<!-- 提交人信息 --> <!-- 提交人信息 -->
@ -218,15 +231,15 @@
</div> </div>
</template> </template>
<script setup> <script setup>
import {ref, reactive} from 'vue' import { ref, reactive } from 'vue';
// import useApplication from 'hooks/useApplication'; // import useApplication from 'hooks/useApplication';
import { queryChecker } from 'apis/member' import { queryChecker } from 'apis/member';
import { queryType } from 'apis/finance' import { queryType } from 'apis/finance';
// const getApplication = useApplication(); // const getApplication = useApplication();
const projectName = useProjectName() const projectName = useProjectName();
const taskName = useTaskName() const taskName = useTaskName();
const projectId = useProjectId() const projectId = useProjectId();
const data = reactive({ const data = reactive({
isInvoice: true, isInvoice: true,
remark: '', remark: '',
@ -234,49 +247,49 @@ const data = reactive({
invoiceInfo: [ invoiceInfo: [
{ {
name: '发票代码', name: '发票代码',
values:0, values: 0,
label: 'invoiceCode' label: 'invoiceCode',
}, },
{ {
name: '发票号码', name: '发票号码',
values:1, values: 1,
label: 'invoiceNumber' label: 'invoiceNumber',
}, },
{ {
name: '合计金额(元)', name: '合计金额(元)',
values:2, values: 2,
label: 'money' label: 'money',
}, },
{ {
name: '税额(元)', name: '税额(元)',
values:3, values: 3,
label: 'taxMoney' label: 'taxMoney',
}, },
{ {
name: '开票日期', name: '开票日期',
values:4, values: 4,
label: 'invoiceTime' label: 'invoiceTime',
}, },
{ {
name: '发票备注信息', name: '发票备注信息',
values:5, values: 5,
label: 'remark' label: 'remark',
}, },
], ],
reviewerList: [], // 审核人数组 reviewerList: [], // 审核人数组
checkerList: [], // 默认的审核人 checkerList: [], // 默认的审核人
applyData: [ applyData: [
{ {
applicant:'代用名1', applicant: '代用名1',
money:100, money: 100,
time:'2021/12/31 12:31', time: '2021/12/31 12:31',
type: 1 type: 1,
}, },
{ {
applicant:'代用名2', applicant: '代用名2',
money:100, money: 100,
time:'2021/12/31 12:31', time: '2021/12/31 12:31',
type: 2 type: 2,
}, },
], // 申请的记录 ], // 申请的记录
isSuccess: false, // 上传票据是否成功 isSuccess: false, // 上传票据是否成功
@ -303,73 +316,73 @@ const data = reactive({
applyNameOptions: [], applyNameOptions: [],
applyName: '', // 选择的名目的值 applyName: '', // 选择的名目的值
rowId: '', rowId: '',
}) });
// 发票信息 // 发票信息
function cahngeInvoiceList(e,item){ function cahngeInvoiceList(e, item) {
console.log('e: ', e.target.value,item); console.log('e: ', e.target.value, item);
} }
// 选择申请类型 // 选择申请类型
function finishApplyType(e){ function finishApplyType(e) {
data.showType = false; data.showType = false;
data.applyType = e; data.applyType = e;
const type = data.applyTypes.find((option) => option.name === e); const type = data.applyTypes.find(option => option.name === e);
data.typeId = type.id; data.typeId = type.id;
// 类目 // 类目
handleQueryType(data.typeId, 1) handleQueryType(data.typeId, 1);
} }
// 所属的类目 // 所属的类目
function finishApplyCategory(e){ function finishApplyCategory(e) {
data.showCategory = false; data.showCategory = false;
data.applyCategory = e; data.applyCategory = e;
const category = data.applyCategories.find((option) => option.name === e); const category = data.applyCategories.find(option => option.name === e);
data.categoryId = category.id; data.categoryId = category.id;
// 名目 // 名目
handleQueryType(data.categoryId, 2) handleQueryType(data.categoryId, 2);
} }
// 所属的名目 // 所属的名目
function finishApplyName(e){ function finishApplyName(e) {
data.showName = false; data.showName = false;
data.applyName = e; data.applyName = e;
const row = data.applyNames.find((option) => option.name === e); const row = data.applyNames.find(option => option.name === e);
data.rowId = row.id; data.rowId = row.id;
} }
// 检查被选中的审核人的状态 // 检查被选中的审核人的状态
function handleSelectChecker(id){ function handleSelectChecker(id) {
const target = data.checkerList.find(item =>item === id) const target = data.checkerList.find(item => item === id);
if(target){ if (target) {
data.checkerList = data.checkerList.filter(item =>item !== id) data.checkerList = data.checkerList.filter(item => item !== id);
}else{ } else {
data.checkerList.push(id) data.checkerList.push(id);
} }
} }
// 上传票据事件 // 上传票据事件
function uploadBill(){ function uploadBill() {
//TODO:调取接口识别票据 //TODO:调取接口识别票据
setTimeout(() =>{ setTimeout(() => {
data.titleHidden = false data.titleHidden = false;
data.isSuccess = true data.isSuccess = true;
},1000) }, 1000);
} }
/** /**
* 查询所有成员 * 查询所有成员
* @param { String } projectId * @param { String } projectId
*/ */
async function handleQueryChecker(){ async function handleQueryChecker() {
try { try {
const params = { const params = {
param:{ param: {
projectId: projectId.value projectId: projectId.value,
} },
} };
const res = await queryChecker(params) const res = await queryChecker(params);
data.reviewerList = res data.reviewerList = res;
} catch (error) { } catch (error) {
console.error('error: ', error); console.error('error: ', error);
} }
@ -380,71 +393,70 @@ async function handleQueryChecker(){
* @param { String } parentId 上级类型ID，默认为0 * @param { String } parentId 上级类型ID，默认为0
* @param { Number } type 类型：0申请类型 1类目 2名目 * @param { Number } type 类型：0申请类型 1类目 2名目
*/ */
async function handleQueryType(parentId, type){ async function handleQueryType(parentId, type) {
console.log('parentId: ', parentId); console.log('parentId: ', parentId);
try { try {
const params = { const params = {
param:{ param: {
parentId, parentId,
type, type,
},
};
const res = await queryType(params);
if (type === 0) {
data.applyTypes = res;
res.forEach(item => {
data.applyTypeOptions.push(item.name);
});
} }
if (type === 1) {
data.applyCategories = res;
res.forEach(item => {
data.applyCategoryOptions.push(item.name);
});
} }
const res = await queryType(params) if (type === 2) {
if(type === 0){ data.applyNames = res;
data.applyTypes = res res.forEach(item => {
res.forEach((item) => { data.applyNameOptions.push(item.name);
data.applyTypeOptions.push(item.name) });
})
}
if(type === 1){
data.applyCategories = res
res.forEach((item) => {
data.applyCategoryOptions.push(item.name)
})
}
if(type === 2){
data.applyNames = res
res.forEach((item) => {
data.applyNameOptions.push(item.name)
})
} }
} catch (error) { } catch (error) {
console.error('error: ', error); console.error('error: ', error);
} }
} }
onMounted(() =>{ onMounted(() => {
// 查询所有成员 // 查询所有成员
handleQueryChecker() handleQueryChecker();
// 查询费用申请类型 // 查询费用申请类型
handleQueryType(0, 0) handleQueryType(0, 0);
}) });
function onClickLeft(){ function onClickLeft() {
console.log(1) console.log(1);
} }
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.van-cell-group{ .van-cell-group {
padding:0 1rem; padding: 0 1rem;
} }
.van-cell{ .van-cell {
font-size: 15px; font-size: 15px;
} }
.bill-name{ .bill-name {
font-weight: 600; font-weight: 600;
color: #6F6F6F; color: #6f6f6f;
border-bottom: 1px solid #eee; border-bottom: 1px solid #eee;
padding: 0.75rem 0px; padding: 0.75rem 0px;
} }
.van-button{ .van-button {
border-radius: 0.2rem; border-radius: 0.2rem;
} }
.button{ .button {
border-radius: 1rem; border-radius: 1rem;
padding: 0 0.75rem; padding: 0 0.75rem;
margin: 0.5rem ; margin: 0.5rem;
} }
</style> </style>

16
pages/application-details.vue
View File

@ -64,6 +64,7 @@
</template> </template>
<script setup> <script setup>
import { getApplyDetail } from 'apis/finance'
// 审核人数据 // 审核人数据
const checkerList = ref([ const checkerList = ref([
{ {
@ -156,6 +157,21 @@ const submitter = ref([
function onClickLeft(){ function onClickLeft(){
console.log("上一页") console.log("上一页")
} }
/**
* 查询申请详情
* @param { Number } applyId 申请记录id
*/
async function handleApplyDetail(){
try {
const params = {param : { applyId: '1485797754654695424' }}
await getApplyDetail(params)
} catch (error) {
console.error('error: ', error);
}
}
handleApplyDetail()
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>

4
plugins/vant.js
View File

@ -24,6 +24,7 @@ import {
Popover, Popover,
Dialog, Dialog,
Picker, Picker,
Loading,
} from 'vant'; } from 'vant';
import { defineNuxtPlugin } from '#app'; import { defineNuxtPlugin } from '#app';
@ -51,5 +52,6 @@ export default defineNuxtPlugin(nuxtApp => {
.use(Empty) .use(Empty)
.use(Popover) .use(Popover)
.use(Dialog) .use(Dialog)
.use(Picker); .use(Picker)
.use(Loading);
}); });

Write Preview
Loading…
Cancel
Save