feat: 交付物历史记录、审核记录

src/App.vue

@@ -132,10 +132,6 @@ body,
   color: #cccccc !important;
 }
 
-.border-radius-10 {
-  border-radius: 10px;
-}
-
 .ant-form label {
   display: block;
   margin-bottom: 5px;
@@ -177,6 +173,10 @@ body,
   border-width: 1px;
 }
 
+.border-radius-10 {
+  border-radius: 10px;
+}
+
 .flex-1 {
   flex: 1 1 0%;
 }
@@ -201,6 +201,11 @@ body,
   background-color: rgba(59, 130, 246, var(--tw-bg-opacity));
 }
 
+.bg-red-500 {
+  --tw-bg-opacity: 1;
+  background-color: rgba(239, 68, 68, var(--tw-bg-opacity));
+}
+
 .text-white {
   --tw-text-opacity: 1;
   color: rgba(255, 255, 255, var(--tw-text-opacity));

src/apis/index.js

@@ -81,6 +81,12 @@ export const getDeliverByTaskId = (params, url) => http.post(`${url}/deliver/get
 // 检查交付物
 export const checkDeliver = (params, url) => http.post(`${url}/deliver/checkDeliver`, params);
 
+// 交付物历史记录
+export const getDeliverHistory = (params, url) => http.post(`${url}/deliver/queryRecord`, params);
+
+// 查看检查记录
+export const queryCheckLog = (params, url) => http.post(`${url}/deliver/queryCheckLog`, params);
+
 // 流水账
 
 // 获取基本信息 （成员列表、项目列表）

src/components/tall/center/Roles.vue

@@ -92,7 +92,6 @@ function changeRole(item) {
   store.commit('task/setDownNextPage', 1);
   // 清除详情页
   store.commit('task/setTaskDetailUrl', '');
-  sessionStorage.setItem('targetUrl', '');
   store.commit('task/setTaskDetailShow', '');
 }
 </script>

src/components/tall/left/Projects.vue

@@ -129,9 +129,7 @@ function toDetail(item) {
   clearTasksData();
   store.commit('projects/setProject', item);
   store.commit('task/setTaskDetailUrl', '');
-  sessionStorage.setItem('targetUrl', '');
   store.commit('task/setTaskDetailShow', '');
-  sessionStorage.setItem('taskDetailShow', '');
   router.push({ path: '/tall/pc/home/test' });
   // store.commit('task/setTaskDetail', null);
 }

src/components/tall/plugin/Plugin.vue

@@ -25,7 +25,7 @@
   <!-- <p-task-to-detail :task="task" v-else-if="pluginId === '24'" class="p-2"></p-task-to-detail> -->
 
   <!-- 流水账插件 -->
-  <p-daily-account v-else-if="pluginId === '16'"></p-daily-account>
+  <p-daily-account v-else-if="pluginId === '26'"></p-daily-account>
 
   <Render
     v-else

src/plugins/p-daily-account/p-daily-account-detail.vue

@@ -4,14 +4,12 @@
     <div class="mb-8 flex justify-between items-center">
       <div class="text-2xl font-semibold">流水账</div>
       <div class="flex items-center">
-        <a-button type="primary" v-if="!morning" @click="punch(0)"> 早打卡 </a-button>
+        <a-button type="primary" v-if="!morning || morning == 0" @click="punch(0)"> 早打卡 </a-button>
         <a-button type="primary" v-else>
           {{ dayjs(+morning).format('HH:mm') }}
         </a-button>
-        <a-button class="mx-5" type="primary" v-if="!night" @click="punch(1)"> 晚打卡 </a-button>
+        <a-button class="mx-5" type="primary" v-if="!night || night == 0" @click="punch(1)"> 晚打卡 </a-button>
-        <a-button class="mx-5" type="primary" v-else>
+        <a-button class="mx-5" type="primary" v-else> {{ dayjs(+night).format('HH:mm') }} </a-button>
-          {{ dayjs(+night).format('HH:mm') }}
-        </a-button>
         <FullscreenExitOutlined v-if="isFullScreen" class="text-lg" style="color: #777" @click="changeIsFullScreen(false)" />
         <FullscreenOutlined v-else class="text-lg" style="color: #777" @click="changeIsFullScreen(true)" />
       </div>
@@ -51,7 +49,7 @@
     </a-form>
 
     <!-- 表格 -->
-    <a-table class="mt-6" :columns="columns" :data-source="columnDatas" bordered :pagination="false" :scroll="{ x: 1400 }">
+    <a-table sticky class="mt-6" :columns="columns" :data-source="columnDatas" bordered :pagination="false" :scroll="{ x: 1400 }">
       <template #bodyCell="{ column, text, record }">
         <div
           style="height: 100px"
@@ -620,7 +618,7 @@ async function getClockQuery() {
 }
 
 async function punch(clockType) {
-  if ((clockType === 0 && morning.value) || (clockType === 1 && night.value)) return;
+  if ((clockType === 0 && morning.value > 0) || (clockType === 1 && night.value > 0)) return;
 
   const dateTime = dayjs(+new Date().getTime()).valueOf(); // 打卡时间
 

src/plugins/p-daily-account/p-daily-account.vue

@@ -11,8 +11,6 @@ const store = useStore();
 
 function openDailyAccount() {
   store.commit('task/setTaskDetailUrl', '');
-  sessionStorage.setItem('targetUrl', '');
   store.commit('task/setTaskDetailShow', 'dailyAccount');
-  sessionStorage.setItem('taskDetailShow', 'dailyAccount');
 }
 </script>

src/plugins/p-deliver/p-audit-records.vue

@@ -0,0 +1,72 @@
+<template>
+  <div class="h-full">
+    <div class="text-base text-center font-semibold" style="height: 44px; line-height: 44px; background: rgb(248, 248, 248)">审核记录</div>
+
+    <div class="p-3">
+      <div class="bg-white p-3 text-gray-400 rounded-md" v-if="checkerList && checkerList.length">
+        <div v-for="(item, index) in checkerList" :key="index" class="flex justify-between">
+          <div>
+            <div class="mb-1 text-gray-800">
+              {{ item.checkerName }}
+            </div>
+            <div class="mb-1 text-xs">
+              {{ item.remark }}
+            </div>
+            <div class="text-xs" v-if="+item.checkTime > 0">
+              {{ dayjs(+item.checkTime).format('MM-DD HH:mm') }}
+            </div>
+          </div>
+
+          <div class="flex flex-col justify-center">
+            <div class="mb-1 text-green-600" v-if="item.status === 1">已通过</div>
+            <div class="mb-1 text-red-600" v-if="item.status === 2">已驳回</div>
+            <div v-if="+item.score > 0">
+              <a-progress v-if="item.score" type="circle" :percent="item.score" strokeColor="#FA8C16" :width="40" :strokeWidth="10">
+                <template #format="percent">
+                  <span
+                    class="inline-block text-center text-white text-sm rounded-full"
+                    style="background: #fa8c16; width: 24px; height: 24px; line-height: 24px"
+                  >
+                    {{ percent }}
+                  </span>
+                </template>
+              </a-progress>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { useStore } from 'vuex';
+import { ref, onMounted, computed, watch } from 'vue';
+import dayjs from 'dayjs';
+import { message } from 'ant-design-vue';
+import { queryCheckLog } from 'apis';
+
+const store = useStore();
+const checkerList = ref([]);
+const deliverRecordId = computed(() => store.state.task.deliverRecordId);
+const sessionDeliverRecordId = sessionStorage.getItem('deliverRecordId');
+
+onMounted(() => {
+  getQueryCheckLog();
+});
+
+watch(deliverRecordId, () => {
+  getQueryCheckLog();
+});
+
+async function getQueryCheckLog() {
+  try {
+    const { url } = store.state.projects.project;
+    const param = { param: { deliverRecordId: deliverRecordId.value || sessionDeliverRecordId } };
+    const data = await queryCheckLog(param, url);
+    checkerList.value = data;
+  } catch (error) {
+    message.info('获取检查交付物历史失败');
+  }
+}
+</script>

src/plugins/p-deliver/p-deliver-check.vue

@@ -66,7 +66,7 @@
               <template #format="percent">
                 <span
                   class="inline-block text-center text-white text-sm rounded-full"
-                  style="background: #fa8c16; width: 22px; height: 22px; line-height: 22px"
+                  style="background: #fa8c16; width: 24px; height: 24px; line-height: 24px"
                 >
                   {{ percent }}
                 </span>
@@ -93,15 +93,9 @@ const deliverData = inject('deliver');
 const collapsed = ref(false); // 展开/关闭
 defineEmits(['check-success']);
 
-// 历史交付物
-function openDeliverHistory() {}
-
 // 交付物链接
 function openLink() {
-  store.commit('task/setTaskDetailUrl', deliverData.details[0]);
+  window.open(deliverData.details[0], '_blank');
-  sessionStorage.setItem('targetUrl', deliverData.details[0]);
-  store.commit('task/setTaskDetailShow', '');
-  sessionStorage.setItem('taskDetailShow', '');
 }
 
 const checkModal = reactive({
@@ -109,8 +103,21 @@ const checkModal = reactive({
   deliverRecordId: () => (deliverData.value ? deliverData.value.deliverRecordId : ''), // 交付物记录id
 });
 
+// 历史交付物
+function openDeliverHistory() {
+  const { deliverId } = deliverData.value;
+  store.commit('task/setDeliverId', deliverId); // 设置交付物id
+  store.commit('task/setTaskDetailUrl', ''); // 设置详情页链接
+  store.commit('task/setTaskDetailShow', 'deliverHistory'); // 设置内置组件关键字（根据关键字判断显示的详情页）
+}
+
 // 审核记录
-function openMoreRecords() {}
+function openMoreRecords() {
+  const { deliverRecordId } = deliverData.value;
+  store.commit('task/setDeliverRecordId', deliverRecordId); // 设置交付物记录id
+  store.commit('task/setTaskDetailUrl', ''); // 设置详情页链接
+  store.commit('task/setTaskDetailShow', 'auditRecords'); // 设置内置组件关键字（根据关键字判断显示的详情页）
+}
 </script>
 
 <style scoped>

src/plugins/p-deliver/p-deliver-history.vue

@@ -0,0 +1,106 @@
+<template>
+  <div>
+    <div class="text-base text-center font-semibold" style="height: 44px; line-height: 44px; background: rgb(248, 248, 248)">
+      交付物上传记录
+    </div>
+
+    <!-- 历史记录 -->
+    <div class="px-3 pt-1" v-if="listRef && listRef.length">
+      <div class="bg-white my-2 rounded-md p-3 text-gray-400" v-for="(item, index) in listRef" :key="index">
+        <!-- 插件名称和提交时间显示 -->
+        <div class="flex justify-between mb-2">
+          <div class="text-gray-800">{{ deliverName }}</div>
+          <div class="text-xs">{{ dayjs(+item.submitTime).format('MM-DD HH:mm') }}</div>
+        </div>
+
+        <!-- 提交的链接 -->
+        <div @click="openLink(item)" class="my-1 break-all text-blue-400 text-xs cursor-pointer" v-if="item.details[0]">
+          {{ item.details[0] }}
+        </div>
+
+        <!-- 该插件物的审核人 -->
+        <div class="mb-1 mt-3">审核人</div>
+
+        <div class="flex justify-between mb-2" v-for="(checkItem, checkIndex) in item.checkerList" :key="checkIndex">
+          <div>
+            <div class="mb-1 text-gray-800 font-semibold">
+              {{ checkItem.checkerName }}
+            </div>
+            <div class="mb-1 text-xs">
+              {{ checkItem.remark }}
+            </div>
+            <div class="mb-1 text-xs" v-if="+checkItem.checkTime > 0">
+              {{ dayjs(+checkItem.checkTime).format('MM-DD HH:mm') }}
+            </div>
+          </div>
+
+          <div class="text-center text-xs">
+            <div v-if="checkItem.status == null" class="text-gray-400">待审核</div>
+            <div v-else-if="checkItem.status === 1">
+              <div class="text-green-600 mb-1">已通过</div>
+
+              <a-progress
+                v-if="checkItem.score"
+                type="circle"
+                :percent="checkItem.score"
+                strokeColor="#FA8C16"
+                :width="40"
+                :strokeWidth="10"
+              >
+                <template #format="percent">
+                  <span
+                    class="inline-block text-center text-white text-sm rounded-full"
+                    style="background: #fa8c16; width: 24px; height: 24px; line-height: 24px"
+                  >
+                    {{ percent }}
+                  </span>
+                </template>
+              </a-progress>
+            </div>
+            <div class="text-red-600" v-else>已驳回</div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { useStore } from 'vuex';
+import { ref, onMounted, computed, watch } from 'vue';
+import dayjs from 'dayjs';
+import { message } from 'ant-design-vue';
+import { getDeliverHistory } from 'apis';
+
+const store = useStore();
+const listRef = ref([]);
+const deliverName = ref('');
+const deliverId = computed(() => store.state.task.deliverId);
+const sessionDeliverId = sessionStorage.getItem('deliverId');
+
+onMounted(() => {
+  getHistory();
+});
+
+watch(deliverId, () => {
+  getHistory();
+});
+
+async function getHistory() {
+  try {
+    const { url } = store.state.projects.project;
+    const param = { param: { deliverId: deliverId.value || sessionDeliverId } };
+    const data = await getDeliverHistory(param, url);
+    deliverName.value = data.deliverName;
+    listRef.value = data.deliverRecordList;
+  } catch (error) {
+    message.info('获取交付物历史失败');
+  }
+}
+
+// 交付物链接
+function openLink(item) {
+  console.log(item.details[0]);
+  window.open(item.details[0], '_blank');
+}
+</script>

src/store/tall/task/index.js

@@ -36,6 +36,9 @@ export default {
     downNextPage: 1, // 向下下一页的值
     taskDetailUrl: '', // iframe详情页链接
     taskDetailShow: '', // 内置组件详情页显示
+
+    deliverId: '', // 当前交付物id
+    deliverRecordId: '', // 当前交付物记录id
   },
 
   getters: {
@@ -402,6 +405,7 @@ export default {
      */
     setTaskDetailUrl(state, data) {
       state.taskDetailUrl = data;
+      sessionStorage.setItem('targetUrl', data);
     },
 
     /**
@@ -411,6 +415,27 @@ export default {
      */
     setTaskDetailShow(state, data) {
       state.taskDetailShow = data;
+      sessionStorage.setItem('taskDetailShow', data);
+    },
+
+    /**
+     * 设置当前交付物id
+     * @param {Object} state
+     * @param {Object} data
+     */
+    setDeliverId(state, data) {
+      state.deliverId = data;
+      sessionStorage.setItem('deliverId', data);
+    },
+
+    /**
+     * 设置交付物记录id
+     * @param {Object} state
+     * @param {Object} data
+     */
+    setDeliverRecordId(state, data) {
+      state.deliverRecordId = data;
+      sessionStorage.setItem('deliverRecordId', data);
     },
   },
 

src/views/detail/Test.vue

@@ -2,7 +2,14 @@
   <div class="task-detail">
     <DetailWebview v-if="taskDetailUrl"></DetailWebview>
 
+    <!-- 流水账详情页 -->
     <p-daily-account-detail v-if="taskDetailShow === 'dailyAccount'"></p-daily-account-detail>
+
+    <!-- 交付物历史记录 -->
+    <p-deliver-history v-if="taskDetailShow === 'deliverHistory'"></p-deliver-history>
+
+    <!-- 审核记录 -->
+    <p-audit-records v-if="taskDetailShow === 'auditRecords'"></p-audit-records>
   </div>
 </template>
 
@@ -11,6 +18,8 @@ import { computed } from 'vue';
 import { useStore } from 'vuex';
 import DetailWebview from '@/components/tall/Right/DetailWebview.vue';
 import pDailyAccountDetail from '@/plugins/p-daily-account/p-daily-account-detail.vue';
+import pDeliverHistory from '@/plugins/p-deliver/p-deliver-history.vue';
+import pAuditRecords from '@/plugins/p-deliver/p-audit-records.vue';
 
 const store = useStore();