Merge branch 'fanpeng' into 'develop'

feat: 添加审核结果页UI

See merge request StarlockTeam/starwork-uniapp!15

src/pages.json

@@ -67,6 +67,14 @@
         "disableScroll": true
       }
     },
+    {
+      "path": "pages/approval/approval-result",
+      "type": "page",
+      "style": {
+        "navigationStyle": "custom",
+        "disableScroll": true
+      }
+    },
     {
       "path": "pages/approval/approval",
       "type": "page",

src/pages/approval/approval-detail.vue

@@ -17,8 +17,12 @@
     </scroll-view>
     <view class="pb-safe border-#eef0f5 border-t-solid">
       <view class="flex flex-items-center flex-justify-around py-3">
-        <view class="py-2 px-13 bg-#ef2e2f color-white rounded-2">拒绝</view>
+        <view class="py-2 px-13 bg-#ef2e2f color-white rounded-2" @click="toResult('reject')">
-        <view class="py-2 px-13 custom-bg-blue color-white rounded-2">同意</view>
+          拒绝
+        </view>
+        <view class="py-2 px-13 custom-bg-blue color-white rounded-2" @click="toResult('agree')">
+          同意
+        </view>
         <view class="custom-color-blue text-4" @click="showActions">更多</view>
       </view>
     </view>
@@ -33,19 +37,18 @@
 </template>
 
 <script setup lang="ts">
-  import { useToast } from 'wot-design-uni'
   import ApprovalContent from '@/pages/approval/components/ApprovalContent.vue'
   import ApprovalProcess from '@/pages/approval/components/ApprovalProcess.vue'
 
-  const toast = useToast()
-
   const show = ref<boolean>(false)
   const actions = ref([
     {
-      name: '专审'
+      name: '转审',
+      type: 'transfer'
     },
     {
-      name: '退回'
+      name: '退回',
+      type: 'return'
     },
     {
       name: '取消'
@@ -60,7 +63,13 @@
     show.value = false
   }
 
-  const select = ({ item, index }) => {
+  const select = ({ item }) => {
-    toast.show(`当前选中项: ${item.title}, 下标: ${index}`)
+    toResult(item.type)
+  }
+
+  const toResult = type => {
+    uni.navigateTo({
+      url: `/pages/approval/approval-result?type=${type}`
+    })
   }
 </script>

src/pages/approval/approval-result.vue

@@ -0,0 +1,95 @@
+<route lang="json5">
+{
+  style: {
+    navigationStyle: 'custom',
+    disableScroll: true
+  }
+}
+</route>
+<template>
+  <view>
+    <TopNavigation :title="textMap[type].title"></TopNavigation>
+    <view v-if="type === 'transfer'" class="bg-white mx-4 px-4 py-2 rounded-2 shadow-sm text-3.5">
+      <view class="flex flex-items-center pos-relative">
+        <view class="color-#ee322a mt-1.5 pos-absolute left--2">*</view>
+        <view>转审人</view>
+      </view>
+      <view class="mb-2 w-fit mr-2 mt-4">
+        <view
+          class="h-10 w-10 rounded-2 border-#255cf7 border-1 border-solid flex flex-items-center flex-justify-center box-border"
+        >
+          <wd-icon name="add" size="22px" color="#255cf7"></wd-icon>
+        </view>
+      </view>
+    </view>
+    <view v-if="type === 'return'" class="bg-white mx-4 px-4 py-2 rounded-2 shadow-sm text-3.5">
+      <view class="flex flex-items-center pos-relative">
+        <view class="color-#ee322a mt-1.5 pos-absolute left--2">*</view>
+        <view>退回至</view>
+      </view>
+      <view class="color-#838589 text-3 mt-2">选择退回节点，对方处理后，将按原有流程重新审批</view>
+      <view class="flex flex-items-center mt-2">
+        <view class="custom-bg-blue w-5 h-5 rounded-50% flex flex-items-center flex-justify-center">
+          <view class="w-2.5 h-2.5 bg-white rounded-50%"></view>
+        </view>
+        <view class="ml-2">发起人</view>
+      </view>
+      <view class="ml-7 mt-2 mb-2 py-1 flex flex-items-center w-fit rounded-4 bg-#f3f5fa">
+        <image
+          src="https://file.hikmall.com/prod/image/4921b7596d2344088f8611f503b011dc.png"
+          class="h-6 w-6 rounded-50%"
+          mode="aspectFill"
+        ></image>
+        <view class="mx-2">xxx</view>
+      </view>
+    </view>
+    <view class="bg-white mx-4 p-2 rounded-2 shadow-sm mt-2">
+      <Textarea
+        :id="0"
+        :title="textMap[type].placeholder"
+        :required="false"
+        placeholder="请输入（选填）"
+        @change="textareaChange"
+      ></Textarea>
+    </view>
+  </view>
+</template>
+
+<script setup lang="ts">
+  // agree reject return transfer
+  import Textarea from '@/pages/approval/components/Textarea.vue'
+
+  const type = ref<string>('agree')
+  const approvalType = ref<string>('请假')
+
+  const textMap = {
+    agree: {
+      title: '审批意见',
+      placeholder: `确认同意${approvalType.value}申请`
+    },
+    reject: {
+      title: '审批意见',
+      placeholder: `确认拒绝${approvalType.value}申请`
+    },
+    return: {
+      title: '退回',
+      placeholder: `退回原因`
+    },
+    transfer: {
+      title: '转审',
+      placeholder: `转审原因`
+    }
+  }
+
+  onLoad(options => {
+    if (options.type) {
+      type.value = options.type
+    }
+  })
+
+  const textareaChange = e => {
+    console.log('textareaChange', e)
+  }
+</script>
+
+<style scoped lang="scss"></style>

src/pages/approval/components/ApprovalCreate.vue

@@ -148,4 +148,8 @@
   :deep(.wd-step__line) {
     background: #255cf7;
   }
+
+  :deep(.wd-step.is-vertical .wd-step__content) {
+    padding-bottom: 0;
+  }
 </style>

src/pages/approval/components/DatetimePicker.vue

@@ -17,7 +17,7 @@
         <view v-if="required" class="color-#f62933 pos-absolute left--2 mt-1">*</view>
         <view>{{ title }}</view>
       </view>
-      <view class="py-2" @click="openDialog">
+      <view class="pt-2" @click="openDialog">
         <view class="flex flex-items-center flex-justify-between">
           <view :class="[text ? 'custom-color-black' : 'color-#bfbfbf']">
             {{ text || placeholder }}

src/pages/approval/components/Description.vue

@@ -1,5 +1,5 @@
 <template>
-  <view class="px-2 text-3.5 pb-2">
+  <view class="px-2 text-3 pb-2">
     <view class="break-all">{{ title }}</view>
   </view>
 </template>

src/pages/approval/components/Form.vue

@@ -1,7 +1,7 @@
 <template>
   <view class="pb-3 mb-2">
     <Visitor></Visitor>
-    <view class="bg-white mx-4 p-2 rounded-2 shadow-sm">
+    <view class="bg-white mx-4 px-2 pt-3 pb-4 rounded-2 shadow-sm">
       <Input
         :id="0"
         value="单行"

src/pages/approval/components/Images.vue

@@ -58,4 +58,8 @@
   :deep(.wd-upload__picture) {
     border-radius: 12rpx;
   }
+
+  :deep(.wd-upload__evoke) {
+    margin-bottom: 0;
+  }
 </style>

src/pages/approval/components/Input.vue

@@ -104,6 +104,7 @@
   }
 
   :deep(.wd-input__inner) {
+    height: var(--wot-input-inner-height, 24px);
     font-size: 0.875rem;
   }
 </style>

src/pages/approval/components/NavigatorSelector.vue

@@ -15,7 +15,7 @@
         <view v-if="required" class="color-#f62933 pos-absolute left--2 mt-1">*</view>
         <view>{{ title }}</view>
       </view>
-      <view class="py-2" @click="toSelect">
+      <view class="pt-2" @click="toSelect">
         <view class="flex flex-items-center flex-justify-between">
           <view :class="[text ? 'custom-color-black' : 'color-#bfbfbf']">
             {{ text || placeholder }}

src/pages/approval/components/SelectPicker.vue

@@ -92,7 +92,7 @@
 
 <style scoped lang="scss">
   :deep(.wd-select-picker__cell) {
-    padding: var(--wot-cell-wrapper-padding, 10px) 0;
+    padding: 0;
     background-color: transparent;
   }
 

src/pages/approval/components/VisitDuration.vue

@@ -1,7 +1,7 @@
 <template>
   <view class="px-2 text-3.5">
     <view v-if="inline">
-      <view class="flex flex-items-center pos-relative pb-1.5" @click="toSelect">
+      <view class="flex flex-items-center pos-relative" @click="toSelect">
         <view v-if="required" class="color-#f62933 pos-absolute left--2 mt-1">*</view>
         <view>{{ title }}</view>
         <view class="ml-a mr-2" :class="[text ? 'custom-color-black' : 'color-#bfbfbf']">

src/pages/approval/components/Visitor.vue

@@ -1,5 +1,5 @@
 <template>
-  <view class="bg-white mx-4 p-2 rounded-2 mb-2 shadow-sm">
+  <view class="bg-white mx-4 px-2 pb-3 pt-4.5 rounded-2 mb-2 shadow-sm">
     <Input :id="0" title="访客姓名" :required="true" @change="inputChange" inline></Input>
     <wd-divider color="#bcbfbe"></wd-divider>
     <Input
@@ -16,10 +16,10 @@
     <wd-divider color="#bcbfbe"></wd-divider>
     <NavigatorSelector :id="3" title="通行门禁点" type="accessControl" inline></NavigatorSelector>
   </view>
-  <view class="bg-white mx-4 p-2 rounded-2 mb-2 shadow-sm">
+  <view class="bg-white mx-4 px-2 py-3 rounded-2 mb-2 shadow-sm">
     <Keyboard :id="4" title="车牌号码" type="car" :maxlength="8" inline></Keyboard>
   </view>
-  <view class="bg-white mx-4 p-2 rounded-2 mb-2 shadow-sm">
+  <view class="bg-white mx-4 px-2 pt-3 pb-2 rounded-2 mb-2 shadow-sm">
     <DatetimePicker
       :id="5"
       ref="startDatetimePicker"

src/types/uni-pages.d.ts

@@ -6,6 +6,7 @@
 interface NavigateToOptions {
   url: "/pages/home/home" |
        "/pages/approval/approval-detail" |
+       "/pages/approval/approval-result" |
        "/pages/approval/approval" |
        "/pages/approval/create-application" |
        "/pages/attendance/allowed-time" |