You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
238 lines
7.1 KiB
238 lines
7.1 KiB
<template> |
|
<div class="box"> |
|
<el-row> |
|
<el-col :span="24"> |
|
<el-breadcrumb separator="/"> |
|
<el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item> |
|
<el-breadcrumb-item>合同管理</el-breadcrumb-item> |
|
</el-breadcrumb> |
|
</el-col> |
|
</el-row> |
|
<div class="container"> |
|
<el-row> |
|
<el-form |
|
:inline="true" |
|
:model="formInline" |
|
size="small" |
|
class="demo-form-inline" |
|
> |
|
<el-form-item label="合同名称" label-width="100px"> |
|
<el-input |
|
v-model="formInline.name" |
|
placeholder="合同名称" |
|
></el-input> |
|
</el-form-item> |
|
<el-form-item label="项目编号" label-width="100px"> |
|
<el-input |
|
v-model="formInline.pnum" |
|
placeholder="项目编号" |
|
></el-input> |
|
</el-form-item> |
|
<el-form-item label="合同编号" label-width="100px"> |
|
<el-input |
|
v-model="formInline.cnum" |
|
placeholder="项目编号" |
|
></el-input> |
|
</el-form-item> |
|
<el-form-item label="乙方公司" label-width="100px"> |
|
<el-input |
|
v-model="formInline.company" |
|
placeholder="乙方公司" |
|
></el-input> |
|
</el-form-item> |
|
<el-form-item label="签订日期" label-width="100px"> |
|
<el-date-picker |
|
v-model="formInline.rangeDate1" |
|
type="daterange" |
|
range-separator="至" |
|
start-placeholder="开始日期" |
|
end-placeholder="结束日期" |
|
> |
|
</el-date-picker> |
|
</el-form-item> |
|
<el-form-item label="交接日期" label-width="100px"> |
|
<el-date-picker |
|
v-model="formInline.rangeDate2" |
|
type="daterange" |
|
range-separator="至" |
|
start-placeholder="开始日期" |
|
end-placeholder="结束日期" |
|
> |
|
</el-date-picker> |
|
</el-form-item> |
|
<el-form-item label="状态" label-width="100px"> |
|
<el-select v-model="formInline.status" placeholder="状态"> |
|
<el-option label="科室签字" value="1"></el-option> |
|
<el-option label="财务审核" value="2"></el-option> |
|
<el-option label="审核监管科审核" value="3"></el-option> |
|
<el-option label="公司整改" value="4"></el-option> |
|
<el-option label="法务审核" value="5"></el-option> |
|
<el-option label="印章申请" value="6"></el-option> |
|
</el-select> |
|
</el-form-item> |
|
<el-form-item> |
|
<el-button type="primary" @click="onSubmit">查询</el-button> |
|
<el-button style="margin-left: 64px" type="primary" @click="onAdd" |
|
>新增</el-button |
|
> |
|
<el-button type="primary" @click="onDelete">删除</el-button> |
|
<el-button type="primary" @click="onBatch">批量操作</el-button> |
|
</el-form-item> |
|
</el-form> |
|
</el-row> |
|
<el-table |
|
ref="multipleTable" |
|
fit |
|
border |
|
height="400" |
|
:data="tableData" |
|
tooltip-effect="dark" |
|
:show-overflow-tooltip="true" |
|
style="width: 100%; background-color: none" |
|
@selection-change="handleSelectionChange" |
|
> |
|
<el-table-column type="selection" width="55"> </el-table-column> |
|
<el-table-column type="index" width="50"> </el-table-column> |
|
<el-table-column prop="name" label="合同名称" width="200"> |
|
</el-table-column> |
|
<el-table-column prop="pname" label="项目名称" width="200"> |
|
</el-table-column> |
|
<el-table-column prop="company" label="乙方" width="120"> |
|
</el-table-column> |
|
<el-table-column prop="cnum" label="合同编号"> </el-table-column> |
|
|
|
<el-table-column prop="pnum" label="项目编号"> </el-table-column> |
|
<el-table-column prop="rDate" label="采购交接日期" width="120"> |
|
</el-table-column> |
|
<el-table-column prop="sdate" label="签订日期" width="120"> |
|
</el-table-column> |
|
<el-table-column label="状态"> |
|
<template slot-scope="scope" |
|
><a |
|
style="cursor: pointer" |
|
@click="handleDetailChange(scope.row)" |
|
>{{ scope.row.status }}</a |
|
></template |
|
> |
|
</el-table-column> |
|
</el-table> |
|
<el-pagination |
|
@size-change="handleSizeChange" |
|
@current-change="handleCurrentChange" |
|
:current-page="currentPage" |
|
:page-sizes="[20, 50, 100, 200, 400]" |
|
:page-size="20" |
|
layout="total, sizes, prev, pager, next, jumper" |
|
:total="400" |
|
> |
|
</el-pagination> |
|
</div> |
|
</div> |
|
</template> |
|
|
|
<script> |
|
import contractDataList from "../../data/contractDataList"; |
|
|
|
export default { |
|
data() { |
|
return { |
|
formInline: { |
|
name: "", //合同明好才能 |
|
pnum: "", //项目编号 |
|
cnum: "", //合同编号 |
|
rangeDate1: "", //签订日期 |
|
rangeDate2: "", //交接日期 |
|
status: "", //状态 |
|
company: "", //乙方公司 |
|
}, |
|
tableData: contractDataList, |
|
currentPage: 1, |
|
multipleSelection: [], |
|
checkedCities: [ |
|
"序号", |
|
"计划年度", |
|
"采购权限", |
|
"科室", |
|
"设备名称", |
|
"数量", |
|
], |
|
dialogExportVisible: false, |
|
}; |
|
}, |
|
methods: { |
|
onSubmit() { |
|
console.log(this.formInline); |
|
}, |
|
onAdd() { |
|
console.log("onAdd"); |
|
this.$router.push({ path: "/contractDetail" }); |
|
}, |
|
onDelete() { |
|
//确认勾选数据 |
|
if (this.multipleSelection.length == 0) { |
|
this.$message.error("请勾选的数据！"); |
|
return; |
|
} |
|
this.$confirm("确定删除?", "提示", { |
|
confirmButtonText: "确定", |
|
cancelButtonText: "取消", |
|
type: "warning", |
|
}) |
|
.then(() => { |
|
this.$message({ |
|
type: "success", |
|
message: "删除成功!", |
|
}); |
|
}) |
|
.catch(() => { |
|
this.$message({ |
|
type: "info", |
|
message: "已取消删除", |
|
}); |
|
}); |
|
console.log("onDelete"); |
|
}, |
|
onExport() { |
|
//确认勾选数据 |
|
if (this.multipleSelection.length == 0) { |
|
this.$message.error("请勾选数据！"); |
|
return; |
|
} |
|
//弹出对话框 |
|
this.dialogExportVisible = true; |
|
}, |
|
onBatch() { |
|
console.log("onBatch"); |
|
}, |
|
handleSelectionChange(val) { |
|
this.multipleSelection = val; |
|
console.log("handleSelectionChange:", val); |
|
}, |
|
handleSizeChange(val) { |
|
console.log(`每页 ${val} 条`); |
|
}, |
|
handleCurrentChange(val) { |
|
console.log(`当前页: ${val}`); |
|
}, |
|
handleDetailChange(val) { |
|
this.$router.push({ path: "/contractDetail", query: { id: val.id } }); |
|
}, |
|
}, |
|
}; |
|
</script> |
|
|
|
<style scoped> |
|
.el-row { |
|
margin: 10px; |
|
} |
|
|
|
a { |
|
text-decoration: underline; |
|
} |
|
|
|
.container { |
|
width: calc(100% - 48px); |
|
height: calc(100vh - 160px); |
|
margin: 12px 12px 0 24px; |
|
} |
|
</style> |