Merge pull request 'feat : 前置流程组件' (#611) from dd into master

Reviewed-on: http://git.feashow.cn/clay/mosr-web/pulls/611
2024-07-24 11:42:33 +00:00
parent d2e672e761 b9de011871
commit d769ec9755
4 changed files with 226 additions and 13 deletions
--- 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',
--- 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: '提示',
--- a/src/components/SelectPreProcess.vue
+++ 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>
--- 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])