|
@@ -1,26 +1,56 @@
|
|
|
<template>
|
|
|
- <div class="_ProjectCenterBook">
|
|
|
+ <div class="oa-sys-list-view">
|
|
|
<div class="searchBox">
|
|
|
<div class="form">
|
|
|
- <span class="formSpan">合同类别:</span>
|
|
|
- <el-select width="160px" v-model="contractType" class="m-2" placeholder="请选择行业">
|
|
|
- <el-option
|
|
|
- v-for="item in contractTypes"
|
|
|
- :key="item.value"
|
|
|
- :label="item.label"
|
|
|
- :value="item.value"
|
|
|
- />
|
|
|
+ <span class="formSpan">项目名称:</span>
|
|
|
+ <el-input
|
|
|
+ v-model="queryParams.projectName"
|
|
|
+ placeholder="请输入项目名称"
|
|
|
+ style="width: 210px"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <div class="form">
|
|
|
+ <span class="formSpan">项目编号:</span>
|
|
|
+ <el-input
|
|
|
+ v-model="queryParams.projectNumber"
|
|
|
+ placeholder="请输入项目名称"
|
|
|
+ style="width: 160px"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <div class="form">
|
|
|
+ <span class="formSpan">合同类型:</span>
|
|
|
+ <el-select
|
|
|
+ v-model="queryParams.applyType"
|
|
|
+ placeholder="请选择合同类型"
|
|
|
+ style="width: 160px"
|
|
|
+ >
|
|
|
+ <el-option label="全部" :value="-1" />
|
|
|
+ <el-option label="分包合同" :value="1" />
|
|
|
+ <el-option label="外包合同" :value="2" />
|
|
|
</el-select>
|
|
|
</div>
|
|
|
<div class="from">
|
|
|
<div class="btnBox">
|
|
|
<el-button type="primary" style="background: #3485ff" @click="searchHandle">
|
|
|
<img src="@/assets/imgs/OA/search.png" class="mr-8px" alt="" />
|
|
|
- 查询
|
|
|
- </el-button>
|
|
|
+ 查询</el-button
|
|
|
+ >
|
|
|
+ <el-button type="danger">
|
|
|
+ <img src="@/assets/imgs/OA/open.png" class="mr-8px" alt="" />
|
|
|
+ 发起用款</el-button
|
|
|
+ >
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <div class="infoBox">
|
|
|
+ <ul>
|
|
|
+ <li v-for="(item, index) in infoList" :key="index" class="mr-40px">
|
|
|
+ <img class="mr-8px" :src="getAssetURL(item.icon)" alt="" />
|
|
|
+ <p>{{ item.name }}:</p>
|
|
|
+ <h4 class="font-size-18px">{{ item.num }}</h4>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
<div class="tableBox">
|
|
|
<div class="table" ref="tableRef">
|
|
|
<el-table
|
|
@@ -33,23 +63,29 @@
|
|
|
color: '#233755',
|
|
|
height: '50px'
|
|
|
}"
|
|
|
+ @selection-change="handleSelectionChange"
|
|
|
+ row-key="id"
|
|
|
>
|
|
|
+ <el-table-column type="selection" width="55" />
|
|
|
<el-table-column label="序号" width="60">
|
|
|
<template #default="scope">{{ scope.$index + 1 }}</template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column :show-overflow-tooltip="true" prop="xmmc" label="项目名称" />
|
|
|
- <el-table-column prop="applyDate" label="责任部门" />
|
|
|
- <el-table-column prop="subAmount" label="分/外包合同额" />
|
|
|
- <el-table-column prop="subShareWay" label="供应商" />
|
|
|
- <el-table-column prop="applyWorker" label="申请人" />
|
|
|
- <el-table-column prop="applyDate" label="申请时间" />
|
|
|
+ <el-table-column :show-overflow-tooltip="true" prop="contractName" label="合同名称" />
|
|
|
+ <el-table-column :show-overflow-tooltip="true" prop="applyType" label="合同类型">
|
|
|
+ <template #default="scope">{{
|
|
|
+ scope.row.applyType === 1 ? '分包合同' : scope.row.applyType === 2 ? '外包合同' : ''
|
|
|
+ }}</template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column :show-overflow-tooltip="true" prop="projectName" label="项目名称" />
|
|
|
+ <el-table-column :show-overflow-tooltip="true" prop="projectNumber" label="项目编号" />
|
|
|
+ <el-table-column prop="zrbm" label="责任部门" width="180" />
|
|
|
+ <el-table-column prop="contractAmount" label="分/外包合同额" width="160" />
|
|
|
+ <el-table-column prop="zrbm" label="供应商" width="160" />
|
|
|
+ <el-table-column prop="applyWorker" label="申请人" width="160" />
|
|
|
<el-table-column label="操作" fixed="right" width="80">
|
|
|
<template #default="scope">
|
|
|
<div class="operateBtn" @click="operateClick(scope.row)">
|
|
|
- <span>查看流程</span>
|
|
|
- </div>
|
|
|
- <div class="operateBtn" @click="operateClick(scope.row)">
|
|
|
- <span>查看合同签订流程</span>
|
|
|
+ <span>查看</span>
|
|
|
</div>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
@@ -58,10 +94,10 @@
|
|
|
<div class="pageBox">
|
|
|
<el-pagination
|
|
|
v-model:current-page="queryParams.pageNo"
|
|
|
- :page-size="15"
|
|
|
+ :page-size="10"
|
|
|
background
|
|
|
layout="total, prev, pager, next, jumper"
|
|
|
- :total="totalPage"
|
|
|
+ :total="total"
|
|
|
@current-change="handleCurrentChange"
|
|
|
/>
|
|
|
</div>
|
|
@@ -69,71 +105,127 @@
|
|
|
</div>
|
|
|
</template>
|
|
|
<script setup lang="ts">
|
|
|
-import { PageParam } from '@/interface/common'
|
|
|
+import { useRouter } from 'vue-router'
|
|
|
+import { ElMessage } from 'element-plus'
|
|
|
+import { getAssetURL } from '@/utils/auth'
|
|
|
import request from '@/config/axios'
|
|
|
-import { useMutation } from '@tanstack/vue-query'
|
|
|
-import { reactive } from 'vue'
|
|
|
|
|
|
-/**
|
|
|
- * 分包合同和外包合同列表
|
|
|
- * **/
|
|
|
-defineOptions({ name: 'SubContractAndOutsourcing' })
|
|
|
-interface SearchFormInterface extends PageParam {
|
|
|
+defineOptions({ name: 'ProjectBook' })
|
|
|
+const router = useRouter()
|
|
|
+const tableRef: any = ref(null)
|
|
|
+const tableHeight: any = ref(0)
|
|
|
+
|
|
|
+interface PageParam {
|
|
|
+ pageNo: number
|
|
|
+ pageSize: number
|
|
|
+}
|
|
|
+interface QueryParams extends PageParam {
|
|
|
projectName: string
|
|
|
+ projectNumber: string
|
|
|
+ applyType: number
|
|
|
}
|
|
|
-const queryParams = ref<SearchFormInterface>({
|
|
|
+const queryParams = reactive<QueryParams>({
|
|
|
+ projectName: '',
|
|
|
+ projectNumber: '',
|
|
|
+ applyType: -1,
|
|
|
pageNo: 1,
|
|
|
- pageSize: 10,
|
|
|
- projectName: ''
|
|
|
+ pageSize: 10
|
|
|
})
|
|
|
-const tableData = ref<any>()
|
|
|
-const totalPage = ref<number>(0)
|
|
|
-const contractType = ref<number>(0)
|
|
|
-const contractTypes = reactive([
|
|
|
+
|
|
|
+const infoList: any = ref([
|
|
|
{
|
|
|
- label: '全部',
|
|
|
- value: 0
|
|
|
+ icon: 'xmzx/xmzcz',
|
|
|
+ name: '合同总额(元)',
|
|
|
+ num: '0'
|
|
|
},
|
|
|
{
|
|
|
- label: '分包合同',
|
|
|
- value: 1
|
|
|
+ icon: 'xmzx/xmzcb',
|
|
|
+ name: '已付(元)',
|
|
|
+ num: '0'
|
|
|
},
|
|
|
{
|
|
|
- label: '外包合同',
|
|
|
- value: 2
|
|
|
+ icon: 'xmzx/xmzlr',
|
|
|
+ name: '未付(元)',
|
|
|
+ num: '0'
|
|
|
}
|
|
|
])
|
|
|
+/**
|
|
|
+ * 分外包合同查询列表
|
|
|
+ */
|
|
|
+const tableData = ref<Array<any>>([])
|
|
|
+const total = ref<number>()
|
|
|
+const searchHandle: () => void = () => {
|
|
|
+ queryProjectListAjax()
|
|
|
+}
|
|
|
+const queryProjectListAjax = async (): Promise<void> => {
|
|
|
+ const urlApi = `/contract-apply/page`
|
|
|
+ const sendData: {
|
|
|
+ applyType: number | null
|
|
|
+ } = {
|
|
|
+ ...queryParams
|
|
|
+ }
|
|
|
+ if (queryParams.applyType === -1) {
|
|
|
+ sendData['applyType'] = null
|
|
|
+ }
|
|
|
+ const result = await request.post({ url: urlApi, data: sendData }, '/business')
|
|
|
+ tableData.value = result['records']
|
|
|
+ total.value = result['total']
|
|
|
+}
|
|
|
+queryProjectListAjax()
|
|
|
|
|
|
-const querySubContractAndOutsourcingByPage = async () => {
|
|
|
- const subContractUrl: string = '/subcontract-apply/page'
|
|
|
- const outsourcingUrl: string = '/outsource-apply/page'
|
|
|
- return await request.post(
|
|
|
+const handleCurrentChange = (pageNo: number) => {
|
|
|
+ queryParams.pageNo = pageNo
|
|
|
+ queryProjectListAjax()
|
|
|
+}
|
|
|
+/**
|
|
|
+ * 发起签订流程
|
|
|
+ */
|
|
|
+const currentProcess = ref<{
|
|
|
+ id: string
|
|
|
+ applyType: number
|
|
|
+ isSign: number
|
|
|
+} | null>(null)
|
|
|
+const handleSelectionChange = (arrs) => {
|
|
|
+ if (arrs.length === 0) return
|
|
|
+ const item = arrs[arrs.length - 1]
|
|
|
+ alert(item.isSign)
|
|
|
+ currentProcess.value = {
|
|
|
+ id: item.id,
|
|
|
+ applyType: item.applyType,
|
|
|
+ isSign: item.isSign
|
|
|
+ }
|
|
|
+}
|
|
|
+const processSubmit = async (): Promise<void> => {
|
|
|
+ let urlApi: string = ''
|
|
|
+ if (currentProcess.value?.applyType === null) return
|
|
|
+ if (currentProcess.value?.isSign === 0) {
|
|
|
+ ElMessage.warning('该合同不能签合同,无法发起合同签订!')
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if (currentProcess.value?.applyType === 1) {
|
|
|
+ urlApi = `/subcontract/process`
|
|
|
+ } else if (currentProcess.value?.applyType === 2) {
|
|
|
+ urlApi = `/outsourcing/process`
|
|
|
+ }
|
|
|
+ const result = await request.get(
|
|
|
{
|
|
|
- url: contractType.value === 1 ? subContractUrl : outsourcingUrl,
|
|
|
- data: queryParams.value
|
|
|
+ url: urlApi,
|
|
|
+ params: {
|
|
|
+ applyId: currentProcess.value?.id
|
|
|
+ }
|
|
|
},
|
|
|
'/business'
|
|
|
)
|
|
|
+ console.log('result----------------------------')
|
|
|
+ console.log(result)
|
|
|
}
|
|
|
-const { mutate: querySubContractAndOutsourcingMutate } = useMutation(
|
|
|
- querySubContractAndOutsourcingByPage,
|
|
|
- {
|
|
|
- onSuccess: (data) => {
|
|
|
- tableData.value = data?.records
|
|
|
- totalPage.value = data?.total
|
|
|
- }
|
|
|
- }
|
|
|
-)
|
|
|
-
|
|
|
-querySubContractAndOutsourcingMutate()
|
|
|
-
|
|
|
-const handleCurrentChange = (val: number) => {
|
|
|
- queryParams.value.pageNo = val
|
|
|
- querySubContractAndOutsourcingMutate()
|
|
|
-}
|
|
|
-const searchHandle = () => {
|
|
|
- queryParams.value.pageNo = 1
|
|
|
- querySubContractAndOutsourcingMutate()
|
|
|
+const operateClick = (row: any) => {
|
|
|
+ router.push({
|
|
|
+ path: '/projectDetail',
|
|
|
+ query: { id: row.id }
|
|
|
+ })
|
|
|
}
|
|
|
-const operateClick = (item) => {}
|
|
|
+onMounted(() => {
|
|
|
+ tableHeight.value = tableRef.value.clientHeight
|
|
|
+})
|
|
|
</script>
|