xiaoy
/
contract-business-web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

2022.7.25

Browse Source
master
271556543@qq.com 3 years ago
parent 99b8382867
commit 7774bae8dc
7 changed files with 315 additions and 57 deletions
Show Stats Download Patch File Download Diff File

3
package.json
Unescape View File

@ -17,14 +17,15 @@
"axios": "0.18.1",
"core-js": "3.6.5",
"element-ui": "2.13.2",
"html2canvas": "^1.4.1",
"js-cookie": "2.2.0",
"less": "^3.13.1",
"normalize.css": "7.0.0",
"nprogress": "0.2.0",
"path-to-regexp": "2.4.0",
"print-js": "^1.6.0",
"view-design": "^4.7.0",
"vue": "2.6.10",
"vue-print-nb": "^1.7.5",
"vue-router": "3.0.6",
"vuex": "3.1.0",
"wangeditor": "^4.7.12"

7
src/api/contractSign/contractSign.js
Unescape View File

@ -8,3 +8,10 @@ export function addContractSign(data){
})
}
export function getContractSign(params){
return request({
method:'get',
url:'/api/admin/sign_plan/index',
params
})
}

11
src/components/XyDialog/index.vue
Unescape View File

@ -29,6 +29,9 @@ export default {
default:()=>{
return {}
}
},
okText:{
type:String
}
},
data() {
@ -66,6 +69,9 @@ export default {
type:'error'
})
})
},
okClick(){
this.$emit('on-ok')
}
},
render(h) {
@ -79,14 +85,15 @@ export default {
footer slot:
footerContent
*/
const {footerRender,width,type,$scopedSlots,rules,form,showChange,isShow,title} = this
const {okText,okClick,footerRender,width,type,$scopedSlots,rules,form,showChange,isShow,title} = this
return (
<Modal
ok-text={okText}
class-name={'vertical-center-modal'}
width={width}
title={title}
value={isShow}
on={{['on-visible-change']:showChange}}
on={{['on-visible-change']:showChange,['on-ok']:okClick}}
scopedSlots={{
default(){
if(type === "form"){

3
src/main.js
Unescape View File

@ -43,9 +43,6 @@ Vue.component('xy-dialog',xyDialog)
Vue.config.productionTip = false
import Print from "vue-print-nb"
Vue.use(Print)
new Vue({
el: '#app',
router,

8
src/views/contract/components/detailContract.vue
Unescape View File

@ -59,6 +59,14 @@
</div>
</div>
</div>
<div class="pay-plan">
<div class="pay-plan-title"></div>
<xy-table :height="240">
<template v-slot:btns>
<div></div>
</template>
</xy-table>
</div>
<div class="related-processes">
<div class="related-processes-title">相关流程</div>
<div class="related-processes-item">

269
src/views/contract/components/printRegistration.vue
Unescape View File

@ -1,48 +1,89 @@
<template>
<div v-if="registration">
<xy-dialog :is-show.sync="isShow" :width="69">
<xy-dialog :is-show.sync="isShow" :width="69" @on-ok="print" ok-text="打印">
<template v-slot:normalContent>
<div class="print-table1" id="printtable1">
<div style="grid-area: title;justify-content: center;">苏州市河道管理处资金划拨（审批）单</div>
<div style="grid-area: department">科室：</div>
<div style="grid-area: date">{{registration.created_at}}</div>
<div style="grid-area: tb1-1">收款单位</div>
<div style="grid-area: tb1-2">{{registration.contract.supply}}</div>
<div style="grid-area: tb1-3">经办人</div>
<div style="grid-area: tb1-4"></div>
<div style="grid-area: tb2-1">合同名称（或摘要）</div>
<div style="grid-area: tb2-2">{{registration.contract.name}}</div>
<div style="grid-area: tb2-3">科室负责人</div>
<div style="grid-area: tb2-4"></div>
<div style="grid-area: tb3-1">合同价</div>
<div style="grid-area: tb3-2">{{registration.contract.plan_price}}万元</div>
<div style="grid-area: tb3-3">财审科审核</div>
<div style="grid-area: tb3-4"></div>
<div style="grid-area: tb4-1">申请付款金额</div>
<div style="grid-area: tb4-2">{{registration.apply_money}}万元</div>
<div style="grid-area: tb4-3">分管领导审核</div>
<div style="grid-area: tb4-4"></div>
<div style="grid-area: tb5-1">资金列支渠道</div>
<div style="grid-area: tb5-2"></div>
<div style="grid-area: tb5-3">财务分管领导审核</div>
<div style="grid-area: tb5-4"></div>
<div style="grid-area: tb6-1">同意支付金额</div>
<div style="grid-area: tb6-2"></div>
<div style="grid-area: tb6-3">单位负责人审批</div>
<div style="grid-area: tb6-4"></div>
</div>
<div class="print-table1" id="printtable1" ref="printtable">
<div class="print-table1-title">苏州市河道管理处资金划拨审批单</div>
<div class="print-table1-grid">
<div style="grid-area: tb1-1" class="print-table1-grid-top">项目名称：{{registration.contract.name}}</div>
<div style="grid-area: tb1-2;justify-content: center;align-items: center;" ><span>本次为第</span><span style="padding-left: 2vw">次付款</span></div>
<div style="grid-area: tb2-1" class="print-table1-grid-top">承包商/供货商：{{registration.contract.supply}}</div>
<div style="grid-area: tb2-2" class="print-table1-grid-top">合同服务时间：</div>
<div style="grid-area: tb3-1" class="print-table1-grid-title1">付款情形</div>
<div style="grid-area: tb3-2" class="print-table1-grid-title1">金额（单位：元）</div>
<div style="grid-area: tb3-3" class="print-table1-grid-title1">备注</div>
<Button v-print="'#printtable1'">print</Button>
<div style="grid-area: tb4-1" class="print-table1-grid-center">A</div>
<div style="grid-area: tb4-2" class="print-table1-grid-center">合同金额</div>
<div style="grid-area: tb4-3"></div>
<div style="grid-area: tb4-4"></div>
<div style="grid-area: tb5-1" class="print-table1-grid-center">B</div>
<div style="grid-area: tb5-2" class="print-table1-grid-center">审计金额</div>
<div style="grid-area: tb5-3"></div>
<div style="grid-area: tb5-4"></div>
<div style="grid-area: tb6-1" class="print-table1-grid-center">C</div>
<div style="grid-area: tb6-2" class="print-table1-grid-center">前期累计已支付</div>
<div style="grid-area: tb6-3"></div>
<div style="grid-area: tb6-4"></div>
<div style="grid-area: tb7-1" class="print-table1-grid-center">D</div>
<div style="grid-area: tb7-2" class="print-table1-grid-center">本期扣款</div>
<div style="grid-area: tb7-3"></div>
<div style="grid-area: tb7-4"></div>
<div style="grid-area: tb8-1" class="print-table1-grid-center">E</div>
<div style="grid-area: tb8-2" class="print-table1-grid-center">本期应付款</div>
<div style="grid-area: tb8-3"></div>
<div style="grid-area: tb8-4;padding-left: 0.6vw;display: block;">
<div style="display: flex;align-items: center;">
<div>进度款</div>
<div style="padding-left: 2vw">结算款</div>
</div>
<div style="display: flex;align-items: center;">
<div>质保金</div>
<div style="height: 1.5vw;width: 6vw;border-bottom: 2px #000 solid;margin-left: 2vw"></div>
<div>（其他）</div>
</div>
</div>
<div style="grid-area: tb9-1" class="print-table1-grid-center">F</div>
<div style="grid-area: tb9-2" class="print-table1-grid-center">累计支付</div>
<div style="grid-area: tb9-3"></div>
<div style="grid-area: tb9-4"></div>
<div style="grid-area: tb10-1" class="print-table1-grid-center">G</div>
<div style="grid-area: tb10-2" class="print-table1-grid-center">累计扣款</div>
<div style="grid-area: tb10-3"></div>
<div style="grid-area: tb10-4"></div>
<div style="grid-area: tb11-1" class="print-table1-grid-center">H</div>
<div style="grid-area: tb11-2" class="print-table1-grid-center">质保金</div>
<div style="grid-area: tb11-3;align-items: center;"><span style="padding-left: 2vw;"></span>%，质保期<span style="padding-left: 2vw;"></span>年，需审计的以审计价为计费依据。</div>
<div style="grid-area: tb12" class="print-table1-grid-bottom1">资金列支渠道：</div>
<div style="grid-area: tb13-1;" class="print-table1-grid-bottom2">
<div>
<div>业务科室：</div>
<div style="padding-top: 1vw;"> 经办人：</div>
</div>
</div>
<div style="grid-area: tb13-2" class="print-table1-grid-bottom2">科室负责人：</div>
<div style="grid-area: tb13-3" class="print-table1-grid-bottom2">业务科室分管领导：</div>
<div style="grid-area: tb14-1;" class="print-table1-grid-bottom3">财审科：</div>
<div style="grid-area: tb14-2;" class="print-table1-grid-bottom3">财审科分管领导：</div>
<div style="grid-area: tb14-3;" class="print-table1-grid-bottom3">单位负责人：</div>
</div>
</div>
</template>
</xy-dialog>
</div>
</template>
<script>
import {detailFundLog} from "@/api/paymentRegistration/fundLog"
import html2canvas from 'html2canvas'
import * as printJS from "print-js";
export default {
data() {
return {
@ -55,6 +96,19 @@ export default {
let res = await detailFundLog({id})
this.registration = res
console.log(this.registration)
},
async print(){
let canvas = await html2canvas(this.$refs['printtable'],{
backgroundColor:null,
useCORS: true,
})
printJS({
printable: canvas.toDataURL(),
type: 'image',
documentTitle: '苏州市河道管理处资金划拨审批单',
style:'@page{margin:0;}'
})
}
},
@ -63,26 +117,139 @@ export default {
<style scoped lang="scss">
.print-table1{
border: 1px #000 solid;
display: grid;
grid-template-rows: repeat(8,auto);
grid-template-columns: repeat(2,1fr 2.5fr);
grid-template-areas:
"title title title title"
"department department date date"
"tb1-1 tb1-2 tb1-3 tb1-4"
"tb2-1 tb2-2 tb2-3 tb2-4"
"tb3-1 tb3-2 tb3-3 tb3-4"
"tb4-1 tb4-2 tb4-3 tb4-4"
"tb5-1 tb5-2 tb5-3 tb5-4"
"tb6-1 tb6-2 tb6-3 tb6-4";
&>div{
box-sizing: border-box;
&-title{
font-size: 20px;
letter-spacing: 2px;
text-align: center;
font-weight: 600;
border: none;
padding: 1.5vw 0;
}
&-grid{
border: 1px #000 solid;
display: flex;
align-items: center;
display: grid;
grid-template-rows: repeat(14,auto);
grid-template-columns: repeat(6,1fr);
grid-template-areas:
"tb1-1 tb1-1 tb1-1 tb1-2 tb1-2 tb1-2"
"tb2-1 tb2-1 tb2-1 tb2-2 tb2-2 tb2-2"
"tb3-1 tb3-1 tb3-2 tb3-2 tb3-3 tb3-3"
"tb4-1 tb4-2 tb4-3 tb4-3 tb4-4 tb4-4"
"tb5-1 tb5-2 tb5-3 tb5-3 tb5-4 tb5-4"
"tb6-1 tb6-2 tb6-3 tb6-3 tb6-4 tb6-4"
"tb7-1 tb7-2 tb7-3 tb7-3 tb7-4 tb7-4"
"tb8-1 tb8-2 tb8-3 tb8-3 tb8-4 tb8-4"
"tb9-1 tb9-2 tb9-3 tb9-3 tb9-4 tb9-4"
"tb10-1 tb10-2 tb10-3 tb10-3 tb10-4 tb10-4"
"tb11-1 tb11-2 tb11-3 tb11-3 tb11-3 tb11-3"
"tb12 tb12 tb12 tb12 tb12 tb12"
"tb13-1 tb13-1 tb13-2 tb13-2 tb13-3 tb13-3"
"tb14-1 tb14-1 tb14-2 tb14-2 tb14-3 tb14-3";
&>div{
border: 1px #000 solid;
display: flex;
}
&-top{
padding: 0.4vw 0 4vw 0.4vw;
}
&-title1{
text-align: center;
justify-content: center;
padding: 0.2vw 0;
}
&-center{
justify-content: center;
align-items: center;
padding: 1vw 0;
}
&-bottom1{
padding: 10px 6px;
padding: 0.4vw 0 4vw 0.4vw;
}
&-bottom2{
padding: 0.4vw 0 4vw 0.4vw;
}
&-bottom3{
padding: 0.4vw 0 6vw 0.4vw;
}
}
}
</style>
<style media="print" lang="scss">
@media print {
.print-table1{
box-sizing: border-box;
&-title{
text-align: center;
font-weight: 600;
border: none;
padding: 0.6vw 0;
}
&-grid{
border: 1px #000 solid;
display: grid;
grid-template-rows: repeat(14,auto);
grid-template-columns: repeat(6,1fr);
grid-template-areas:
"tb1-1 tb1-1 tb1-1 tb1-2 tb1-2 tb1-2"
"tb2-1 tb2-1 tb2-1 tb2-2 tb2-2 tb2-2"
"tb3-1 tb3-1 tb3-2 tb3-2 tb3-3 tb3-3"
"tb4-1 tb4-2 tb4-3 tb4-3 tb4-4 tb4-4"
"tb5-1 tb5-2 tb5-3 tb5-3 tb5-4 tb5-4"
"tb6-1 tb6-2 tb6-3 tb6-3 tb6-4 tb6-4"
"tb7-1 tb7-2 tb7-3 tb7-3 tb7-4 tb7-4"
"tb8-1 tb8-2 tb8-3 tb8-3 tb8-4 tb8-4"
"tb9-1 tb9-2 tb9-3 tb9-3 tb9-4 tb9-4"
"tb10-1 tb10-2 tb10-3 tb10-3 tb10-4 tb10-4"
"tb11-1 tb11-2 tb11-3 tb11-3 tb11-3 tb11-3"
"tb12 tb12 tb12 tb12 tb12 tb12"
"tb13-1 tb13-1 tb13-2 tb13-2 tb13-3 tb13-3"
"tb14-1 tb14-1 tb14-2 tb14-2 tb14-3 tb14-3";
&>div{
border: 1px #000 solid;
display: flex;
}
&-top{
padding: 0.2vw 0 4vw 0.4vw;
}
&-title1{
text-align: center;
justify-content: center;
padding: 0.3vw 0;
}
&-center{
justify-content: center;
align-items: center;
padding: 0.8vw;
}
&-bottom1{
padding: 0.2vw 0 2vw 0.4vw;
}
&-bottom2{
padding: 0.2vw 0 4vw 0.4vw;
}
}
}
}
</style>

71
src/views/contract/paymentPlan.vue
Unescape View File

@ -0,0 +1,71 @@
<template>
<div style="padding: 0 20px;">
<lx-header icon="md-apps" text="付款计划" style="margin-bottom: 10px; border: 0px; margin-top: 15px">
<div slot="content"></div>
<slot>
<div class="selects">
<div>
<span style="padding: 0 6px;word-break: keep-all;">
合同类型
</span>
<Select placeholder="请选择类型" style="width:120px;" clearable>
<Option v-for="item in [{label:'服务',value:1},{label:'货品',value:2},{label:'工程',value:3}]" :value="item.value" :key="item.value">{{ item.label }}</Option>
</Select>
</div>
<div>
<span style="padding: 0 6px;word-break: keep-all;">
关键字
</span>
<Input placeholder="请输入关键字" style="width: 180px"></Input>
</div>
<Button type="primary" style="margin-left: 10px" >新增</Button>
<Button type="primary" style="margin-left: 10px" >查询</Button>
</div>
</slot>
</lx-header>
<xy-table :list="[]" :table-item="[]"></xy-table>
<div style="display: flex;justify-content: flex-end;">
<Page :total="total" show-elevator/>
</div>
</div>
</template>
<script>
import {getContractSign} from "@/api/contractSign/contractSign"
export default {
data() {
return {
select:{
pageIndex:1,
keyword:''
},
total:0,
}
},
methods: {
async getSignPlan(){
const res = await getContractSign({page_size:10,page:this.select.pageIndex,keyword:this.select.keyword})
console.log(res)
}
},
mounted() {
this.getSignPlan()
}
}
</script>
<style scoped lang="scss">
.selects{
display: flex;
flex-wrap: wrap;
&>div{
margin-bottom: 6px;
}
}
</style>
Write Preview
Loading…
Cancel
Save