项目文件管理完成

src/api/approve.js

@@ -0,0 +1,9 @@
+import service from '@/utils/request'
+// 查询需要审批的列表
+export const getExamineList = (data) => {
+    return service({
+        url: '/projectProcess/queryProjectProcessList',
+        method: 'POST',
+        data
+    })
+}

src/pinia/modules/user.js

@@ -3,7 +3,7 @@ import { defineStore } from 'pinia'
 export const useUserStore = defineStore('user',() => {
     const token = ref('')
     const userInfo = reactive({
-        userId: 0,
+        userId: 1,
         userName: '',
         roleId: 0,
         roleName: ''

src/view/approve/components/approveList.vue

@@ -1,11 +1,52 @@
 <template>
-  审批管理
+  <van-cell-group>
+    <van-cell
+        v-for="item in inspectList"
+        :title="item.projectProcessName"
+        :label="processType(item.projectType)"
+        :value="applyPeople(item.user.nickName)"
+        :key="item.ID">
+    </van-cell>
+  </van-cell-group>
 </template>
 
 <script setup>
+import { getExamineList } from "@/api/approve";
+import { useUserStore } from "@/pinia/modules/user"
 defineOptions({
   name: 'approveList',
 })
+const useUser = useUserStore()
+onMounted(() => {
+  console.log(useUser.userInfo.userId)
+  queryExamineList()
+})
+const condition = reactive({
+  pageInfo: {
+    page: 1,
+    pageSize: 10,
+  },
+  userId: useUser.userInfo.userId
+})
+
+const inspectList = reactive([])
+const queryExamineList = () => {
+  getExamineList(condition).then(res => {
+    if (res.code === 0) {
+      console.log(res.data.list)
+      const list = res.data.list
+      inspectList.push(...list)
+    }
+  })
+}
+
+//计算属性
+const applyPeople = computed(() => {
+  return (name) => "申请人：" + name
+})
+const processType = computed(() => {
+  return (type) => "类型：" + type
+})
 </script>
 
 <style scoped lang="less">

src/view/approve/components/flowList.vue

@@ -1,5 +1,33 @@
 <template>
-  <van-collapse v-model="activeNames">
+  <van-row class="nodeBox">
+    <van-col
+        :span="22"
+        :offset="1"
+        style="display: flex; justify-content: space-between;"
+    >
+      <van-button
+          type="primary"
+          icon="plus"
+          size="small"
+          plain
+          style="border: 0;font-size: 0.4rem;padding: 0"
+          @click="plusFlowShow = true"
+      >
+        新增流程
+      </van-button>
+      <van-button
+          type="primary"
+          icon="edit"
+          size="small"
+          plain
+          style="border: 0;font-size: 0.4rem;padding: 0"
+          @click="processTypeShow = true"
+      >
+        节点编辑
+      </van-button>
+    </van-col>
+  </van-row>
+  <van-collapse v-model="activeNames" class="collapseBox">
     <van-collapse-item v-for="item in processList" :key="item.ID">
       <template #title>
         <van-text-ellipsis :content="item.processName" style="font-size: 0.45rem"/>
@@ -24,7 +52,7 @@
         <van-col :span="24">
           <van-button
               type="primary"
-              size="large"
+              style="width: 100%"
               round
               @click="openStepsPopup(item.nodes)">
             效果图
@@ -41,6 +69,69 @@
       </van-step>
     </van-steps>
   </van-popup>
+  <van-popup
+      v-model:show="plusFlowShow"
+      position="bottom"
+      closeable
+      close-icon-position="top-right"
+      style="height: 100%;background-color: #f7f8fa;">
+    <van-row style="margin-top: 1.5rem">
+      <van-col :offset="1" :span="22">
+          <van-cell-group>
+            <van-field placeholder="请输入流程名称" label="流程名称"/>
+          </van-cell-group>
+          <van-cell-group style="margin-top: 0.5rem">
+            <van-field placeholder="请输入流程内容" label="流程内容"/>
+          </van-cell-group>
+          <van-cell-group style="margin-top: 0.5rem">
+            <van-field
+                placeholder="请选择流程类型"
+                is-link
+                readonly
+                label="流程类型"
+                v-model="plusFlowDemand.process.processType"
+                @click="processTypeShow = true"
+            />
+        </van-cell-group>
+      </van-col>
+    </van-row>
+    <van-row style="margin-top: 0.6rem">
+      <van-col
+          style="display: flex;justify-content: space-between"
+          :span="22"
+          :offset="1">
+        <van-button icon="photo-o" size="small">效果图</van-button>
+        <van-button icon="plus" size="small">添加节点</van-button>
+        <van-button icon="delete-o" size="small">删除节点</van-button>
+      </van-col>
+    </van-row>
+    <van-row style="margin: 0.6rem 0 0.6rem 0">
+      <van-col :span="22" :offset="1">
+        <van-cell-group>
+          <van-cell
+              v-for="item in flowNodeList"
+              :key="item.id"
+              :title="item.title"
+              :value="item.value"
+              :label="item.label"
+          >
+          </van-cell>
+        </van-cell-group>
+      </van-col>
+    </van-row>
+  </van-popup>
+  <van-popup
+      v-model:show="processTypeShow"
+      round
+      class="processTypeBox"
+      position="bottom">
+    <van-picker
+        :columns="processTypeList"
+        :columns-field-names="customFieldName"
+        @cancel="processTypeShow = false"
+        @confirm="changeProcessType"
+    />
+  </van-popup>
 </template>
 
 <script setup>
@@ -79,6 +170,42 @@ const openStepsPopup = (item) => {
   nodeList.push(...item)
   stepsActive.value = item.length - 1
 }
+
+// 新增流程
+const plusFlowShow = ref(false)
+const plusFlowDemand = reactive({
+  process: {
+    processName: '',
+    processContent: '',
+    processType: ''
+  },
+  processNodes: []
+})
+// 流程类型
+const processTypeShow = ref(false)
+const processTypeList = [
+    { id: 1, value: '立项' }, { id: 2, value: '费用' }
+]
+const changeProcessType = (val) => {
+  plusFlowDemand.process.processType = val.selectedOptions[0].value
+  processTypeShow.value = false
+}
+// picker规则
+const customFieldName = {
+  text: 'value',
+  value: 'id',
+};
+
+// 流程节点
+const flowNodeList = reactive([
+  {id: 0, title: '标题', value:'内容', label:'描述信息'},
+  {id: 1, title: '标题', value:'内容', label:'描述信息'},
+  {id: 2, title: '标题', value:'内容', label:'描述信息'},
+  {id: 3, title: '标题', value:'内容', label:'描述信息'},
+  {id: 4, title: '标题', value:'内容', label:'描述信息'},
+  {id: 5, title: '标题', value:'内容', label:'描述信息'},
+])
+
 // 计算属性
 const flowType = computed(() => {
   return (type) =>  "流程类型：" + type
@@ -89,7 +216,20 @@ const nodeNumber = computed(() => {
 </script>
 
 <style scoped lang="less">
+.box{
+  width: 100vw;
+  margin-top: 20px;
+}
 .stepsPopup{
   width: 500px;
 }
+.nodeBox{
+  .box
+}
+.collapseBox{
+  .box
+}
+.processTypeBox{
+  height: 400px;
+}
 </style>