From b9de0118716ae673d8b7dc1ae640e3e305375ad1 Mon Sep 17 00:00:00 2001
From: odjbin <1042039504@qq.com>
Date: Wed, 24 Jul 2024 19:42:20 +0800
Subject: [PATCH] =?UTF-8?q?feat=20:=20=E5=89=8D=E7=BD=AE=E6=B5=81=E7=A8=8B?=
 =?UTF-8?q?=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../DetailComponent/SpecialFundDetail.vue     |  23 +++
 .../DetailComponent/SummaryDetail.vue         |  29 +--
 src/components/SelectPreProcess.vue           | 165 ++++++++++++++++++
 src/views/special-fund/add.vue                |  22 +++
 4 files changed, 226 insertions(+), 13 deletions(-)
 create mode 100644 src/components/SelectPreProcess.vue

diff --git a/src/components/DetailComponent/SpecialFundDetail.vue b/src/components/DetailComponent/SpecialFundDetail.vue
index 549549b..71e670e 100644
--- a/src/components/DetailComponent/SpecialFundDetail.vue
+++ b/src/components/DetailComponent/SpecialFundDetail.vue
@@ -84,6 +84,8 @@
     </el-form>
     <opinion v-if="data.taskId" :formData="data.formData" :taskId="data.taskId"
              v-model:value="formData.auditOpinion"></opinion>
+    <file-preview ref="filePreviewRef"  v-if="filePreviewShow" :fileName="filePreviewParam.fileName" :fileUrl="filePreviewParam.fileUrl"
+                  :fileType="filePreviewParam.fileType"/>
   </div>
 </template>
 
@@ -132,6 +134,7 @@ const projectTable = reactive({
       prop: 'projectName',
       label: '项目名称',
       align: 'center',
+      width: 400
     },
     {
       prop: 'specialFundAmount',
@@ -171,6 +174,9 @@ const fileTable = reactive({
       prop: 'originalFileName',
       label: '文件名',
       align: 'center',
+      width: 400,
+      showOverflowTooltip: false,
+      currentRender: ({row, index}) => (<div style="color: #2a99ff;cursor: pointer;" onClick={()=>clickToPreview(row)}>{row.originalFileName}</div>)
     },
     {
       prop: 'tag',
@@ -195,6 +201,23 @@ const fileTable = reactive({
     }
   ]
 })
+const filePreviewParam = ref({
+  fileUrl: '',
+  fileName: '',
+  fileType: 'pdf'
+})
+const filePreviewShow = ref(false)
+const clickToPreview=(row)=>{
+  filePreviewShow.value = false
+  filePreviewParam.value = {
+    fileUrl: row.url,
+    fileName: row.originalFileName,
+    fileType: row.fileType
+  }
+  nextTick(()=>{
+    filePreviewShow.value = true
+  })
+}
 const handleView=(row)=>{
   router.push({
     name: 'Implementation/detail',
diff --git a/src/components/DetailComponent/SummaryDetail.vue b/src/components/DetailComponent/SummaryDetail.vue
index 9358d2a..5ed0906 100644
--- a/src/components/DetailComponent/SummaryDetail.vue
+++ b/src/components/DetailComponent/SummaryDetail.vue
@@ -164,20 +164,20 @@
               />
             </el-form-item>
           </div>
+          <div v-if="data.state==='5'" style="margin-bottom: 15px">
+            <baseTitle title="前置流程"></baseTitle>
+            <div style="display: flex;align-items: center;flex-wrap: wrap;margin-bottom: 10px">
+              <div v-for="(item,index) in localFormData.preProcess" :key="item.requestId">
+                <a :href="item.baseUrl" target="_blank"
+                   style="color: #2a99ff;cursor: pointer">{{ item.requestName }}<span
+                    v-if="index != localFormData.preProcess.length -1">，</span>
+                </a>
+              </div>
+            </div>
+          </div>
           <div v-perm="['annual:plan:approve']" v-if="data.state==='4'">
             <baseTitle title="前置流程"></baseTitle>
-            <div>
-              <el-button color="#DED0B2" style="margin-right: 10px">
-                选择
-              </el-button>
-              <!--            <div v-for="item in getRequestName(localFormData.preProcess)" :key="item.requestId">-->
-              <!--              <a :href="item.baseUrl" target="_blank"-->
-              <!--                 style="color: #2a99ff;margin-right: 10px;cursor: pointer">{{ item.requestName }}-->
-              <!--              </a>-->
-              <!--            </div>-->
-
-
-            </div>
+            <select-pre-process :formData="localFormData"/>
             <baseTitle title="审核意见"></baseTitle>
             <el-form-item prop="_value">
               <el-input
@@ -229,6 +229,7 @@ import {getSubCompOpt} from "@/api/user/user";
 import FileComponent from "./FileComponent.vue";
 import {ElNotification} from "element-plus";
 import {approvePlan} from "@/api/project-demand/summary";
+import SelectPreProcess from "@/components/SelectPreProcess.vue";
 
 const emit = defineEmits(['update:value'])
 const tagsViewStore = useTagsView()
@@ -311,9 +312,11 @@ const handleAgreePlan = async () => {
   const params = {
     auditOpinion: _value.value,
     projectId: parseInt(route.query.projectId),
+    preProcess: JSON.stringify(localFormData.value.preProcess),
     state: true
   }
-  // console.log('params', params)
+
+  console.log('params', params)
   const res = await approvePlan(params)
   ElNotification({
     title: '提示',
diff --git a/src/components/SelectPreProcess.vue b/src/components/SelectPreProcess.vue
new file mode 100644
index 0000000..93cf6c1
--- /dev/null
+++ b/src/components/SelectPreProcess.vue
@@ -0,0 +1,165 @@
+<template>
+ <div style="display: flex;align-items: center">
+   <el-button color="#DED0B2" @click="handleShowPreTable" style="margin-right: 10px">
+     {{
+       localFormData.preProcess && localFormData.preProcess.length > 0 ? '更改' : '请选择前置流程'
+     }}
+   </el-button>
+   <div v-for="(item,index) in localFormData.preProcess" :key="item.requestId">
+     <a :href="item.baseUrl" target="_blank"
+        style="color: #2a99ff;cursor: pointer">{{ item.requestName }}<span v-if="index != localFormData.preProcess.length -1">，</span>
+     </a>
+   </div>
+ </div>
+  <el-dialog v-if="showPreTable" title="前置流程" v-model="showPreTable" width="80%">
+    <el-form :model="preProcessForm" inline @submit.prevent="getPreProcessList">
+      <el-form-item label="请求名称">
+        <el-input v-model="preProcessForm.requestName" placeholder="请输入请求名称" clearable>
+        </el-input>
+      </el-form-item>
+      <el-form-item>
+        <el-button color="#DED0B2" @click="getPreProcessList">搜索</el-button>
+        <el-button @click="handleReset">重置</el-button>
+      </el-form-item>
+    </el-form>
+    <el-table :data="preProcessList" v-loading="loading"
+              @select="handleSelect" @select-all="handleSelect" row-key="requestId" ref="preProcessTable">
+      <el-table-column type="selection" width="55" :reserve-selection="true"/>
+      <el-table-column prop="requestId" label="请求id"></el-table-column>
+      <el-table-column prop="requestName" label="请求名称"></el-table-column>
+      <el-table-column prop="lastOperatorName" label="最后操作人名称"></el-table-column>
+      <el-table-column prop="lastOperateTime" label="最后操作时间"></el-table-column>
+      <el-table-column prop="currentNodeName" label="当前节点"></el-table-column>
+      <el-table-column prop="creatorName" label="创建人"></el-table-column>
+      <el-table-column prop="createTime" label="创建时间"></el-table-column>
+      <el-table-column label="操作" align="center">
+        <template #default="scope">
+          <a :href="scope.row.baseUrl" target="_blank" style="color: #2a99ff;margin-left: 10px">查看流程</a>
+        </template>
+      </el-table-column>
+    </el-table>
+    <paging :current-page="pageInfo.pageNum" :page-size="pageInfo.pageSize" :page-sizes="[10, 20, 30, 40,50]"
+            :total="total" @changeSize="handleSizeChange" @goPage="handleCurrentChange"/>
+    <div class="oper">
+      <el-button color="#DED0B2" @click="choosePreProcess">确定</el-button>
+      <el-button @click="handleCancel">取消</el-button>
+    </div>
+  </el-dialog>
+
+</template>
+
+<script setup>
+import {
+  getPreProcess
+} from "@/api/project-manage";
+import Paging from "@/components/pagination/index.vue";
+const props = defineProps({
+  formData: {
+    type: Object,
+    default: {}
+  },
+})
+const loading = ref(false)
+//暂存数据
+const currentList = ref([])
+const showPreTable = ref(false)
+const selectRows = ref([])
+const preProcessList = ref([])
+const total = ref(0)
+const localFormData = ref({
+  projectPersonIds: [],
+  projectChargePerson: null,
+  preProcess: [
+    // {
+    //   requestId: null,
+    //   requestName: '',
+    //   baseUrl: ''
+    // }
+  ]
+})
+const preProcessForm = reactive({
+  requestName: ''
+})
+const pageInfo = reactive({
+  pageNum: 1,
+  pageSize: 10,
+})
+const handleReset = () => {
+  preProcessForm.requestName = ''
+  getPreProcessList()
+}
+const handleSelect = async (selection) => {
+  selectRows.value = selection
+}
+const handleShowPreTable = () => {
+  showPreTable.value = true
+  getPreProcessList()
+}
+const handleCancel = () => {
+  showPreTable.value = false
+}
+
+const choosePreProcess = () => {
+  let preProcessObj = {}
+  let preProcessArray = []
+  selectRows.value.forEach((item) => {
+    preProcessObj = {
+      requestId: item.requestId,
+      requestName: item.requestName,
+      baseUrl: item.baseUrl
+    }
+    preProcessArray.push(preProcessObj)
+  })
+  localFormData.value.preProcess = preProcessArray
+  showPreTable.value = false
+  localStorage.setItem('preProcess', JSON.stringify(preProcessArray))
+}
+
+const getPreProcessList = () => {
+  console.log('getPreProcessList')
+  loading.value = true
+  getPreProcess().then(res => {
+    loading.value = false
+    let searchArray = []
+    let regexPattern = ("%" + preProcessForm.requestName + "%").replace(/%/g, '.*').replace(/_/g, '.');
+    let regex = new RegExp('^' + regexPattern + '$');
+    res.data.filter((item) => {
+      if (regex.test(item.requestName)) {
+        searchArray.push(item)
+      }
+    })
+    // res.data.forEach((item) => {
+    //   localFormData.value.preProcess.forEach((item1) => {
+    //     if (item.requestId == item1.requestId) {
+    //       preProcessTable.value.toggleRowSelection(item)
+    //     }
+    //   })
+    // })
+    total.value = searchArray.length
+    currentList.value = searchArray
+    preProcessList.value = currentList.value.slice(0, 10)
+  })
+}
+//切换每页显示条数
+const handleSizeChange = (val) => {
+  pageInfo.pageSize = val;
+  preProcessList.value = currentList.value.slice((pageInfo.pageNum - 1) * val, pageInfo.pageNum * val)
+};
+
+//点击页码进行分页功能
+const handleCurrentChange = (val) => {
+  pageInfo.pageNum = val;
+  preProcessList.value = currentList.value.slice((val - 1) * pageInfo.pageSize, val * pageInfo.pageSize)
+};
+watchEffect(() => {
+ return  Object.keys(props.formData).length && (localFormData.value = props.formData)
+})
+</script>
+
+<style scoped>
+.oper {
+  margin-top: 20px;
+  display: flex;
+  justify-content: flex-end;
+}
+</style>
diff --git a/src/views/special-fund/add.vue b/src/views/special-fund/add.vue
index 4ca5da7..07d9d2e 100644
--- a/src/views/special-fund/add.vue
+++ b/src/views/special-fund/add.vue
@@ -43,6 +43,8 @@
       <el-button color="#DED0B2" v-else @click="handleResubmit">重新提交</el-button>
       <el-button @click="handleBack">返回</el-button>
     </div>
+    <file-preview ref="filePreviewRef"  v-if="filePreviewShow" :fileName="filePreviewParam.fileName" :fileUrl="filePreviewParam.fileUrl"
+                  :fileType="filePreviewParam.fileType"/>
   </div>
 </template>
 
@@ -84,6 +86,8 @@ const tableConfig = reactive({
       prop: 'originalFileName',
       label: '文件名',
       align: 'center',
+      showOverflowTooltip: false,
+      currentRender: ({row, index}) => (<div style="color: #2a99ff;cursor: pointer;" onClick={()=>clickToPreview(row)}>{row.originalFileName}</div>)
     },
     {
       prop: 'tag',
@@ -120,6 +124,24 @@ const rules = reactive({
   fundAmount: [{required: true, message: '请输入金额', trigger: 'blur'}],
   introduce: [{required: true, message: '请输入介绍', trigger: 'blur'}],
 })
+
+const filePreviewParam = ref({
+  fileUrl: '',
+  fileName: '',
+  fileType: 'pdf'
+})
+const filePreviewShow = ref(false)
+const clickToPreview=(row)=>{
+  filePreviewShow.value = false
+  filePreviewParam.value = {
+    fileUrl: row.url,
+    fileName: row.originalFileName,
+    fileType: row.fileType
+  }
+  nextTick(()=>{
+    filePreviewShow.value = true
+  })
+}
 const handleDownload = (row) => {
   downloadFile(row.fileId).then(res => {
     const blob = new Blob([res])