Merge pull request 'jie' (#51) from jie into test

Reviewed-on: #51

src/layout/components/Header/RecycleModal.vue

@@ -1,21 +1,17 @@
 <script lang="ts" setup>
-import { computed, onBeforeMount, onMounted, onUpdated, reactive, ref, watch } from 'vue'
 import Masonry from 'masonry-layout'
 import { useDialog, useMessage } from 'naive-ui'
+import { computed, onBeforeMount, onMounted, onUpdated, reactive, ref, unref, watch } from 'vue'
 
+import { dubiousfilelist, removeFiles } from '@/api/task/task'
+import { viewOptions } from '@/config/home'
 import { useInfiniteScroll } from '@vueuse/core'
-import { debounce, throttle } from 'lodash-es'
 import imagesloaded from 'imagesloaded'
-import { randomInt } from '@/utils/index'
-import { viewOptions } from '@/config/home'
-import { dubiousfilelist, removeFiles } from '@/api/task/task'
+import { debounce } from 'lodash-es'
 
+import { audit } from '@/api/task/task'
+import NotPassed from '@/components/Approval/NotPassed.vue'
 import { off, on } from '@/utils/domUtils'
-import img1 from '@/assets/images/1.jpg'
-import img2 from '@/assets/images/2.jpg'
-import img3 from '@/assets/images/3.jpg'
-import img4 from '@/assets/images/4.jpg'
-import img5 from '@/assets/images/5.jpg'
 
 const cardStyle = {
   '--n-padding-bottom': '40px',
@@ -24,7 +20,7 @@ const cardStyle = {
 
 const message = useMessage()
 const timeRange = ref('')
-const check = ref(false)
+const batch = ref(false)
 const timeOptions = [{
   label: '升序',
   value: 'asc',
@@ -60,8 +56,9 @@ const pagination = reactive({
 let loading = false
 let _masonry: null | Masonry = null
 const show = ref(false)
-
-const urls = [img1, img2, img3, img4, img5]
+const selectedApproveItems = ref<any[]>([]); // 审核批量选中
+const dialog = useDialog();
+let processItems: any[] = [];
 
 const layout = debounce(() => {
   if (!show.value)
@@ -101,11 +98,6 @@ useInfiniteScroll(
   { distance: 10, canLoadMore: () => canloadMore },
 )
 
-function randomUrl() {
-  const index = randomInt(0, urls.length)
-  return urls[index]
-}
-
 async function featchList() {
   loading = true
   try {
@@ -257,6 +249,7 @@ async function onChange() {
 }
 
 function closeModal(event: MouseEvent) {
+  selectedApproveItems.value = []
   show.value = false
 }
 
@@ -277,19 +270,18 @@ async function remove() {
   }
 }
 
-function getPercent(pictureid: string, item) {
-  console.log(item)
-  const { ocpictureid, pictureresult } = item
-  const splitId = ocpictureid || ''
-  const index = splitId.split(',').indexOf(String(pictureid))
-  const results = (pictureresult || '').split(',')
-  const percent = results[index] || '0'
-  const val = Number.parseFloat(percent)
-  return `${val}%`
-}
 
-function showCheck() {
-  check.value = true
+function setBatch(value) {
+  if (value && batch.value) {
+    batch.value = !value;
+  } else {
+    batch.value = value;
+  }
+  if (value === false) {
+    // selectIds.value = []
+    selectedApproveItems.value.forEach((item) => (item.checked = false));
+    selectedApproveItems.value.length = 0;
+  }
 }
 
 defineExpose({
@@ -297,9 +289,107 @@ defineExpose({
 })
 
 const checked = ref(false)
-function onCheckChange(val: any, item: any) {
-  checked.value = val
+
+const notPassModalRef = ref(null)
+const showActions = computed(() => {
+  return selectedApproveItems.value.length > 0 && batch;
+});
+
+
+function onCheckChange(checked: any, item: any) {
+  debugger
+  item.checked = checked
+  const index = selectedApproveItems.value.indexOf(item);
+
+  if (index === -1 && checked) selectedApproveItems.value.push(item);
+  else selectedApproveItems.value.splice(index, 1);
+}
+
+function rejectHandler() {
+  const modal = unref(notPassModalRef)! as any
+  modal.showModal(selectedApproveItems.value)
 }
+
+function reset() {
+  batch.value = false;
+  pagination.pageNo = 0;
+  pagination.pageSize = 20;
+  listData.value.length = 0;
+  selectedApproveItems.value.length = 0;
+  loading = false;
+  canloadMore = true;
+}
+function validate(items: any[]) {
+  if (items.length === 0) return "至少选中一个任务";
+  return null;
+}
+function approvalHandler(items?: any) {
+  if (batch.value) {
+    processItems = selectedApproveItems.value
+  }
+  //  任务包图片 => 点击 => 通过/不通过按钮
+  if (items !== undefined && !(items instanceof PointerEvent))
+    processItems = [items]
+
+  const msg = validate(processItems)
+
+  if (msg !== null) {
+    message.error(msg)
+    return
+  }
+
+  const list: any = []
+  processItems.forEach((item) => {
+    list.push({
+      formId: item.id,
+      taskId: item.taskId,
+      taskName: item.fromTaskName,
+    })
+  })
+
+  const param = {
+    result: true,
+    comment: '',
+    disposeType: '',
+    disposeTypeId: '',
+    failCauseId: '',
+    failCauseName: '',
+    flowTaskInfoList: list,
+  }
+
+  dialog.info({
+    title: '确认提示',
+    content: '确认给该任务审批为【通过】吗?',
+    positiveText: '确定',
+    negativeText: '取消',
+    onPositiveClick: () => {
+      doAudit(param)
+    },
+    onNegativeClick: () => { },
+  })
+}
+
+function doAudit(param: any) {
+  audit(param).then((res) => {
+    const { code } = res
+    setBatch(false)
+    if (code === 'OK') {
+      message.info(res.message)
+      // emitter.emit('refresh')
+      refreshHandler()
+
+    }
+    else message.error(res.message)
+  })
+}
+function reloadList() {
+  refreshHandler()
+}
+function refreshHandler(){
+  reset()
+  featchList()
+}
+
 </script>
 
 <template>
@@ -341,10 +431,25 @@ function onCheckChange(val: any, item: any) {
                 <div class="remove" @click="remove">
                   移除可疑文件夹
                 </div>
-                <div class="wrapper-content-form-button" @click="showCheck">
+                <div class="wrapper-content-form-button" @click="setBatch(true)">
                   <SvgIcon style="margin-right: 6px;" size="14" name="tf" />
                   批量审批
                 </div>
+                <div v-show="showActions" class="batch">
+                    <n-button text @click="setBatch(false)">
+                      <template #icon>
+                        <SvgIcon name="revoke" />
+                      </template>
+                      返回
+                    </n-button>
+                    <div style="cursor: pointer; margin-left: 16px" @click.stop="rejectHandler">
+                      <SvgIcon width="64" height="28" name="a1" />
+                    </div>
+                    <SvgIcon size="24" name="vs" />
+                    <div style="cursor: pointer" @click.stop="approvalHandler">
+                      <SvgIcon width="64" height="28" name="a2" />
+                    </div>
+                  </div>
               </div>
             </div>
 
@@ -365,7 +470,7 @@ function onCheckChange(val: any, item: any) {
                     :class="{ 'img-fit': viewMode === 'horizontalVersion', 'img-full': viewMode === '3:4' || viewMode === 'verticalVersion' }"
                   />
                   <n-checkbox
-                    v-if="check"
+                    v-if="batch"
                     v-model:checked="item.checked"
                     style="position:absolute;left:20px;top:20px" @click.prevent
                     @update:checked="onCheckChange($event, item)"
@@ -385,6 +490,8 @@ function onCheckChange(val: any, item: any) {
         </div>
       </n-card>
     </n-modal>
+    <NotPassed ref="notPassModalRef" @success="reloadList" />
+
   </div>
 </template>