main-20240105
赵夫琳
8 months ago
parent
ef2ad43206
commit
4cafa2a3b8
@ -0,0 +1,54 @@
|
|||||||
|
import request from '@/plugin/axios'
|
||||||
|
|
||||||
|
// 创建对公付款
|
||||||
|
export function createVendorPayment(data) {
|
||||||
|
return request({
|
||||||
|
url: '/bs/vendor-payment/create',
|
||||||
|
method: 'post',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 更新对公付款
|
||||||
|
export function updateVendorPayment(data) {
|
||||||
|
return request({
|
||||||
|
url: '/bs/vendor-payment/update',
|
||||||
|
method: 'put',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 删除对公付款
|
||||||
|
export function deleteVendorPayment(id) {
|
||||||
|
return request({
|
||||||
|
url: '/bs/vendor-payment/delete?id=' + id,
|
||||||
|
method: 'delete'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获得对公付款
|
||||||
|
export function getVendorPayment(id) {
|
||||||
|
return request({
|
||||||
|
url: '/bs/vendor-payment/get?id=' + id,
|
||||||
|
method: 'get'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获得对公付款分页
|
||||||
|
export function getVendorPaymentPage(query) {
|
||||||
|
return request({
|
||||||
|
url: '/bs/vendor-payment/page',
|
||||||
|
method: 'get',
|
||||||
|
params: query
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 导出对公付款 Excel
|
||||||
|
export function exportVendorPaymentExcel(query) {
|
||||||
|
return request({
|
||||||
|
url: '/bs/vendor-payment/export-excel',
|
||||||
|
method: 'get',
|
||||||
|
params: query,
|
||||||
|
responseType: 'blob'
|
||||||
|
})
|
||||||
|
}
|
||||||
@ -0,0 +1,54 @@
|
|||||||
|
import request from '@/plugin/axios'
|
||||||
|
|
||||||
|
// 创建对公收款
|
||||||
|
export function createVendorReceipt(data) {
|
||||||
|
return request({
|
||||||
|
url: '/bs/vendor-receipt/create',
|
||||||
|
method: 'post',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 更新对公收款
|
||||||
|
export function updateVendorReceipt(data) {
|
||||||
|
return request({
|
||||||
|
url: '/bs/vendor-receipt/update',
|
||||||
|
method: 'put',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 删除对公收款
|
||||||
|
export function deleteVendorReceipt(id) {
|
||||||
|
return request({
|
||||||
|
url: '/bs/vendor-receipt/delete?id=' + id,
|
||||||
|
method: 'delete'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获得对公收款
|
||||||
|
export function getVendorReceipt(id) {
|
||||||
|
return request({
|
||||||
|
url: '/bs/vendor-receipt/get?id=' + id,
|
||||||
|
method: 'get'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获得对公收款分页
|
||||||
|
export function getVendorReceiptPage(query) {
|
||||||
|
return request({
|
||||||
|
url: '/bs/vendor-receipt/page',
|
||||||
|
method: 'get',
|
||||||
|
params: query
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 导出对公收款 Excel
|
||||||
|
export function exportVendorReceiptExcel(query) {
|
||||||
|
return request({
|
||||||
|
url: '/bs/vendor-receipt/export-excel',
|
||||||
|
method: 'get',
|
||||||
|
params: query,
|
||||||
|
responseType: 'blob'
|
||||||
|
})
|
||||||
|
}
|
||||||
@ -0,0 +1,253 @@
|
|||||||
|
<template>
|
||||||
|
<div id="orderHeader">
|
||||||
|
<div class="hf-l-seacrch" v-if="isActSearch">
|
||||||
|
<form action="/">
|
||||||
|
<van-search v-model="listQuery.contractNumber" shape="round" show-action placeholder="请输入合同编号" :clearable="false" @search="onKeywordSearch" @cancel="onKeywordCancel" />
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
<div class="header-filter" :style="isActSearch ? 'padding: 0 0 0 0.5rem' : ''">
|
||||||
|
<div class="hf-l-list" v-show="!isActSearch">
|
||||||
|
<van-dropdown-menu class="hf-l-list-menu">
|
||||||
|
<!-- 供应商名称 -->
|
||||||
|
<van-dropdown-item title="供应商名称" :title-class="isHtab1 ? 'common-act-color' : ''" @open="handleDropOpen()" ref="vanDropItem1">
|
||||||
|
<div class="hf-drop-view">
|
||||||
|
<div class="hf-drop-contain">
|
||||||
|
<div class="hr-drop-filter-item" @click.stop="handleClass1(item.id)" v-for="item in spList" :key="item.value">
|
||||||
|
<van-icon v-if="listQuery.supplierId && listQuery.supplierId == item.value" name="success" color="#0088FE" />
|
||||||
|
<span :class="{'hr-drop-filter-item-act': listQuery.supplierId && listQuery.supplierId == item.id }">{{item.companyAme}}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="common-double-button">
|
||||||
|
<van-button class="common-double-button-l" @click="handleReset()">重置</van-button>
|
||||||
|
<van-button class="common-double-button-r" @click="handleConfirm">确定</van-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</van-dropdown-item>
|
||||||
|
<!-- 类别 -->
|
||||||
|
<van-dropdown-item title="合同状态" :title-class="isHtab4 ? 'common-act-color' : ''" @open="handleDropOpen()" ref="vanDropItem4">
|
||||||
|
<div class="hf-drop-view">
|
||||||
|
<div class="hf-drop-contain">
|
||||||
|
<div class="hr-drop-filter-item" @click.stop="handleClass2(item.value)" v-for="item in stateList" :key="item.value">
|
||||||
|
<van-icon v-if="listQuery.contractType && listQuery.contractType == item.value" name="success" color="#0088FE" />
|
||||||
|
<span :class="{'hr-drop-filter-item-act': listQuery.contractType && listQuery.contractType == item.value }">{{item.label}}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="common-double-button">
|
||||||
|
<van-button class="common-double-button-l" @click="handleReset()">重置</van-button>
|
||||||
|
<van-button class="common-double-button-r" @click="handleConfirm">确定</van-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</van-dropdown-item>
|
||||||
|
</van-dropdown-menu>
|
||||||
|
</div>
|
||||||
|
<div class="hf-r-list" v-show="!isActSearch">
|
||||||
|
<div class="hf-r-list-item" @click="handleSearch">
|
||||||
|
<div class="hf-r-icon-bg">
|
||||||
|
<van-icon name="search" class="hf-r-icon" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<van-popup position="bottom" safe-area-inset-bottom v-model="moreFilterShow" :lock-scroll="true" round get-container="#app" lazy-render>
|
||||||
|
<div class="common-popup moreContain">
|
||||||
|
<div class="common-popup-header">
|
||||||
|
<div></div>
|
||||||
|
<div class="common-popup-header-title">
|
||||||
|
<span>筛选</span>
|
||||||
|
</div>
|
||||||
|
<div class="common-popup-header-close">
|
||||||
|
<van-icon name="cross" @click="moreFilterShow = false" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="common-popup-body moreContain-body">
|
||||||
|
<van-form ref="filterForm" :show-error-message="false" validate-trigger="" :submit-on-enter="false">
|
||||||
|
<RePick v-model="listQuery.remark" label="bumen" :list="areaTree" isLastSelect isCascader isShowSearch title="行程" titleKey="name" isCascaderAllLevelNameSymnol isCell clearable />
|
||||||
|
</van-form>
|
||||||
|
</div>
|
||||||
|
<div class="common-popup-footer">
|
||||||
|
<van-button style="width: 8rem; margin-right: 1rem;" round @click="handleMoreReset">重置</van-button>
|
||||||
|
<van-button type="info" style="width: 8rem;" round @click.stop="handleMoreConfirm">确认</van-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</van-popup>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { mapState, mapGetters } from 'vuex'
|
||||||
|
import { getDictDatas, DICT_TYPE } from "@/utils/dict";
|
||||||
|
import { dayTextFormatter } from '@/utils'
|
||||||
|
import dayjs from 'dayjs'
|
||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
listType: String, // 'detail' 详情
|
||||||
|
paramProp: Object,
|
||||||
|
spList: Array, // 供应商列表
|
||||||
|
},
|
||||||
|
components: {
|
||||||
|
RePick: () => import('@/components/ReComponents/RePick'),
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
defaultDate: null,
|
||||||
|
dayTextFormatter: dayTextFormatter,
|
||||||
|
isActSearch: false,
|
||||||
|
moreFilterShow: false,
|
||||||
|
isSearch: false,
|
||||||
|
// courseStateList: [
|
||||||
|
// { text: '全部', id: 25 },
|
||||||
|
// { text: '已取消', id: 0 },
|
||||||
|
// { text: '生效中', id: 1 }
|
||||||
|
// ],
|
||||||
|
listQuery: {},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
isHtab1() {
|
||||||
|
let isShow = false
|
||||||
|
if (this.paramProp.supplierId) isShow = true
|
||||||
|
return isShow
|
||||||
|
},
|
||||||
|
isHtab4() {
|
||||||
|
let isShow = false
|
||||||
|
if (this.paramProp.contractType) isShow = true
|
||||||
|
return isShow
|
||||||
|
},
|
||||||
|
areaTree() {
|
||||||
|
return this.$store.getters.areaTree
|
||||||
|
},
|
||||||
|
isMoreAct() {
|
||||||
|
let bol = false
|
||||||
|
const listQuery = this.paramProp || {}
|
||||||
|
if (listQuery.remark) {
|
||||||
|
bol = true
|
||||||
|
}
|
||||||
|
return bol
|
||||||
|
},
|
||||||
|
stateList() {
|
||||||
|
return getDictDatas(DICT_TYPE.BS_EXPENSE_APPLY_STATUS) || []
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
|
||||||
|
methods: {
|
||||||
|
// 日历重置
|
||||||
|
handleDateReset() {
|
||||||
|
this.listQuery.startDate = null
|
||||||
|
this.listQuery.endDate = null
|
||||||
|
this.defaultDate = null
|
||||||
|
this.$refs.vanCalendar && this.$refs.vanCalendar.reset()
|
||||||
|
},
|
||||||
|
handleDateSelect(val) {
|
||||||
|
if (val.filter(item => item).length === 2) {
|
||||||
|
this.listQuery.startDate = `${dayjs(val[0]).format('YYYY/MM/DD')} 00:00:00 `
|
||||||
|
this.listQuery.endDate = `${dayjs(val[1]).format('YYYY/MM/DD')} 23:59:59 `
|
||||||
|
}
|
||||||
|
},
|
||||||
|
handleQuickDate(e) {
|
||||||
|
this.defaultDate = [dayjs(e.time[0]).toDate(), dayjs(e.time[1]).toDate()]
|
||||||
|
this.listQuery.startDate = `${e.time[0]} 00:00:00`
|
||||||
|
this.listQuery.endDate = `${e.time[1]} 23:59:59`
|
||||||
|
},
|
||||||
|
handleConfirm() {
|
||||||
|
this.$refs.vanDropItem4 && this.$refs.vanDropItem4.toggle(false)
|
||||||
|
this.$refs.vanDropItem1 && this.$refs.vanDropItem1.toggle(false)
|
||||||
|
this.$emit('onListQuery', this.listQuery)
|
||||||
|
},
|
||||||
|
|
||||||
|
onKeywordCancel() {
|
||||||
|
this.listQuery.contractNumber = null
|
||||||
|
this.isActSearch = false
|
||||||
|
this.isSearch = false
|
||||||
|
this.onKeywordSearch()
|
||||||
|
},
|
||||||
|
onKeywordSearch() {
|
||||||
|
this.$emit('onListQuery', this.listQuery)
|
||||||
|
},
|
||||||
|
|
||||||
|
|
||||||
|
// 处理供应商
|
||||||
|
handleClass1(val) {
|
||||||
|
this.listQuery.supplierId = val
|
||||||
|
},
|
||||||
|
handleClass2(val) {
|
||||||
|
this.listQuery.contractType = val
|
||||||
|
},
|
||||||
|
// 处理状态 type : 1 状态 2 缴费类型 3 换班类型
|
||||||
|
handleState(val, type) {
|
||||||
|
if (type == 1) {
|
||||||
|
const i = this.listQuery.states.findIndex(item => item === val)
|
||||||
|
if (i > -1) {
|
||||||
|
this.listQuery.states.splice(i, 1)
|
||||||
|
} else {
|
||||||
|
this.listQuery.states.push(val)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if (type == 2 || type == 3) {
|
||||||
|
const i = this.listQuery.types.findIndex(item => item === val)
|
||||||
|
if (i > -1) {
|
||||||
|
this.listQuery.types.splice(i, 1)
|
||||||
|
} else {
|
||||||
|
this.listQuery.types.push(val)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
handleInit() {
|
||||||
|
this.listQuery = {
|
||||||
|
...this.paramProp
|
||||||
|
}
|
||||||
|
if (!(this.listQuery.startDate && this.listQuery.endDate)) {
|
||||||
|
this.handleDateReset()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
handleDropOpen() {
|
||||||
|
this.handleInit()
|
||||||
|
},
|
||||||
|
onSearch() {
|
||||||
|
this.handleConfirm()
|
||||||
|
},
|
||||||
|
// 搜索
|
||||||
|
handleSearch() {
|
||||||
|
this.handleInit()
|
||||||
|
this.listQuery.contractNumber = this.paramProp.contractNumber
|
||||||
|
this.isActSearch = true
|
||||||
|
},
|
||||||
|
|
||||||
|
handleSearchCancel() {
|
||||||
|
this.listQuery.contractNumber = null
|
||||||
|
this.isActSearch = false
|
||||||
|
this.onKeywordSearch()
|
||||||
|
},
|
||||||
|
// 更多筛选
|
||||||
|
handleMoreFilter() {
|
||||||
|
this.handleInit()
|
||||||
|
this.moreFilterShow = true
|
||||||
|
},
|
||||||
|
|
||||||
|
// 更多重置
|
||||||
|
handleMoreReset() {
|
||||||
|
this.listQuery.remark = null
|
||||||
|
},
|
||||||
|
handleMoreConfirm() {
|
||||||
|
this.$emit('onListQuery', this.listQuery)
|
||||||
|
this.moreFilterShow = false
|
||||||
|
},
|
||||||
|
handleReset() {
|
||||||
|
this.listQuery.contractType = null
|
||||||
|
this.listQuery.supplierId = null
|
||||||
|
},
|
||||||
|
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
@import './index.scss';
|
||||||
|
</style>
|
||||||
@ -0,0 +1,223 @@
|
|||||||
|
<template>
|
||||||
|
<!-- 中标审批列表 -->
|
||||||
|
<div>
|
||||||
|
<HeaderFilter :listType="listType" :spList="spList" @onListQuery="handleListQuery" :paramProp="listQuery" />
|
||||||
|
<RMList :moreLoading.sync="moreLoading" :refreshing.sync="refreshing" :finished.sync="finished" @onLoad="handleLoad" @onRefresh="handleRefresh" isMore :tableList="tableList">
|
||||||
|
<div>
|
||||||
|
<CorporatePaymentCard v-for="(item,index) in tableList" :key="item.id" :itemData="item" :listType="listType" @onUpdataInfo="handleUpdataInfo($event, index)" @onAllRefresh="handleAllRefresh" />
|
||||||
|
</div>
|
||||||
|
</RMList>
|
||||||
|
<div class="common-bottom-btns" style="bottom:8rem">
|
||||||
|
<div class="common-bottom-btn" @click="handleTopPage">
|
||||||
|
<img src="@/assets/images/icons/top.png" alt="">
|
||||||
|
<span>回到顶部</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="common-bottom-btns" v-hasPermi="['bs:supplier-contract:create']" style="bottom:10rem">
|
||||||
|
<div class="common-bottom-btn" @click="handleToAdd">
|
||||||
|
<img src="@/assets/images/icons/add.png" alt="">
|
||||||
|
<span>添加申请</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="common-bottom-btns" style="bottom:6rem">
|
||||||
|
<div class="common-bottom-btn" @click="handleBack">
|
||||||
|
<img src="@/assets/images/icons/home.png" alt="">
|
||||||
|
<span>返回首页</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { getScrollTop } from '@/utils'
|
||||||
|
import { getSupplierCompanyPage } from "@/api/bs/quotationSheet";
|
||||||
|
import { getVendorPaymentPage } from "@/api/bs/vendorPayment";
|
||||||
|
import { mapState } from 'vuex'
|
||||||
|
import dayjs from 'dayjs'
|
||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
listType: String // EnrollmentOrder: 报名订单 EnrollmentCollection: 报名收款 ShiftRecord: 换班记录 WaitPay: 待支付
|
||||||
|
},
|
||||||
|
components: {
|
||||||
|
HeaderFilter: () => import('./HeaderFilter.vue'),
|
||||||
|
RMList: () => import('@/components/ReComponents/RMList'),
|
||||||
|
CorporatePaymentCard: () => import('@/components/CorporatePaymentCard'),
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
height: 0,
|
||||||
|
moreLoading: false,
|
||||||
|
refreshing: false,
|
||||||
|
finished: false,
|
||||||
|
tableList: [],
|
||||||
|
spList: [],
|
||||||
|
listQuery: {
|
||||||
|
pageNo: 1,
|
||||||
|
pageSize: 10,
|
||||||
|
contractNumber: null,
|
||||||
|
status: null,
|
||||||
|
supplierId: null,
|
||||||
|
contractName: null,
|
||||||
|
contractType: null,
|
||||||
|
supplierName: null,
|
||||||
|
status: null,
|
||||||
|
amount: null,
|
||||||
|
receivedAmount: null,
|
||||||
|
projectId: null,
|
||||||
|
projectName: null,
|
||||||
|
startTime: [],
|
||||||
|
endTime: [],
|
||||||
|
departmentId: null,
|
||||||
|
signatoryId: null,
|
||||||
|
isCollect: null,
|
||||||
|
managerPhone: null,
|
||||||
|
approvalStatus: null,
|
||||||
|
files: null,
|
||||||
|
other: null,
|
||||||
|
createTime: [],
|
||||||
|
processInstanceId: null,
|
||||||
|
},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
...mapState({
|
||||||
|
singlePageSize: state => state.common.setting.singlePageSize,
|
||||||
|
pageSize: state => state.common.setting.pageSize,
|
||||||
|
})
|
||||||
|
},
|
||||||
|
activated() {
|
||||||
|
this.handleScrollInit()
|
||||||
|
},
|
||||||
|
deactivated() {
|
||||||
|
window.removeEventListener('scroll', this.handleScroll)
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.handleInit()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
handleBack() {
|
||||||
|
history.back()
|
||||||
|
},
|
||||||
|
handleInitSpList() {
|
||||||
|
let queryParams = {
|
||||||
|
pageNo: 1,
|
||||||
|
pageSize: this.singlePageSize,
|
||||||
|
}
|
||||||
|
getSupplierCompanyPage(queryParams).then((res) => {
|
||||||
|
this.spList = res.data.list || []
|
||||||
|
})
|
||||||
|
},
|
||||||
|
handleSetSingle(id) {
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
let listQuery = {
|
||||||
|
pageNo: 1,
|
||||||
|
pageSize: this.singlePageSize,
|
||||||
|
}
|
||||||
|
getVendorPaymentPage(listQuery).then((res) => {
|
||||||
|
let arr = (res.data && res.data.list || []).filter(item => item.id == id)
|
||||||
|
resolve(arr)
|
||||||
|
}).catch((err) => {
|
||||||
|
reject(err)
|
||||||
|
})
|
||||||
|
})
|
||||||
|
},
|
||||||
|
handleUpdataInfo(id, index) {
|
||||||
|
this.$loading(true, 'singleReset')
|
||||||
|
this.handleSetSingle(id).then(arr => {
|
||||||
|
if (arr.length) {
|
||||||
|
this.tableList.splice(index, 1, arr[0])
|
||||||
|
}
|
||||||
|
this.$loading(false, 'singleReset')
|
||||||
|
}).catch(() => {
|
||||||
|
this.$loading(false, 'singleReset')
|
||||||
|
})
|
||||||
|
},
|
||||||
|
handleListQuery(paramProp) {
|
||||||
|
this.listQuery = {
|
||||||
|
...paramProp,
|
||||||
|
invoiceDate: paramProp.startDate && [dayjs(paramProp.startDate).format('YYYY-MM-DD HH:ss:mm'), dayjs(paramProp.endDate).format('YYYY-MM-DD HH:ss:mm')]
|
||||||
|
}
|
||||||
|
this.finished = false
|
||||||
|
this.handleRefresh()
|
||||||
|
},
|
||||||
|
handleScroll() {
|
||||||
|
getScrollTop().then(height => {
|
||||||
|
this.height = height
|
||||||
|
})
|
||||||
|
},
|
||||||
|
handleScrollInit() {
|
||||||
|
window.addEventListener('scroll', this.handleScroll)
|
||||||
|
window.scrollTo(0, this.height)
|
||||||
|
// this.handleInit()
|
||||||
|
},
|
||||||
|
|
||||||
|
handleScrollToTop() {
|
||||||
|
window.scrollTo(0, 0)
|
||||||
|
this.height = 0
|
||||||
|
},
|
||||||
|
handleToAdd() {
|
||||||
|
this.$router.push({
|
||||||
|
path: '/supplier',
|
||||||
|
query: {
|
||||||
|
type: 'add'
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
handleAllRefresh() {
|
||||||
|
// this.getTableList('refresh')
|
||||||
|
this.handleRefresh()
|
||||||
|
},
|
||||||
|
handleInit() {
|
||||||
|
this.handleInitSpList()
|
||||||
|
this.getTableList('init')
|
||||||
|
},
|
||||||
|
|
||||||
|
handleTopPage() {
|
||||||
|
window.scrollTo(0, 0)
|
||||||
|
this.$nextTick(() => {
|
||||||
|
this.height = 0
|
||||||
|
})
|
||||||
|
},
|
||||||
|
handleRefresh() {
|
||||||
|
this.listQuery.pageNo = 1
|
||||||
|
this.finished = false
|
||||||
|
this.getTableList('refresh')
|
||||||
|
},
|
||||||
|
handleLoad() {
|
||||||
|
this.listQuery.pageNo += 1
|
||||||
|
this.getTableList('more')
|
||||||
|
},
|
||||||
|
|
||||||
|
getTableList(val) {
|
||||||
|
// const { shellIdsLocal, collegeInfoIdLocal, startDate, endDate, keyword, type, method, targets, usePersonId, teacherIds, chargePersonIds } = this.listQuery
|
||||||
|
const query = {
|
||||||
|
...this.listQuery
|
||||||
|
}
|
||||||
|
this.moreLoading = true
|
||||||
|
this.$loading(true, 'tableLoading')
|
||||||
|
getVendorPaymentPage(query).then(res => {
|
||||||
|
let resList = res.data && res.data.list || []
|
||||||
|
if (['init', 'refresh'].includes(val)) {
|
||||||
|
this.tableList = resList
|
||||||
|
this.handleScrollToTop()
|
||||||
|
} else {
|
||||||
|
this.tableList = this.tableList.concat(resList)
|
||||||
|
}
|
||||||
|
if (resList.length < this.pageSize) {
|
||||||
|
this.finished = true
|
||||||
|
}
|
||||||
|
}).finally(() => {
|
||||||
|
this.$nextTick(() => {
|
||||||
|
this.moreLoading = false
|
||||||
|
this.refreshing = false
|
||||||
|
this.$loading(false, 'tableLoading')
|
||||||
|
})
|
||||||
|
// this.$loading(false, `cTableLoading_${this.listType}`)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style scoped lang="scss">
|
||||||
|
// @import '~@/assets/style/common/list.scss';
|
||||||
|
</style>
|
||||||
@ -0,0 +1,163 @@
|
|||||||
|
$hf-contain-p: 0 1.2rem;
|
||||||
|
$hf-contain-f: 0.76rem;
|
||||||
|
$hf-high-color: #0088fe;
|
||||||
|
// 激活的颜色
|
||||||
|
$hf-high-color: #0088fe;
|
||||||
|
.header-filter {
|
||||||
|
.hf-r-icon-bg-act {
|
||||||
|
.van-icon {
|
||||||
|
color: $hf-high-color !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
background: #ffffff;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding: $hf-contain-p;
|
||||||
|
|
||||||
|
.hf-l-list {
|
||||||
|
.hf-l-list-menu {
|
||||||
|
/deep/.van-dropdown-menu__bar {
|
||||||
|
height: auto;
|
||||||
|
box-shadow: none;
|
||||||
|
|
||||||
|
.van-dropdown-menu__item {
|
||||||
|
flex: inherit;
|
||||||
|
margin-right: 1rem;
|
||||||
|
|
||||||
|
.van-dropdown-menu__title {
|
||||||
|
padding: 0.6rem 0.4rem 0.6rem 0;
|
||||||
|
font-size: $hf-contain-f;
|
||||||
|
|
||||||
|
&::after {
|
||||||
|
border: 1px solid;
|
||||||
|
padding: 0.1rem;
|
||||||
|
border-color: transparent transparent #333333 #333333;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.van-dropdown-menu__title--active {
|
||||||
|
color: $hf-high-color;
|
||||||
|
|
||||||
|
&::after {
|
||||||
|
border-color: transparent transparent $hf-high-color $hf-high-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.hf-r-list {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
.hf-r-list-item {
|
||||||
|
margin-left: 0.4rem;
|
||||||
|
|
||||||
|
.hf-r-icon-bg {
|
||||||
|
background: #d7d7d7;
|
||||||
|
width: 1.5rem;
|
||||||
|
height: 1.5rem;
|
||||||
|
border-radius: 1.5rem;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.hf-drop-view {
|
||||||
|
padding: $hf-contain-p;
|
||||||
|
padding-bottom: 0.8rem;
|
||||||
|
|
||||||
|
.hf-drop-contain {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
padding-bottom: 0.8rem;
|
||||||
|
|
||||||
|
.hr-drop-filter-item {
|
||||||
|
padding: $hf-contain-p;
|
||||||
|
font-size: $hf-contain-f;
|
||||||
|
width: 50%;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 0.8rem 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hr-drop-filter-item-act {
|
||||||
|
color: $hf-high-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 快捷筛选
|
||||||
|
.hf-drop-quick {
|
||||||
|
margin-top: 1rem;
|
||||||
|
|
||||||
|
.hf-drop-quick-item {
|
||||||
|
margin-bottom: 1.5rem;
|
||||||
|
|
||||||
|
.hf-drop-quick-title {
|
||||||
|
color: #333333;
|
||||||
|
font-size: 0.84rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hf-drop-quick-list {
|
||||||
|
display: flex;
|
||||||
|
margin: 0.6rem 0;
|
||||||
|
font-size: $hf-contain-f;
|
||||||
|
|
||||||
|
.hf-drop-quick-list-item {
|
||||||
|
border: 1px solid #f3f3f3;
|
||||||
|
background: #f3f3f3;
|
||||||
|
margin-right: 0.8rem;
|
||||||
|
padding: 0.4rem 0.6rem;
|
||||||
|
border-radius: 1rem;
|
||||||
|
transition: background-color, color 0.2s linear;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hf-drop-quick-list-item-act {
|
||||||
|
background: #ffffff;
|
||||||
|
color: $hf-high-color;
|
||||||
|
border: 1px solid $hf-high-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hf-drop-quick-list-item-checkbox {
|
||||||
|
margin-right: 1rem;
|
||||||
|
|
||||||
|
/deep/.van-checkbox__label {
|
||||||
|
margin-left: 0.2rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.hf-drop-quick-calendar {
|
||||||
|
/deep/.van-calendar__header {
|
||||||
|
box-shadow: none;
|
||||||
|
border-bottom: 1px solid #eeeeee;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.hf-drop-contain-empty {
|
||||||
|
color: #666666;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 0.8rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.searchInput {
|
||||||
|
padding: 0.3rem 0;
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
.van-search__content {
|
||||||
|
background: #ffffff;
|
||||||
|
border: 1px solid #f3f3f3;
|
||||||
|
border-radius: 0.3rem;
|
||||||
|
|
||||||
|
/deep/input {
|
||||||
|
caret-color: #0088fe;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,23 @@
|
|||||||
|
<template>
|
||||||
|
<!-- 供应商合同 -->
|
||||||
|
<div>
|
||||||
|
<UserList listType="mySupplier" ref="userList" />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'contract-mySupplier',
|
||||||
|
created() {
|
||||||
|
// 注入缓存
|
||||||
|
this.$EventBus.$emit('handleAddLive', 'contract-mySupplier')
|
||||||
|
},
|
||||||
|
activated() {
|
||||||
|
// 清除合同审批缓存
|
||||||
|
this.$EventBus.$emit('handleResetLive', 'contract-supplier')
|
||||||
|
},
|
||||||
|
components: {
|
||||||
|
UserList: () => import('./components/UserList')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
@ -0,0 +1,253 @@
|
|||||||
|
<template>
|
||||||
|
<div id="orderHeader">
|
||||||
|
<div class="hf-l-seacrch" v-if="isActSearch">
|
||||||
|
<form action="/">
|
||||||
|
<van-search v-model="listQuery.contractNumber" shape="round" show-action placeholder="请输入合同编号" :clearable="false" @search="onKeywordSearch" @cancel="onKeywordCancel" />
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
<div class="header-filter" :style="isActSearch ? 'padding: 0 0 0 0.5rem' : ''">
|
||||||
|
<div class="hf-l-list" v-show="!isActSearch">
|
||||||
|
<van-dropdown-menu class="hf-l-list-menu">
|
||||||
|
<!-- 供应商名称 -->
|
||||||
|
<van-dropdown-item title="供应商名称" :title-class="isHtab1 ? 'common-act-color' : ''" @open="handleDropOpen()" ref="vanDropItem1">
|
||||||
|
<div class="hf-drop-view">
|
||||||
|
<div class="hf-drop-contain">
|
||||||
|
<div class="hr-drop-filter-item" @click.stop="handleClass1(item.id)" v-for="item in spList" :key="item.value">
|
||||||
|
<van-icon v-if="listQuery.supplierId && listQuery.supplierId == item.value" name="success" color="#0088FE" />
|
||||||
|
<span :class="{'hr-drop-filter-item-act': listQuery.supplierId && listQuery.supplierId == item.id }">{{item.companyAme}}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="common-double-button">
|
||||||
|
<van-button class="common-double-button-l" @click="handleReset()">重置</van-button>
|
||||||
|
<van-button class="common-double-button-r" @click="handleConfirm">确定</van-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</van-dropdown-item>
|
||||||
|
<!-- 类别 -->
|
||||||
|
<van-dropdown-item title="合同状态" :title-class="isHtab4 ? 'common-act-color' : ''" @open="handleDropOpen()" ref="vanDropItem4">
|
||||||
|
<div class="hf-drop-view">
|
||||||
|
<div class="hf-drop-contain">
|
||||||
|
<div class="hr-drop-filter-item" @click.stop="handleClass2(item.value)" v-for="item in stateList" :key="item.value">
|
||||||
|
<van-icon v-if="listQuery.contractType && listQuery.contractType == item.value" name="success" color="#0088FE" />
|
||||||
|
<span :class="{'hr-drop-filter-item-act': listQuery.contractType && listQuery.contractType == item.value }">{{item.label}}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="common-double-button">
|
||||||
|
<van-button class="common-double-button-l" @click="handleReset()">重置</van-button>
|
||||||
|
<van-button class="common-double-button-r" @click="handleConfirm">确定</van-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</van-dropdown-item>
|
||||||
|
</van-dropdown-menu>
|
||||||
|
</div>
|
||||||
|
<div class="hf-r-list" v-show="!isActSearch">
|
||||||
|
<div class="hf-r-list-item" @click="handleSearch">
|
||||||
|
<div class="hf-r-icon-bg">
|
||||||
|
<van-icon name="search" class="hf-r-icon" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<van-popup position="bottom" safe-area-inset-bottom v-model="moreFilterShow" :lock-scroll="true" round get-container="#app" lazy-render>
|
||||||
|
<div class="common-popup moreContain">
|
||||||
|
<div class="common-popup-header">
|
||||||
|
<div></div>
|
||||||
|
<div class="common-popup-header-title">
|
||||||
|
<span>筛选</span>
|
||||||
|
</div>
|
||||||
|
<div class="common-popup-header-close">
|
||||||
|
<van-icon name="cross" @click="moreFilterShow = false" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="common-popup-body moreContain-body">
|
||||||
|
<van-form ref="filterForm" :show-error-message="false" validate-trigger="" :submit-on-enter="false">
|
||||||
|
<RePick v-model="listQuery.remark" label="bumen" :list="areaTree" isLastSelect isCascader isShowSearch title="行程" titleKey="name" isCascaderAllLevelNameSymnol isCell clearable />
|
||||||
|
</van-form>
|
||||||
|
</div>
|
||||||
|
<div class="common-popup-footer">
|
||||||
|
<van-button style="width: 8rem; margin-right: 1rem;" round @click="handleMoreReset">重置</van-button>
|
||||||
|
<van-button type="info" style="width: 8rem;" round @click.stop="handleMoreConfirm">确认</van-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</van-popup>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { mapState, mapGetters } from 'vuex'
|
||||||
|
import { getDictDatas, DICT_TYPE } from "@/utils/dict";
|
||||||
|
import { dayTextFormatter } from '@/utils'
|
||||||
|
import dayjs from 'dayjs'
|
||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
listType: String, // 'detail' 详情
|
||||||
|
paramProp: Object,
|
||||||
|
spList: Array, // 供应商列表
|
||||||
|
},
|
||||||
|
components: {
|
||||||
|
RePick: () => import('@/components/ReComponents/RePick'),
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
defaultDate: null,
|
||||||
|
dayTextFormatter: dayTextFormatter,
|
||||||
|
isActSearch: false,
|
||||||
|
moreFilterShow: false,
|
||||||
|
isSearch: false,
|
||||||
|
// courseStateList: [
|
||||||
|
// { text: '全部', id: 25 },
|
||||||
|
// { text: '已取消', id: 0 },
|
||||||
|
// { text: '生效中', id: 1 }
|
||||||
|
// ],
|
||||||
|
listQuery: {},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
isHtab1() {
|
||||||
|
let isShow = false
|
||||||
|
if (this.paramProp.supplierId) isShow = true
|
||||||
|
return isShow
|
||||||
|
},
|
||||||
|
isHtab4() {
|
||||||
|
let isShow = false
|
||||||
|
if (this.paramProp.contractType) isShow = true
|
||||||
|
return isShow
|
||||||
|
},
|
||||||
|
areaTree() {
|
||||||
|
return this.$store.getters.areaTree
|
||||||
|
},
|
||||||
|
isMoreAct() {
|
||||||
|
let bol = false
|
||||||
|
const listQuery = this.paramProp || {}
|
||||||
|
if (listQuery.remark) {
|
||||||
|
bol = true
|
||||||
|
}
|
||||||
|
return bol
|
||||||
|
},
|
||||||
|
stateList() {
|
||||||
|
return getDictDatas(DICT_TYPE.BS_EXPENSE_APPLY_STATUS) || []
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
|
||||||
|
methods: {
|
||||||
|
// 日历重置
|
||||||
|
handleDateReset() {
|
||||||
|
this.listQuery.startDate = null
|
||||||
|
this.listQuery.endDate = null
|
||||||
|
this.defaultDate = null
|
||||||
|
this.$refs.vanCalendar && this.$refs.vanCalendar.reset()
|
||||||
|
},
|
||||||
|
handleDateSelect(val) {
|
||||||
|
if (val.filter(item => item).length === 2) {
|
||||||
|
this.listQuery.startDate = `${dayjs(val[0]).format('YYYY/MM/DD')} 00:00:00 `
|
||||||
|
this.listQuery.endDate = `${dayjs(val[1]).format('YYYY/MM/DD')} 23:59:59 `
|
||||||
|
}
|
||||||
|
},
|
||||||
|
handleQuickDate(e) {
|
||||||
|
this.defaultDate = [dayjs(e.time[0]).toDate(), dayjs(e.time[1]).toDate()]
|
||||||
|
this.listQuery.startDate = `${e.time[0]} 00:00:00`
|
||||||
|
this.listQuery.endDate = `${e.time[1]} 23:59:59`
|
||||||
|
},
|
||||||
|
handleConfirm() {
|
||||||
|
this.$refs.vanDropItem4 && this.$refs.vanDropItem4.toggle(false)
|
||||||
|
this.$refs.vanDropItem1 && this.$refs.vanDropItem1.toggle(false)
|
||||||
|
this.$emit('onListQuery', this.listQuery)
|
||||||
|
},
|
||||||
|
|
||||||
|
onKeywordCancel() {
|
||||||
|
this.listQuery.contractNumber = null
|
||||||
|
this.isActSearch = false
|
||||||
|
this.isSearch = false
|
||||||
|
this.onKeywordSearch()
|
||||||
|
},
|
||||||
|
onKeywordSearch() {
|
||||||
|
this.$emit('onListQuery', this.listQuery)
|
||||||
|
},
|
||||||
|
|
||||||
|
|
||||||
|
// 处理供应商
|
||||||
|
handleClass1(val) {
|
||||||
|
this.listQuery.supplierId = val
|
||||||
|
},
|
||||||
|
handleClass2(val) {
|
||||||
|
this.listQuery.contractType = val
|
||||||
|
},
|
||||||
|
// 处理状态 type : 1 状态 2 缴费类型 3 换班类型
|
||||||
|
handleState(val, type) {
|
||||||
|
if (type == 1) {
|
||||||
|
const i = this.listQuery.states.findIndex(item => item === val)
|
||||||
|
if (i > -1) {
|
||||||
|
this.listQuery.states.splice(i, 1)
|
||||||
|
} else {
|
||||||
|
this.listQuery.states.push(val)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if (type == 2 || type == 3) {
|
||||||
|
const i = this.listQuery.types.findIndex(item => item === val)
|
||||||
|
if (i > -1) {
|
||||||
|
this.listQuery.types.splice(i, 1)
|
||||||
|
} else {
|
||||||
|
this.listQuery.types.push(val)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
handleInit() {
|
||||||
|
this.listQuery = {
|
||||||
|
...this.paramProp
|
||||||
|
}
|
||||||
|
if (!(this.listQuery.startDate && this.listQuery.endDate)) {
|
||||||
|
this.handleDateReset()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
handleDropOpen() {
|
||||||
|
this.handleInit()
|
||||||
|
},
|
||||||
|
onSearch() {
|
||||||
|
this.handleConfirm()
|
||||||
|
},
|
||||||
|
// 搜索
|
||||||
|
handleSearch() {
|
||||||
|
this.handleInit()
|
||||||
|
this.listQuery.contractNumber = this.paramProp.contractNumber
|
||||||
|
this.isActSearch = true
|
||||||
|
},
|
||||||
|
|
||||||
|
handleSearchCancel() {
|
||||||
|
this.listQuery.contractNumber = null
|
||||||
|
this.isActSearch = false
|
||||||
|
this.onKeywordSearch()
|
||||||
|
},
|
||||||
|
// 更多筛选
|
||||||
|
handleMoreFilter() {
|
||||||
|
this.handleInit()
|
||||||
|
this.moreFilterShow = true
|
||||||
|
},
|
||||||
|
|
||||||
|
// 更多重置
|
||||||
|
handleMoreReset() {
|
||||||
|
this.listQuery.remark = null
|
||||||
|
},
|
||||||
|
handleMoreConfirm() {
|
||||||
|
this.$emit('onListQuery', this.listQuery)
|
||||||
|
this.moreFilterShow = false
|
||||||
|
},
|
||||||
|
handleReset() {
|
||||||
|
this.listQuery.contractType = null
|
||||||
|
this.listQuery.supplierId = null
|
||||||
|
},
|
||||||
|
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
@import './index.scss';
|
||||||
|
</style>
|
||||||
@ -0,0 +1,223 @@
|
|||||||
|
<template>
|
||||||
|
<!-- 对公收款 -->
|
||||||
|
<div>
|
||||||
|
<HeaderFilter :listType="listType" :spList="spList" @onListQuery="handleListQuery" :paramProp="listQuery" />
|
||||||
|
<RMList :moreLoading.sync="moreLoading" :refreshing.sync="refreshing" :finished.sync="finished" @onLoad="handleLoad" @onRefresh="handleRefresh" isMore :tableList="tableList">
|
||||||
|
<div>
|
||||||
|
<CorporateReceiptsCard v-for="(item,index) in tableList" :key="item.id" :itemData="item" :listType="listType" @onUpdataInfo="handleUpdataInfo($event, index)" @onAllRefresh="handleAllRefresh" />
|
||||||
|
</div>
|
||||||
|
</RMList>
|
||||||
|
<div class="common-bottom-btns" style="bottom:8rem">
|
||||||
|
<div class="common-bottom-btn" @click="handleTopPage">
|
||||||
|
<img src="@/assets/images/icons/top.png" alt="">
|
||||||
|
<span>回到顶部</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="common-bottom-btns" v-hasPermi="['bs:supplier-contract:create']" style="bottom:10rem">
|
||||||
|
<div class="common-bottom-btn" @click="handleToAdd">
|
||||||
|
<img src="@/assets/images/icons/add.png" alt="">
|
||||||
|
<span>添加申请</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="common-bottom-btns" style="bottom:6rem">
|
||||||
|
<div class="common-bottom-btn" @click="handleBack">
|
||||||
|
<img src="@/assets/images/icons/home.png" alt="">
|
||||||
|
<span>返回首页</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { getScrollTop } from '@/utils'
|
||||||
|
import { getSupplierCompanyPage } from "@/api/bs/quotationSheet";
|
||||||
|
import { getSupplierContractPage } from "@/api/bs/supplierContract";
|
||||||
|
import { mapState } from 'vuex'
|
||||||
|
import dayjs from 'dayjs'
|
||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
listType: String // EnrollmentOrder: 报名订单 EnrollmentCollection: 报名收款 ShiftRecord: 换班记录 WaitPay: 待支付
|
||||||
|
},
|
||||||
|
components: {
|
||||||
|
HeaderFilter: () => import('./HeaderFilter.vue'),
|
||||||
|
RMList: () => import('@/components/ReComponents/RMList'),
|
||||||
|
CorporateReceiptsCard: () => import('@/components/CorporateReceiptsCard'),
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
height: 0,
|
||||||
|
moreLoading: false,
|
||||||
|
refreshing: false,
|
||||||
|
finished: false,
|
||||||
|
tableList: [],
|
||||||
|
spList: [],
|
||||||
|
listQuery: {
|
||||||
|
pageNo: 1,
|
||||||
|
pageSize: 10,
|
||||||
|
contractNumber: null,
|
||||||
|
status: null,
|
||||||
|
supplierId: null,
|
||||||
|
contractName: null,
|
||||||
|
contractType: null,
|
||||||
|
supplierName: null,
|
||||||
|
status: null,
|
||||||
|
amount: null,
|
||||||
|
receivedAmount: null,
|
||||||
|
projectId: null,
|
||||||
|
projectName: null,
|
||||||
|
startTime: [],
|
||||||
|
endTime: [],
|
||||||
|
departmentId: null,
|
||||||
|
signatoryId: null,
|
||||||
|
isCollect: null,
|
||||||
|
managerPhone: null,
|
||||||
|
approvalStatus: null,
|
||||||
|
files: null,
|
||||||
|
other: null,
|
||||||
|
createTime: [],
|
||||||
|
processInstanceId: null,
|
||||||
|
},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
...mapState({
|
||||||
|
singlePageSize: state => state.common.setting.singlePageSize,
|
||||||
|
pageSize: state => state.common.setting.pageSize,
|
||||||
|
})
|
||||||
|
},
|
||||||
|
activated() {
|
||||||
|
this.handleScrollInit()
|
||||||
|
},
|
||||||
|
deactivated() {
|
||||||
|
window.removeEventListener('scroll', this.handleScroll)
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.handleInit()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
handleBack() {
|
||||||
|
history.back()
|
||||||
|
},
|
||||||
|
handleInitSpList() {
|
||||||
|
let queryParams = {
|
||||||
|
pageNo: 1,
|
||||||
|
pageSize: this.singlePageSize,
|
||||||
|
}
|
||||||
|
getSupplierCompanyPage(queryParams).then((res) => {
|
||||||
|
this.spList = res.data.list || []
|
||||||
|
})
|
||||||
|
},
|
||||||
|
handleSetSingle(id) {
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
let listQuery = {
|
||||||
|
pageNo: 1,
|
||||||
|
pageSize: this.singlePageSize,
|
||||||
|
}
|
||||||
|
getSupplierContractPage(listQuery).then((res) => {
|
||||||
|
let arr = (res.data && res.data.list || []).filter(item => item.id == id)
|
||||||
|
resolve(arr)
|
||||||
|
}).catch((err) => {
|
||||||
|
reject(err)
|
||||||
|
})
|
||||||
|
})
|
||||||
|
},
|
||||||
|
handleUpdataInfo(id, index) {
|
||||||
|
this.$loading(true, 'singleReset')
|
||||||
|
this.handleSetSingle(id).then(arr => {
|
||||||
|
if (arr.length) {
|
||||||
|
this.tableList.splice(index, 1, arr[0])
|
||||||
|
}
|
||||||
|
this.$loading(false, 'singleReset')
|
||||||
|
}).catch(() => {
|
||||||
|
this.$loading(false, 'singleReset')
|
||||||
|
})
|
||||||
|
},
|
||||||
|
handleListQuery(paramProp) {
|
||||||
|
this.listQuery = {
|
||||||
|
...paramProp,
|
||||||
|
invoiceDate: paramProp.startDate && [dayjs(paramProp.startDate).format('YYYY-MM-DD HH:ss:mm'), dayjs(paramProp.endDate).format('YYYY-MM-DD HH:ss:mm')]
|
||||||
|
}
|
||||||
|
this.finished = false
|
||||||
|
this.handleRefresh()
|
||||||
|
},
|
||||||
|
handleScroll() {
|
||||||
|
getScrollTop().then(height => {
|
||||||
|
this.height = height
|
||||||
|
})
|
||||||
|
},
|
||||||
|
handleScrollInit() {
|
||||||
|
window.addEventListener('scroll', this.handleScroll)
|
||||||
|
window.scrollTo(0, this.height)
|
||||||
|
// this.handleInit()
|
||||||
|
},
|
||||||
|
|
||||||
|
handleScrollToTop() {
|
||||||
|
window.scrollTo(0, 0)
|
||||||
|
this.height = 0
|
||||||
|
},
|
||||||
|
handleToAdd() {
|
||||||
|
this.$router.push({
|
||||||
|
path: '/supplier',
|
||||||
|
query: {
|
||||||
|
type: 'add'
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
handleAllRefresh() {
|
||||||
|
// this.getTableList('refresh')
|
||||||
|
this.handleRefresh()
|
||||||
|
},
|
||||||
|
handleInit() {
|
||||||
|
this.handleInitSpList()
|
||||||
|
this.getTableList('init')
|
||||||
|
},
|
||||||
|
|
||||||
|
handleTopPage() {
|
||||||
|
window.scrollTo(0, 0)
|
||||||
|
this.$nextTick(() => {
|
||||||
|
this.height = 0
|
||||||
|
})
|
||||||
|
},
|
||||||
|
handleRefresh() {
|
||||||
|
this.listQuery.pageNo = 1
|
||||||
|
this.finished = false
|
||||||
|
this.getTableList('refresh')
|
||||||
|
},
|
||||||
|
handleLoad() {
|
||||||
|
this.listQuery.pageNo += 1
|
||||||
|
this.getTableList('more')
|
||||||
|
},
|
||||||
|
|
||||||
|
getTableList(val) {
|
||||||
|
// const { shellIdsLocal, collegeInfoIdLocal, startDate, endDate, keyword, type, method, targets, usePersonId, teacherIds, chargePersonIds } = this.listQuery
|
||||||
|
const query = {
|
||||||
|
...this.listQuery
|
||||||
|
}
|
||||||
|
this.moreLoading = true
|
||||||
|
this.$loading(true, 'tableLoading')
|
||||||
|
getSupplierContractPage(query).then(res => {
|
||||||
|
let resList = res.data && res.data.list || []
|
||||||
|
if (['init', 'refresh'].includes(val)) {
|
||||||
|
this.tableList = resList
|
||||||
|
this.handleScrollToTop()
|
||||||
|
} else {
|
||||||
|
this.tableList = this.tableList.concat(resList)
|
||||||
|
}
|
||||||
|
if (resList.length < this.pageSize) {
|
||||||
|
this.finished = true
|
||||||
|
}
|
||||||
|
}).finally(() => {
|
||||||
|
this.$nextTick(() => {
|
||||||
|
this.moreLoading = false
|
||||||
|
this.refreshing = false
|
||||||
|
this.$loading(false, 'tableLoading')
|
||||||
|
})
|
||||||
|
// this.$loading(false, `cTableLoading_${this.listType}`)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style scoped lang="scss">
|
||||||
|
// @import '~@/assets/style/common/list.scss';
|
||||||
|
</style>
|
||||||
@ -0,0 +1,163 @@
|
|||||||
|
$hf-contain-p: 0 1.2rem;
|
||||||
|
$hf-contain-f: 0.76rem;
|
||||||
|
$hf-high-color: #0088fe;
|
||||||
|
// 激活的颜色
|
||||||
|
$hf-high-color: #0088fe;
|
||||||
|
.header-filter {
|
||||||
|
.hf-r-icon-bg-act {
|
||||||
|
.van-icon {
|
||||||
|
color: $hf-high-color !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
background: #ffffff;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding: $hf-contain-p;
|
||||||
|
|
||||||
|
.hf-l-list {
|
||||||
|
.hf-l-list-menu {
|
||||||
|
/deep/.van-dropdown-menu__bar {
|
||||||
|
height: auto;
|
||||||
|
box-shadow: none;
|
||||||
|
|
||||||
|
.van-dropdown-menu__item {
|
||||||
|
flex: inherit;
|
||||||
|
margin-right: 1rem;
|
||||||
|
|
||||||
|
.van-dropdown-menu__title {
|
||||||
|
padding: 0.6rem 0.4rem 0.6rem 0;
|
||||||
|
font-size: $hf-contain-f;
|
||||||
|
|
||||||
|
&::after {
|
||||||
|
border: 1px solid;
|
||||||
|
padding: 0.1rem;
|
||||||
|
border-color: transparent transparent #333333 #333333;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.van-dropdown-menu__title--active {
|
||||||
|
color: $hf-high-color;
|
||||||
|
|
||||||
|
&::after {
|
||||||
|
border-color: transparent transparent $hf-high-color $hf-high-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.hf-r-list {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
.hf-r-list-item {
|
||||||
|
margin-left: 0.4rem;
|
||||||
|
|
||||||
|
.hf-r-icon-bg {
|
||||||
|
background: #d7d7d7;
|
||||||
|
width: 1.5rem;
|
||||||
|
height: 1.5rem;
|
||||||
|
border-radius: 1.5rem;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.hf-drop-view {
|
||||||
|
padding: $hf-contain-p;
|
||||||
|
padding-bottom: 0.8rem;
|
||||||
|
|
||||||
|
.hf-drop-contain {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
padding-bottom: 0.8rem;
|
||||||
|
|
||||||
|
.hr-drop-filter-item {
|
||||||
|
padding: $hf-contain-p;
|
||||||
|
font-size: $hf-contain-f;
|
||||||
|
width: 50%;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 0.8rem 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hr-drop-filter-item-act {
|
||||||
|
color: $hf-high-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 快捷筛选
|
||||||
|
.hf-drop-quick {
|
||||||
|
margin-top: 1rem;
|
||||||
|
|
||||||
|
.hf-drop-quick-item {
|
||||||
|
margin-bottom: 1.5rem;
|
||||||
|
|
||||||
|
.hf-drop-quick-title {
|
||||||
|
color: #333333;
|
||||||
|
font-size: 0.84rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hf-drop-quick-list {
|
||||||
|
display: flex;
|
||||||
|
margin: 0.6rem 0;
|
||||||
|
font-size: $hf-contain-f;
|
||||||
|
|
||||||
|
.hf-drop-quick-list-item {
|
||||||
|
border: 1px solid #f3f3f3;
|
||||||
|
background: #f3f3f3;
|
||||||
|
margin-right: 0.8rem;
|
||||||
|
padding: 0.4rem 0.6rem;
|
||||||
|
border-radius: 1rem;
|
||||||
|
transition: background-color, color 0.2s linear;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hf-drop-quick-list-item-act {
|
||||||
|
background: #ffffff;
|
||||||
|
color: $hf-high-color;
|
||||||
|
border: 1px solid $hf-high-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hf-drop-quick-list-item-checkbox {
|
||||||
|
margin-right: 1rem;
|
||||||
|
|
||||||
|
/deep/.van-checkbox__label {
|
||||||
|
margin-left: 0.2rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.hf-drop-quick-calendar {
|
||||||
|
/deep/.van-calendar__header {
|
||||||
|
box-shadow: none;
|
||||||
|
border-bottom: 1px solid #eeeeee;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.hf-drop-contain-empty {
|
||||||
|
color: #666666;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 0.8rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.searchInput {
|
||||||
|
padding: 0.3rem 0;
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
.van-search__content {
|
||||||
|
background: #ffffff;
|
||||||
|
border: 1px solid #f3f3f3;
|
||||||
|
border-radius: 0.3rem;
|
||||||
|
|
||||||
|
/deep/input {
|
||||||
|
caret-color: #0088fe;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,23 @@
|
|||||||
|
<template>
|
||||||
|
<!-- 供应商合同 -->
|
||||||
|
<div>
|
||||||
|
<UserList listType="mySupplier" ref="userList" />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'contract-mySupplier',
|
||||||
|
created() {
|
||||||
|
// 注入缓存
|
||||||
|
this.$EventBus.$emit('handleAddLive', 'contract-mySupplier')
|
||||||
|
},
|
||||||
|
activated() {
|
||||||
|
// 清除合同审批缓存
|
||||||
|
this.$EventBus.$emit('handleResetLive', 'contract-supplier')
|
||||||
|
},
|
||||||
|
components: {
|
||||||
|
UserList: () => import('./components/UserList')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
Loading…
Reference in New Issue