Преглед изворни кода

```
feat(workflowTrade): 增加工作流详情查询和编辑功能

- 新增 questEdit API 接口用于更新需求工作流
- 修改 getQuestDetail 接口参数从 questId 改为 id
- 添加 cursor-pointer 样式到搜索平台页面
- 实现工作流详情页技能标签动态渲染
- 在工作流交易页面添加路由监听,支持返回时刷新列表
- 完善工作流交易添加页面的编辑功能,支持详情回显
```

zhangningning пре 1 месец
родитељ
комит
5f54f4b221

+ 8 - 4
src/api/workflowTrade.js

@@ -4,12 +4,16 @@ import request from './request.js'
 export function questAdd(data = {}) {
   return request.post('/quest',data)
 }
+// 查询寻找工作流详情
+export function getQuestDetail(data = {}) {
+  return request.get('/quest/'+data.id)
+}
+// 更新需求工作流
+export function questEdit(data = {}) {
+  return request.put('/quest',data)
+}
 
 // 查询寻找工作流列表
 export function getQuestList(data = {}) {
   return request.get('/quest/list',data)
-}
-// 查询寻找工作流详情
-export function getQuestDetail(data = {}) {
-  return request.get('/quest/'+data.questId)
 }

+ 1 - 1
src/pages/SearchPlatform.vue

@@ -21,7 +21,7 @@
             <img :src="addIcon" alt="" class="icon-add">
             {{$t('common.chuangjiangongzuoliu')}}
           </button>
-          <div class="flex-center-between border_radius_10 pad20" style="background: #EAF0FF;height: 56px;">
+          <div class="flex-center-between border_radius_10 pad20 cursor-pointer" style="background: #EAF0FF;height: 56px;">
             <img :src="n8Icon" alt="" style="width: 30px; height: 30px;" class="mr10">
             <div class="font_size18 color_theme">{{$t('common.go')}}{{activePlatform}}</div>
             <el-icon :size="24" color="#2D71FF"><CaretRight /></el-icon>

+ 12 - 3
src/pages/WorkflowDetail.vue

@@ -85,7 +85,7 @@
                 <div class="ml10 flex_1">
                   <div class="font_size18 bold">{{ruleForm.nickName || ''}}</div>
                   <div class="gap5 mt5">
-                    <el-tag type="primary" v-for="item in 5" :key="item" >技能标签</el-tag>
+                    <el-tag type="primary" v-for="item in skillTags" :key="item" >{{item}}</el-tag>
                   </div>
                 </div>
               </div>
@@ -160,7 +160,7 @@ const router = useRouter()
 const route = useRoute()
 import { useAppStore } from '@/pinia/appStore'
 const appStore = useAppStore()
-import { ref, onMounted, nextTick } from 'vue'
+import { ref, onMounted, nextTick, computed } from 'vue'
 //获取参数
 const query = route.query
 const publishId = ref(query.publishId || '');
@@ -179,7 +179,16 @@ const ruleForm = ref({
   previewImage: '',
   coverImage: '',
   workflowContent: '',
-})
+  skillTags:''
+});
+
+//计算属性skillTags
+const skillTags = computed(() => {
+  if(ruleForm.value.skillTags){
+    return ruleForm.value.skillTags.split(',');
+  }
+  return [];
+});
 
 onMounted(() => {
   getPublishDetail({id:publishId.value}).then(res => {

+ 16 - 2
src/pages/workflowTrade/workflowTrade.vue

@@ -157,7 +157,7 @@
   const router = useRouter()
   const route = useRoute()
   console.log(router,route)
-  import { ref, computed, reactive, onMounted, inject } from 'vue'
+  import { ref, computed, reactive, onMounted, inject, watch } from 'vue'
   import { useAppStore } from '@/pinia/appStore'
   const appStore = useAppStore();
   const openLoginDialog = inject('openLoginDialog')
@@ -190,8 +190,22 @@
     orderByColumn: 'questId',
     isAsc: 'desc'
   })
+
+  //新增返回后,刷新列表
+  // 监听路由变化,当从子路由返回到父路由时刷新列表
+  watch(
+    () => route.matched.length,
+    (newLength, oldLength) => {
+      // 当路由从子路由(长度>1)返回到父路由(长度=1)时刷新列表
+      if (oldLength > 1 && newLength === 1) {
+        getList('init');
+      }
+    }
+  )
+
+
   onMounted(() => {
-    getList();
+    getList('init');
     getCategoryListFn();
   })
   const handlePageChange = (page) => {

+ 27 - 3
src/pages/workflowTrade/workflowTradeAdd.vue

@@ -178,7 +178,7 @@ import weixinIcon from '@/assets/imgs/weixin.png'
 import youxiangIcon from '@/assets/imgs/youxiang.png'
 import DGTMessage from '@/utils/message'
 
-import { questAdd } from '@/api/workflowTrade.js'
+import { questAdd, getQuestDetail, questEdit } from '@/api/workflowTrade.js'
 import { getCategoryListTree } from '@/api/category.js'
 import { getAgreementType } from '@/api/common.js'
 
@@ -188,13 +188,14 @@ import { useRouter, useRoute } from 'vue-router'
 const router = useRouter()
 const route = useRoute()
 console.log(router,route)
-import { ref, computed, reactive, onMounted, watchEffect } from 'vue'
+import { ref, computed, reactive, onMounted, watchEffect,nextTick } from 'vue'
 import { useAppStore } from '@/pinia/appStore'
 const appStore = useAppStore()
 // 防止重复提交的加载状态
 const isSubmiting = ref(false)
 //获取参数
 const query = route.query;
+const questId = ref(query.id || '')
 // 分类列表树
 const categoryListTree = ref([]);
 // 选择的分类id列表
@@ -203,6 +204,7 @@ const categoryIdList = ref([])
 // 表单实例
 const ruleFormRef = ref(null)
 const ruleForm = reactive({
+  questId: "",
   title: '',
   categoryId1: '',
   categoryId2: '',
@@ -262,6 +264,10 @@ onMounted(() => {
   getCategoryListTreeFn();
   // 查询发布提示和发布规则
   getAgreementTypeFn();
+  if(questId.value){
+    getDetail();
+  }
+
 })
 
 // 提交表单
@@ -274,10 +280,14 @@ const submitForm = async () => {
       DGTMessage.warning(fields[firstKey][0].message)
       return
     }
+    let req = questAdd;
+    if(questId.value){
+      req = questEdit;
+    }
     // 设置加载状态为true,禁用按钮
     isSubmiting.value = true
     // 新增需求工作流
-    await questAdd(ruleForm).then(res => {
+    await req(ruleForm).then(res => {
       console.log(res)
       if(res.code === 200){
         DGTMessage.success(t('workflowTrade.publishSuccess'))
@@ -301,6 +311,20 @@ const getCategoryListTreeFn = () => {
     categoryListTree.value = res.rows || [];
   })
 };
+const getDetail = () => {
+  getQuestDetail({id:questId.value}).then(res => {
+    const detail = res.data || {};
+    for(let key in ruleForm){
+      ruleForm[key] = detail[key];
+    }
+    nextTick(() => {
+      if(ruleForm.categoryId1){
+        categoryIdList.value = [ruleForm.categoryId1, ruleForm.categoryId2, ruleForm.categoryId3];
+      };
+    });
+    console.log(categoryIdList.value)
+  })
+};
 
 // 发布提示列表
 const release_hint = ref([])