22.7.18 合同、预算

master
271556543@qq.com 3 years ago
parent b9c8109723
commit 021262a816

@ -0,0 +1,145 @@
<script>
export default {
props:{
type:{
type:String,
default:"normal"
//"normal" "form"
},
width:{
type:Number,
default:520
},
isShow:{
type:Boolean,
default:false
},
title:{
type:String,
default: ''
},
form:{
type:Object,
default:()=>{
return {}
}
},
rules:{
type:Object,
default:()=>{
return {}
}
}
},
data() {
return {
}
},
methods: {
footerRender(){
return (
<div>
<Button ghost type="primary" on-click={this.reset}>重置</Button>
<Button type="primary" on-click={this.submit}>确定</Button>
</div>
)
},
showChange(e){
this.$emit('update:isShow',e)
},
reset(){
if(this.type === 'normal'){
return
}
this.$refs['elForm'].resetFields()
},
submit(){
if(this.type === 'normal'){
return
}
this.$refs['elForm'].validate().then(res=>{
if(res)this.$emit('submit')
}).catch(err=>{
this.$message({
message:'请填写完整信息',
type:'error'
})
})
}
},
render(h) {
/*
type='form' slot:
extraFormTop
extraFormBottom
{表单名}
type='normal' slot:
normalContent
footer slot:
footerContent
*/
const {footerRender,width,type,$scopedSlots,rules,form,showChange,isShow,title} = this
return (
<Modal
width={width}
draggable={true}
title={title}
value={isShow}
on={{['on-visible-change']:showChange}}
scopedSlots={{
default(){
if(type === "form"){
let formItems = []
Object.keys(form).forEach((key)=>{
formItems.push(
<el-form-item
prop={key}>
{eval(`{$scopedSlots.${key} ? $scopedSlots.${key}() : ''}`)}
</el-form-item>
)
})
return (
<el-form
style={title.length === 0 ? {'margin-top':'32px'} : {}}
ref="elForm"
props={{
model:form,
rules
}}>
{$scopedSlots.extraFormTop ? $scopedSlots.extraFormTop() : ''}
{
formItems.map(item=>{
return item
})
}
{$scopedSlots.extraFormBottom ? $scopedSlots.extraFormBottom() : ''}
</el-form>
)
}else{
return (
<div
style={title.length === 0 ? {'margin-top':'32px'} : {}}>
{$scopedSlots.normalContent ? $scopedSlots.normalContent() : ''}
</div>
)
}
},
footer(){
{
return ($scopedSlots.footerContent ? $scopedSlots.footerContent() : footerRender())
}
}
}}>
</Modal>
)
}
}
</script>
<style scoped lang="scss">
</style>

@ -0,0 +1,246 @@
<script>
export default {
props:{
height:{
type:Number
},
list:{
type:Array,
default:()=> []
},
tableItem:{
type:Array,
default:()=> []
},
indent:{
type:Number,
default:18
},
cellStyle:{
type:Function,
default:()=>{}
},
rowStyle:{
type:Function,
default:()=>{}
},
headerRowStyle:{
type:Function,
default:()=>{}
},
headerCellStyle:{
type:Function,
default:()=>{}
},
defaultExpandAll:{
type:Boolean,
default:true
},
showIndex:{
type:Boolean,
default:true
},
showHeader:{
type:Boolean,
default:true
},
showSummary:{
type:Boolean,
default:false
},
treeProps:{
type:Object,
default:()=> {
return { children: 'children', hasChildren: 'hasChildren' }
}
},
tableStyle:{
type:Object,
default:()=>{
return { width: '100%', marginBottom: "20px"}
}
}
},
data() {
return {
tableHeight: 0,
}
},
methods: {
initLoad() {
var that = this;
var clientHeight = document.documentElement.clientHeight
var lxHeader_height = 96.5; //
var paginationHeight = 37; //
var topHeight = 50; //
let tableHeight = clientHeight - lxHeader_height - topHeight - paginationHeight - 20;
that.tableHeight = tableHeight;
},
deleteClick(row){
this.$emit('delete',row)
},
editorClick(row){
this.$emit('editor',row)
},
createIndexRow(){
return <el-table-column type="index" align="center" fixed="left"></el-table-column>
}
},
created() {
this.initLoad()
},
mounted() {
},
render(h) {
let {height,createIndexRow,tableStyle,treeProps,showSummary,showHeader,$scopedSlots,showIndex,defaultExpandAll,headerCellStyle,headerRowStyle,rowStyle,cellStyle,indent,tableHeight,tableItem,list,deleteClick,editorClick} = this
return (
<div class="table-tree">
{ tableItem && tableItem.length>0 ?
(<el-table
show-summary={showSummary}
show-header={showHeader}
header-row-style={headerRowStyle}
header-cell-style={headerCellStyle}
row-style={rowStyle}
cell-style={cellStyle}
indent={indent}
data={list}
height={height ?? tableHeight}
class="v-table"
style={tableStyle}
row-key="id"
border
default-expand-all={defaultExpandAll}
tree-props={treeProps}
fit={true}>
{
//
showIndex ? createIndexRow() : ''
}
{
tableItem.map((item,index)=>{
//
if(item.customFn){
return (
<el-table-column
sortable={item.sortable ?? true}
width={item.width ?? 'auto'}
min-width={item.minWidth ?? item.width}
header-align={item.headerAlign ?? 'center'}
label={item.label}
prop={item.prop}
scopedSlots={{
default( scope ){
return item.customFn(scope.row)
}
}}>
</el-table-column>
)
}
else if(item.multiHd){
//
return (
<el-table-column
header-align={item.headerAlign ?? 'center'}
label={item.label}>
{item.multiHd.map((item1,index1)=>{
if(item1.customFn){
return (
<el-table-column
header-align={item1.headerAlign ?? 'center'}
label={item1.label}
width={item1.width ?? 'auto'}
min-width={item1.minWidth ?? item1.width}
sortable={item1.sortable ?? true}
scopedSlots={{
default( scope ){
return item1.customFn(scope.row)
}
}}>
</el-table-column>
)
}else{
return (
<el-table-column
align={item1.align ?? 'center'}
header-align={item1.headerAlign ?? 'center'}
prop={`${item.Fprop?item.Fprop+'.' : ''}${item1.prop}`}
label={item1.label}
width={item1.width ?? 'auto'}
min-width={item1.minWidth ?? item1.width}
sortable={item1.sortable ?? true}>
</el-table-column>
)
}
})}
</el-table-column>
)
}
else{
//
return (
<el-table-column
formatter={item.formatter}
width={item.width ?? 'auto'}
min-width={item.minWidth ?? item.width}
header-align={item.headerAlign ?? 'center'}
align={item.align ?? 'center'}
label={item.label}
prop={item.prop}
sortable={item.sortable ?? true}>
</el-table-column>
)
}
})}
{
$scopedSlots.btns ? $scopedSlots.btns() :
(<el-table-column
fixed="right"
label="操作"
width="190"
header-align="center"
scopedSlots={{
default( scope ){
return (
<div>
<i-button
type="error"
size="small"
style="margin-left: 10px;"
ghost
onClick={()=>deleteClick(scope.row)}>删除</i-button>
<i-button
type="primary"
size="small"
style="margin-left: 10px;"
ghost
onClick={()=>editorClick(scope.row)}>编辑</i-button>
</div>
)
}
}}>
</el-table-column>
)
}
</el-table>)
:
<el-table height={tableHeight}/> }
<el-backtop
target=".el-table__body-wrapper"
visibility-height={130}
bottom={68}
right={48}>
</el-backtop>
</div>
)
}
}
</script>
<style scoped lang="scss">
</style>

@ -1,43 +1,50 @@
import Vue from 'vue'
import 'normalize.css/normalize.css' // A modern alternative to CSS resets
import ElementUI from 'element-ui'
import '@/styles/element-variables.scss'
import locale from 'element-ui/lib/locale/lang/en' // lang i18n
import '@/styles/index.scss' // global css
import '@/styles/iconfont.css'
import App from './App'
import store from './store'
import router from './router'
import '@/icons' // icon
import '@/permission' // permission control
import ViewUI from 'view-design';
import './styles/viewui-mine.less';
Vue.use(ViewUI);
/**
* If you don't want to use mock-server
* you want to use MockJs for mock api
* you can execute: mockXHR()
*
* Currently MockJs will be used in the production environment,
* please remove it before going online ! ! !
*/
//if (process.env.NODE_ENV === 'production') {
//const { mockXHR } = require('../mock')
//mockXHR()
//}
// set ElementUI lang to EN
//Vue.use(ElementUI, { locale })
// 如果想要中文版 element-ui按如下方式声明
Vue.use(ElementUI)
Vue.config.productionTip = false
new Vue({
el: '#app',
router,
store,
render: h => h(App)
})
import Vue from 'vue'
import 'normalize.css/normalize.css' // A modern alternative to CSS resets
import ElementUI from 'element-ui'
import '@/styles/element-variables.scss'
import locale from 'element-ui/lib/locale/lang/en' // lang i18n
import '@/styles/index.scss' // global css
import '@/styles/iconfont.css'
import App from './App'
import store from './store'
import router from './router'
import '@/icons' // icon
import '@/permission' // permission control
import ViewUI from 'view-design';
import './styles/viewui-mine.less';
Vue.use(ViewUI);
/**
* If you don't want to use mock-server
* you want to use MockJs for mock api
* you can execute: mockXHR()
*
* Currently MockJs will be used in the production environment,
* please remove it before going online ! ! !
*/
//if (process.env.NODE_ENV === 'production') {
//const { mockXHR } = require('../mock')
//mockXHR()
//}
// set ElementUI lang to EN
//Vue.use(ElementUI, { locale })
// 如果想要中文版 element-ui按如下方式声明
Vue.use(ElementUI)
import lxHeader from "@/components/LxHeader"
Vue.component('lx-header',lxHeader)
import xyTable from "@/components/XyTable"
Vue.component('xy-table',xyTable)
import xyDialog from "@/components/XyDialog"
Vue.component('xy-dialog',xyDialog)
Vue.config.productionTip = false
new Vue({
el: '#app',
router,
store,
render: h => h(App)
})

@ -68,108 +68,118 @@ div:focus {
/* .el-table th.gutter{
display: table-cell!important;
} */
.pagination {
text-align: right;
/* margin-top: 8px; */
padding: 2px 28px;
border: 1px solid #eee;
border-top: 0px;
}
.v-table .el-table__header th {
padding: 0px !important;
background-color: #f8f8f9 !important;
font-size: 13px;
height: 42px;
color: #616161;
}
.v-table .el-table__header th.is-sortable {
padding: 3px !important;
}
.table-tree.text-inline .el-table__body .cell {
word-break: inherit !important;
white-space: nowrap !important;
}
.v-table .el-table__body td {
padding: 9px 0 !important;
}
.v-table .el-table__footer td {
padding: 7px 0 !important;
}
/* 2021.01.30修复火狐checkbox错位问题 */
.table-tree .el-table-column--selection .cell {
display: inline;
}
.table-tree.text-inline .el-table th>.cell {
white-space: nowrap !important;
}
.table-tree .el-table__body-wrapper::-webkit-scrollbar {
width: 10px;
height: 10px;
}
.table-tree .el-table__body-wrapper::-webkit-scrollbar-thumb {
border-radius: 5px;
background: #ddd;
}
.table-tree .table-img {
height: 40px;
border-radius: 5px;
margin-right: 10px;
width: 40px;
object-fit: cover;
}
.table-tree .table-img:hover {
cursor: pointer;
}
.v-table .ivu-tag-default {
border: none !important;
background: none !important;
}
/* .v-table >>> .el-table__fixed-body-wrapper {
top: 41px !important;
} */
.v-table .el-table__fixed:before {
border-color: none !important;
}
/* 2021.06.19判断谷歌内核浏览重新计算table高度 */
.chrome .el-table__fixed {
height: calc(100% - 11px) !important;
background: white;
/* box-shadow: 0px -11px 10px rgb(0 0 0 / 12%) !important; */
}
.chrome .el-table__body-wrapper::-webkit-scrollbar {
width: 11px;
height: 11px;
}
.chrome .el-table__body-wrapper::-webkit-scrollbar-thumb {
border-radius: 5px;
background: #ddd;
}
.chrome .el-table__fixed:before {
background-color: unset;
}
.chrome .el-table__fixed-footer-wrapper {
bottom: -11.5px;
/* .el-table th.gutter{
display: table-cell!important;
} */
.pagination {
text-align: right;
/* margin-top: 8px; */
padding: 2px 28px;
border: 1px solid #eee;
border-top: 0px;
}
.v-table .el-table__header th {
padding: 0px !important;
background-color: #f8f8f9 !important;
font-size: 13px;
height: 42px;
color: #616161;
}
.v-table .el-table__header th.is-sortable {
padding: 3px !important;
}
.table-tree.text-inline .el-table__body .cell {
word-break: inherit !important;
white-space: nowrap !important;
}
.v-table .el-table__body td {
padding: 9px 0 !important;
}
.v-table .el-table__footer td {
padding: 7px 0 !important;
}
/* 2021.01.30修复火狐checkbox错位问题 */
.table-tree .el-table-column--selection .cell {
display: inline;
}
.table-tree.text-inline .el-table th>.cell {
white-space: nowrap !important;
}
.table-tree .el-table__body-wrapper::-webkit-scrollbar {
width: 10px;
height: 10px;
}
.table-tree .el-table__body-wrapper::-webkit-scrollbar-thumb {
border-radius: 5px;
background: #ddd;
}
.table-tree .table-img {
height: 40px;
border-radius: 5px;
margin-right: 10px;
width: 40px;
object-fit: cover;
}
.table-tree .table-img:hover {
cursor: pointer;
}
.v-table .ivu-tag-default {
border: none !important;
background: none !important;
}
/* .v-table >>> .el-table__fixed-body-wrapper {
top: 41px !important;
} */
.v-table .el-table__fixed:before {
border-color: none !important;
}
/* 2021.06.19判断谷歌内核浏览重新计算table高度 */
.chrome .el-table__fixed {
height: calc(100% - 11px) !important;
background: white;
/* box-shadow: 0px -11px 10px rgb(0 0 0 / 12%) !important; */
}
.chrome .el-table__body-wrapper::-webkit-scrollbar {
width: 11px;
height: 11px;
}
.chrome .el-table__body-wrapper::-webkit-scrollbar-thumb {
border-radius: 5px;
background: #ddd;
}
.chrome .el-table__fixed:before {
background-color: unset;
}
.chrome .el-table__fixed-footer-wrapper {
bottom: -11.5px;
}
::-webkit-scrollbar {
width: 8px;
height: 8px;
}
::-webkit-scrollbar-thumb {
border-radius: 5px;
background: #ddd;
}

@ -0,0 +1,185 @@
<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>
<span style="padding: 0 6px;">年份</span>
<span>
<Select v-model="select.year" style="width:120px">
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
</Select>
</span>
<span style="padding: 0 6px;">
预算类型
</span>
<span>
<Select v-model="select.type" style="width:120px;">
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
</Select>
</span>
<span style="padding: 0 6px;">
科室
</span>
<span>
<Select v-model="select.department" style="width:200px;">
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
</Select>
</span>
<Button type="primary" style="margin-left: 10px" @click="isShowAdd = true">新增</Button>
<Button type="primary" style="margin-left: 10px">查询</Button>
<Button type="primary" style="margin-left: 10px">重置</Button>
</div>
</slot>
</lx-header>
<xy-table :table-item="table"></xy-table>
<div style="display: flex;justify-content: flex-end;">
<Page :total="20" show-elevator />
</div>
<xy-dialog :is-show.sync="isShowAdd" type="form" :form="form" title="新增计划" :rules="rules" @submit="submit">
<template v-slot:name>
<Row>
<Col span="5" style="color: red;"><span style="font-weight: 600;padding-right: 4px;">*</span>项目名称</Col>
<Col>
<Input v-model="form.name" style="width: 300px;"/>
</Col>
</Row>
</template>
<template v-slot:type>
<Row>
<Col span="5" style="color: red;"><span style="font-weight: 600;padding-right: 4px;">*</span>预算类型</Col>
<Col>
<Select v-model="form.type" style="width: 300px;">
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
</Select>
</Col>
</Row>
</template>
<template v-slot:date>
<Row>
<Col span="5">项目所属年份</Col>
<Col>
<DatePicker placement="bottom" v-model="form.date" type="date" placeholder="Select date" style="width: 300px;"></DatePicker>
</Col>
</Row>
</template>
<template v-slot:department>
<Row>
<Col span="5" style="color: red;"><span style="font-weight: 600;padding-right: 4px;">*</span>科室</Col>
<Col>
<Select v-model="form.department" style="width: 300px;">
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
</Select>
</Col>
</Row>
</template>
<template v-slot:content>
<Row>
<Col span="5">内容</Col>
<Col>
<Input v-model="form.content" style="width: 300px;"/>
</Col>
</Row>
</template>
<template v-slot:money>
<Row>
<Col span="5" style="color: red;"><span style="font-weight: 600;padding-right: 4px;">*</span>金额</Col>
<Col>
<Input v-model="form.money" style="width: 300px;"/>
</Col>
</Row>
</template>
<template v-slot:remark>
<Row>
<Col span="5">备注</Col>
<Col>
<Input type="textarea" v-model="form.remark" style="width: 300px;"/>
</Col>
</Row>
</template>
</xy-dialog>
</div>
</template>
<script>
export default {
data() {
return {
isShowAdd:false,
form:{
name:"",
type:"",
date:"",
department:"",
content:"",
money:"",
remark:""
},
rules:{
name:[
{required:true}
],
type:[
{required:true}
],
department:[
{required:true}
],
money:[
{required:true}
],
},
table:[
{
label:"预算类型",
},
{
label:"项目名称",
},
{
label:"所属年份",
},
{
label: "相关科室",
},
{
label:"描述",
},
{
label:"创建信息",
}
],
select:{
year:"",
type:"",
department:""
},
cityList: [
{
value: 'New York',
label: 'New York'
},
{
value: 'London',
label: 'London'
}
],
}
},
methods: {
submit(){
console.log(this.form)
}
},
}
</script>
<style scoped lang="scss">
</style>

@ -0,0 +1,19 @@
<template>
<div>
</div>
</template>
<script>
export default {
data() {
return {}
},
methods: {
},
}
</script>
<style scoped lang="scss">
</style>

@ -0,0 +1,404 @@
<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>
<span>
<DatePicker type="daterange" placement="bottom-start" placeholder="Select date" style="width: 180px"></DatePicker>
</span>
</div>
<div>
<span style="padding: 0 6px;word-break: keep-all;">
合同类型
</span>
<Select v-model="select.type" style="width:120px;">
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
</Select>
</div>
<div>
<span style="padding: 0 6px;word-break: keep-all;">
科室
</span>
<Select v-model="select.department" style="width:200px;">
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
</Select>
</div>
<div>
<span style="padding: 0 6px;word-break: keep-all;">
采购形式
</span>
<Select v-model="select.purchaseModality" style="width:200px;">
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
</Select>
</div>
<div>
<span style="padding: 0 6px;word-break: keep-all;">
采购方式
</span>
<Select v-model="select.purchaseMethods" style="width:200px;">
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
</Select>
</div>
<div>
<span style="padding: 0 6px;word-break: keep-all;">
预算金额
</span>
<InputNumber
:min="0"
:max="select.priceMax"
v-model="select.priceMin"
:formatter="value => `¥${value}`.replace(/B(?=(d{3})+(?!d))/g, ',')"
:parser="value => value.replace(/$s?|(,*)/g, '')"/>
<span style="padding: 0 5px;">-</span>
<InputNumber
:max="Number.MAX_VALUE"
:min="select.priceMin"
v-model="select.priceMax"
:formatter="value => `¥${value}`.replace(/B(?=(d{3})+(?!d))/g, ',')"
:parser="value => value.replace(/$s?|(,*)/g, '')"/>
</div>
<Button type="primary" style="margin-left: 10px" @click="isShowPaymentRegistration = true">付款登记</Button>
<Button type="primary" style="margin-left: 10px" @click="isShowAdd = true">新增</Button>
<Button type="primary" style="margin-left: 10px">查询</Button>
<Button type="primary" style="margin-left: 10px" ghost>重置</Button>
<Button type="primary" style="margin-left: 10px">导出</Button>
</div>
</slot>
</lx-header>
<xy-table :table-item="table"></xy-table>
<div style="display: flex;justify-content: flex-end;">
<Page :total="20" show-elevator />
</div>
<!-- 新增合同 -->
<xy-dialog :is-show.sync="isShowAdd" title="新增合同" type="form" :form="form">
<template v-slot:name>
<Row>
<Col span="5" style="color: red;"><span style="font-weight: 600;padding-right: 4px;">*</span>项目名称</Col>
<Col>
<Input v-model="form.name" style="width: 300px;"/>
</Col>
</Row>
</template>
<template v-slot:type>
<Row>
<Col span="5" style="color: red;"><span style="font-weight: 600;padding-right: 4px;">*</span>预算类型</Col>
<Col>
<Select v-model="form.type" style="width: 300px;">
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
</Select>
</Col>
</Row>
</template>
<template v-slot:methods>
<Row>
<Col span="5" style="color: red;"><span style="font-weight: 600;padding-right: 4px;">*</span>采购类型</Col>
<Col>
<Select v-model="form.methods" style="width: 300px;">
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
</Select>
</Col>
</Row>
</template>
<template v-slot:modality>
<Row>
<Col span="5" style="color: red;"><span style="font-weight: 600;padding-right: 4px;">*</span>采购形式</Col>
<Col>
<Select v-model="form.modality" style="width: 300px;">
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
</Select>
</Col>
</Row>
</template>
<template v-slot:price>
<Row>
<Col span="5" style="color: red;"><span style="font-weight: 600;padding-right: 4px;">*</span>合同预算价</Col>
<Col>
<Input v-model="form.price" style="width: 300px;"/>
</Col>
<Col style="color: red;" offset="1"></Col>
</Row>
</template>
<template v-slot:fundingChannels>
<Row>
<Col span="5" style="color: red;"><span style="font-weight: 600;padding-right: 4px;">*</span>资金渠道</Col>
<Col>
<Select v-model="form.fundingChannels" style="width: 300px;">
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
</Select>
</Col>
</Row>
</template>
<template v-slot:isBudget>
<Row>
<Col span="5" style="color: red;"><span style="font-weight: 600;padding-right: 4px;">*</span>是否预算</Col>
<Col>
<i-switch v-model="form.isBudget" @on-change="form.isBudget = $event" />
</Col>
</Row>
</template>
<template v-if="form.isBudget" v-slot:plan>
<Row>
<Col span="5" style="color: red;"><span style="font-weight: 600;padding-right: 4px;">*</span>关联预算计划</Col>
<Col>
<Input v-model="form.plan" style="width: 300px;" icon="ios-arrow-down" readonly @on-focus="isShowPlan = true"></Input>
</Col>
</Row>
</template>
</xy-dialog>
<!-- 新增表 预算计划 -->
<xy-dialog :is-show.sync="isShowPlan" title="预算计划" :width="640">
<template v-slot:normalContent>
<Input search enter-button=" " placeholder="搜索预算计划.." />
<xy-table :table-item="searchTable" :height="240" style="margin-top: 10px;">
<template v-slot:btns>
<el-table-column label="使用金额" header-align="center">
<Input />
</el-table-column>
</template>
</xy-table>
<div style="display: flex;justify-content: flex-end;">
<Page :total="20" show-elevator />
</div>
</template>
<template v-slot:footerContent>
<Button type="primary">确定</Button>
</template>
</xy-dialog>
<!-- 付款登记-->
<xy-dialog title="付款登记" :is-show.sync="isShowPaymentRegistration" type="form" class="payment-registration" :form="paymentRegistrationForm">
<template v-slot:extraFormTop>
<div class="payment-registration-row">
<div class="payment-registration-row-title">受款单位</div>
<div class="payment-registration-row-content">受款单位</div>
</div>
<div class="payment-registration-row">
<div class="payment-registration-row-title">合同名称</div>
<div class="payment-registration-row-content">合同名称</div>
</div>
<div class="payment-registration-row">
<div class="payment-registration-row-title">合同金额</div>
<div class="payment-registration-row-content">100000</div>
</div>
<div style="display: flex">
<div class="payment-registration-row">
<div class="payment-registration-row-title">已付金额</div>
<div class="payment-registration-row-content">20000 </div>
</div>
<div class="payment-registration-row">
<div class="payment-registration-row-title">支付占比</div>
<div class="payment-registration-row-content">10%</div>
</div>
<div class="payment-registration-row">
<div class="payment-registration-row-title">已付笔数</div>
<div class="payment-registration-row-content">10</div>
<div class="payment-registration-row-content" style="color: #ff0000;padding-left: 10px;cursor: pointer;">点击查看列表</div>
</div>
</div>
</template>
<template v-slot:applyMoney>
<Row>
<Col span="5" style="color: red;"><span style="font-weight: 600;padding-right: 4px;">*</span>申请付款金额</Col>
<Col>
<Input v-model="paymentRegistrationForm.applyMoney" style="width: 300px;"></Input>
</Col>
</Row>
</template>
<template v-slot:deductionMoney>
<Row>
<Col span="5" style="color: red;"><span style="font-weight: 600;padding-right: 4px;">*</span>本期扣款金额</Col>
<Col>
<Input v-model="paymentRegistrationForm.deductionMoney" style="width: 300px;"></Input>
</Col>
</Row>
</template>
<template v-slot:type>
<Row>
<Col span="5" style="color: red;"><span style="font-weight: 600;padding-right: 4px;">*</span>款项类型
</Col>
<Col>
<Select v-model="paymentRegistrationForm.type" style="width: 300px;"></Select>
</Col>
</Row>
</template>
<template v-slot:isLast>
<Row>
<Col span="5" style="color: red;"><span style="font-weight: 600;padding-right: 4px;">*</span>是否最后一笔</Col>
<Col>
<i-switch v-model="paymentRegistrationForm.isLast" @on-change="paymentRegistrationForm.isLast = $event" />
</Col>
</Row>
</template>
<template v-slot:extraFormBottom>
<xy-table :table-item="searchTable" :height="240" style="margin-top: 10px;">
<template v-slot:btns>
<el-table-column label="使用金额" header-align="center">
<Input />
</el-table-column>
</template>
</xy-table>
</template>
</xy-dialog>
</div>
</template>
<script>
import ResizeObserver from "resize-observer-polyfill";
export default {
data() {
return {
isShowPaymentRegistration:false,
paymentRegistrationForm:{
applyMoney:"",
deductionMoney:"",
type:"",
isLast:""
},
searchTable:[
{
label:"分类"
},
{
label:"名称"
},
{
label:"计划金额"
}
],
isShowPlan:false,
isShowAdd:false,
form:{
name:"",
type:"",
methods:"",
modality:"",
price:"",
fundingChannels:"",
isBudget:true,
plan:""
},
select:{
startDate:"",
endDate:"",
type:"",
department:"",
purchaseModality:"",
purchaseMethods:"",
priceMin:0,
priceMax:0,
status:""
},
cityList: [
{
value: 'New York',
label: 'New York'
},
{
value: 'London',
label: 'London'
}
],
table:[
{
label:"项目名称",
},
{
label:"采购形势"
},
{
label:"项目类型"
},
{
label:"采购方式"
},
{
label:"资金来源"
},
{
label:"项目预算(万元)"
},
{
label:"合同状态"
},
{
label:"流程",
multiHd:[
{
label:"请示流程",
},
{
label:"采购流程"
},
{
label:"招标审核流程"
},
{
label:"合同会签流程"
}
]
},
{
label:"创建科室"
},
{
label:"创建人"
},
{
label:"创建信息"
}
]
}
},
methods: {
},
mounted() {
//
},
}
</script>
<style scoped lang="scss">
.selects{
display: flex;
flex-wrap: wrap;
}
.selectTop{
margin-top: 10px;
}
.payment-registration{
&-row{
display: flex;
padding: 6px 0;
&-title{
color: #ff0000;
padding: 0 10px;
}
&-content{
}
}
}
</style>

@ -1,149 +1,149 @@
'use strict'
const path = require('path')
const defaultSettings = require('./src/settings.js')
function resolve(dir) {
return path.join(__dirname, dir)
}
const name = defaultSettings.title || '合同业务管理系统' // page title
// If your port is set to 80,
// use administrator privileges to execute the command line.
// For example, Mac: sudo npm run
// You can change the port by the following methods:
// port = 9528 npm run dev OR npm run dev --port = 9528
const port = process.env.port || process.env.npm_config_port || 9530 // dev port
// All configuration item explanations can be find in https://cli.vuejs.org/config/
module.exports = {
/**
* You will need to set publicPath if you plan to deploy your site under a sub path,
* for example GitHub Pages. If you plan to deploy your site to https://foo.github.io/bar/,
* then publicPath should be set to "/bar/".
* In most cases please use '/' !!!
* Detail: https://cli.vuejs.org/config/#publicpath
*/
publicPath: '/admin/',
outputDir: '/Users/liuxiangyu/Work/szhedao/app/contract-manage/contract-manage-service/public/admin',
assetsDir: 'static',
lintOnSave: process.env.NODE_ENV === 'development',
productionSourceMap: false,
css: {
loaderOptions: { // 向 CSS 相关的 loader 传递选项
less: {
javascriptEnabled: true
}
}
},
devServer: {
port: port,
open: true,
overlay: {
warnings: false,
errors: true
},
//before: require('./mock/mock-server.js')
proxy: {
[process.env.VUE_APP_BASE_API]: {
//target: 'http://contract.115.langye.net/',
target: 'http://192.168.60.99:9002/',
changeOrigin: true, //配置跨域
pathRewrite: {
['^' + process.env.VUE_APP_BASE_API]: ''
}
}
}
},
configureWebpack: {
// provide the app's title in webpack's name field, so that
// it can be accessed in index.html to inject the correct title.
name: name,
resolve: {
alias: {
'@': resolve('src')
}
}
},
chainWebpack(config) {
// it can improve the speed of the first screen, it is recommended to turn on preload
config.plugin('preload').tap(() => [{
rel: 'preload',
// to ignore runtime.js
// https://github.com/vuejs/vue-cli/blob/dev/packages/@vue/cli-service/lib/config/app.js#L171
fileBlacklist: [/\.map$/, /hot-update\.js$/, /runtime\..*\.js$/],
include: 'initial'
}])
// when there are many pages, it will cause too many meaningless requests
config.plugins.delete('prefetch')
// set svg-sprite-loader
config.module
.rule('svg')
.exclude.add(resolve('src/icons'))
.end()
config.module
.rule('icons')
.test(/\.svg$/)
.include.add(resolve('src/icons'))
.end()
.use('svg-sprite-loader')
.loader('svg-sprite-loader')
.options({
symbolId: 'icon-[name]'
})
.end()
// set preserveWhitespace
config.module
.rule('vue')
.use('vue-loader')
.loader('vue-loader')
.tap(options => {
options.compilerOptions.preserveWhitespace = true
return options
})
.end()
config
.when(process.env.NODE_ENV !== 'development',
config => {
config
.plugin('ScriptExtHtmlWebpackPlugin')
.after('html')
.use('script-ext-html-webpack-plugin', [{
// `runtime` must same as runtimeChunk name. default is `runtime`
inline: /runtime\..*\.js$/
}])
.end()
config
.optimization.splitChunks({
chunks: 'all',
cacheGroups: {
libs: {
name: 'chunk-libs',
test: /[\\/]node_modules[\\/]/,
priority: 10,
chunks: 'initial' // only package third parties that are initially dependent
},
elementUI: {
name: 'chunk-elementUI', // split elementUI into a single package
priority: 20, // the weight needs to be larger than libs and app or it will be packaged into libs or app
test: /[\\/]node_modules[\\/]_?element-ui(.*)/ // in order to adapt to cnpm
},
commons: {
name: 'chunk-commons',
test: resolve('src/components'), // can customize your rules
minChunks: 3, // minimum common number
priority: 5,
reuseExistingChunk: true
}
}
})
// https:// webpack.js.org/configuration/optimization/#optimizationruntimechunk
config.optimization.runtimeChunk('single')
}
)
}
'use strict'
const path = require('path')
const defaultSettings = require('./src/settings.js')
function resolve(dir) {
return path.join(__dirname, dir)
}
const name = defaultSettings.title || '合同业务管理系统' // page title
// If your port is set to 80,
// use administrator privileges to execute the command line.
// For example, Mac: sudo npm run
// You can change the port by the following methods:
// port = 9528 npm run dev OR npm run dev --port = 9528
const port = process.env.port || process.env.npm_config_port || 9530 // dev port
// All configuration item explanations can be find in https://cli.vuejs.org/config/
module.exports = {
/**
* You will need to set publicPath if you plan to deploy your site under a sub path,
* for example GitHub Pages. If you plan to deploy your site to https://foo.github.io/bar/,
* then publicPath should be set to "/bar/".
* In most cases please use '/' !!!
* Detail: https://cli.vuejs.org/config/#publicpath
*/
publicPath: '/admin/',
outputDir: '/Users/liuxiangyu/Work/szhedao/app/contract-manage/contract-manage-service/public/admin',
assetsDir: 'static',
lintOnSave: process.env.NODE_ENV === 'development',
productionSourceMap: false,
css: {
loaderOptions: { // 向 CSS 相关的 loader 传递选项
less: {
javascriptEnabled: true
}
}
},
devServer: {
port: port,
open: true,
overlay: {
warnings: false,
errors: true
},
//before: require('./mock/mock-server.js')
proxy: {
[process.env.VUE_APP_BASE_API]: {
target: 'http://hdcontract.ali251.langye.net',
//target: 'http://192.168.60.99:9002/',
changeOrigin: true, //配置跨域
pathRewrite: {
['^' + process.env.VUE_APP_BASE_API]: ''
}
}
}
},
configureWebpack: {
// provide the app's title in webpack's name field, so that
// it can be accessed in index.html to inject the correct title.
name: name,
resolve: {
alias: {
'@': resolve('src')
}
}
},
chainWebpack(config) {
// it can improve the speed of the first screen, it is recommended to turn on preload
config.plugin('preload').tap(() => [{
rel: 'preload',
// to ignore runtime.js
// https://github.com/vuejs/vue-cli/blob/dev/packages/@vue/cli-service/lib/config/app.js#L171
fileBlacklist: [/\.map$/, /hot-update\.js$/, /runtime\..*\.js$/],
include: 'initial'
}])
// when there are many pages, it will cause too many meaningless requests
config.plugins.delete('prefetch')
// set svg-sprite-loader
config.module
.rule('svg')
.exclude.add(resolve('src/icons'))
.end()
config.module
.rule('icons')
.test(/\.svg$/)
.include.add(resolve('src/icons'))
.end()
.use('svg-sprite-loader')
.loader('svg-sprite-loader')
.options({
symbolId: 'icon-[name]'
})
.end()
// set preserveWhitespace
config.module
.rule('vue')
.use('vue-loader')
.loader('vue-loader')
.tap(options => {
options.compilerOptions.preserveWhitespace = true
return options
})
.end()
config
.when(process.env.NODE_ENV !== 'development',
config => {
config
.plugin('ScriptExtHtmlWebpackPlugin')
.after('html')
.use('script-ext-html-webpack-plugin', [{
// `runtime` must same as runtimeChunk name. default is `runtime`
inline: /runtime\..*\.js$/
}])
.end()
config
.optimization.splitChunks({
chunks: 'all',
cacheGroups: {
libs: {
name: 'chunk-libs',
test: /[\\/]node_modules[\\/]/,
priority: 10,
chunks: 'initial' // only package third parties that are initially dependent
},
elementUI: {
name: 'chunk-elementUI', // split elementUI into a single package
priority: 20, // the weight needs to be larger than libs and app or it will be packaged into libs or app
test: /[\\/]node_modules[\\/]_?element-ui(.*)/ // in order to adapt to cnpm
},
commons: {
name: 'chunk-commons',
test: resolve('src/components'), // can customize your rules
minChunks: 3, // minimum common number
priority: 5,
reuseExistingChunk: true
}
}
})
// https:// webpack.js.org/configuration/optimization/#optimizationruntimechunk
config.optimization.runtimeChunk('single')
}
)
}
}

Loading…
Cancel
Save