feat: 调整代码

components.d.ts

+/* eslint-disable */
+/* prettier-ignore */
+// @ts-nocheck
+// Generated by unplugin-vue-components
+// Read more: https://github.com/vuejs/core/pull/3399
+export {}
+
+declare module 'vue' {
+    export interface GlobalComponents {
+        GlobalButton: typeof import('./src/components/global-button/global-button.vue')['default']
+        GlobalEmpty: typeof import('./src/components/global-empty/global-empty.vue')['default']
+        GlobalIcon: typeof import('./src/components/global-icon/global-icon.vue')['default']
+        GlobalNavbar: typeof import('./src/components/global-navbar/global-navbar.vue')['default']
+        GlobalPage: typeof import('./src/components/global-page/global-page.vue')['default']
+        GlobalPageSwiper: typeof import('./src/components/global-page-swiper/global-page-swiper.vue')['default']
+        GlobalPageSwiperItem: typeof import('./src/components/global-page-swiper-item/global-page-swiper-item.vue')['default']
+        GlobalPicker: typeof import('./src/components/global-picker/global-picker.vue')['default']
+        GlobalScore: typeof import('./src/components/global-score/global-score.vue')['default']
+        GlobalUpload: typeof import('./src/components/global-upload/global-upload.vue')['default']
+    }
+}

src/components/global-button/global-button.vue

 <template>
+    <!-- 全局button -->
     <button :class="getClass" :style="style" :loading="loading" :disabled="disabled">
         <slot></slot>
     </button>

src/components/global-empty/global-empty.vue

 <template>
+    <!-- 全局empty -->
     <view class="global-empty" :class="class">
         <image :src="getImageSrc" :style="getImageStyle" />
         <text :style="getTextStyle">

src/components/global-icon/global-icon.vue

 <template>
-    <!-- iconfont -->
+    <!-- 全局iconfont图标 -->
     <text class="iconfont" :class="`icon-${icon}`" :style="getIconStyle"></text>
 </template>
 <script setup>

src/components/global-navbar/global-navbar.vue

 <template>
+    <!-- 全局自定义navbar -->
     <uni-nav-bar
         :title="title"
         :border="false"

src/components/global-page-swiper-item/global-page-swiper-item.vue

 <template>
+    <!-- 配合global-page-swiper实现左右滑动 -->
     <view class="content">
         <z-paging
             :auto="auto"
@@ -25,7 +26,7 @@
 <script setup>
 import { ref, watch } from 'vue'
 
-const paging = ref(null)
+const paging = ref()
 const dataList = ref([])
 // 当前组件是否已经加载过了
 const firstLoaded = ref(false)
@@ -128,6 +129,11 @@ const queryList = (pageIndex, pageSize) => {
         paging.value?.complete(false)
     }
 }
+defineExpose({
+    reload: () => {
+        paging.value?.reload()
+    }
+})
 </script>
 
 <style>

src/components/global-page-swiper/global-page-swiper.vue

 <template>
+    <!-- 全局page 带tab切换和左右滑动加载-->
     <z-paging-swiper>
         <!-- 头部 -->
         <template #top>
@@ -17,6 +18,7 @@
         <swiper class="swiper" :current="current" @transition="swiperTransition" @animationfinish="swiperAnimationfinish">
             <swiper-item v-for="(_, index) in tabList" :key="index">
                 <global-page-swiper-item
+                    :ref="(vc) => (pagingArr[index] = vc)"
                     :auto="auto"
                     :tabValue="tabList[current][valueKey]"
                     :tabIndex="index"
@@ -138,6 +140,13 @@ const swiperAnimationfinish = (e) => {
     current.value = e.detail.current
     tabs.value.unlockDx()
 }
+//获取列表刷新对象
+const pagingArr = ref([])
+defineExpose({
+    reload: () => {
+        pagingArr.value[current.value]?.reload()
+    }
+})
 </script>
 
 <style>

src/components/global-page/global-page.vue

 <template>
+    <!-- 全局page 不带tab切换-->
     <z-paging
         ref="paging"
         v-model="dataList"

src/components/global-picker/global-picker.vue

 <template>
+    <!-- 全局下拉框 -->
     <picker
         :mode="mode"
         :range="getRange"
@@ -80,22 +81,6 @@ const getStyle = computed(() => {
         justifyContent: pickAlign
     }
 })
-const selectedValue = ref('')
-watch(
-    () => ps.modelValue,
-    (value) => {
-        if (ps.mode == 'selector') {
-            const option = getOptions.value.find((option) => String(option[ps.valueField]) === String(ps.modelValue))
-            if (option) {
-                selectedValue.value = option[ps.labelField]
-            } else {
-                selectedValue.value = ''
-            }
-        } else {
-            selectedValue.value = value
-        }
-    }
-)
 //获取options
 const getOptions = computed(() => {
     if (ps.dictkey) {
@@ -113,6 +98,24 @@ const getOptions = computed(() => {
         }
     }
 })
+const selectedValue = ref('') //显示的内容
+watch(
+    [() => ps.modelValue, () => ps.options],
+    (value) => {
+        if (ps.mode == 'selector') {
+            const option = getOptions.value.find((option) => String(option[ps.valueField]) === String(ps.modelValue))
+            if (option) {
+                selectedValue.value = option[ps.labelField]
+            } else {
+                selectedValue.value = ''
+            }
+        } else {
+            selectedValue.value = value
+        }
+    },
+    { immediate: true }
+)
+
 const getRange = computed(() => {
     return getOptions.value.map((option) => option[ps.labelField])
 })
@@ -140,6 +143,7 @@ const getPickerValue = computed(() => {
     const index = getOptions.value.findIndex((option) => String(option[ps.valueField]) === String(ps.modelValue))
     return index > 0 ? index : 0
 })
+
 //清空值
 const clear = () => {
     selectedValue.value = ''

src/components/global-upload/global-upload.vue

 <template>
+    <!-- 全局图片下载 -->
     <up-upload
         :width="width + 'rpx'"
         :height="height + 'rpx'"
@@ -11,14 +12,13 @@
     >
         <slot>
             <view class="upload-button" :style="getUploadButtonSize">
-                <uni-icons type="plusempty" :size="24" color="rgba(0, 0, 0, 0.4)"></uni-icons>
+                <uni-icons :type="uploadIcon" :size="24" color="rgba(0, 0, 0, 0.4)"></uni-icons>
             </view>
         </slot>
     </up-upload>
 </template>
 
 <script setup>
-import { func } from 'uview-plus/libs/function/test'
 import { computed, ref, watch } from 'vue'
 
 const es = defineEmits(['handleUpload'])
@@ -38,6 +38,10 @@ const ps = defineProps({
     url: {
         type: String,
         default: ''
+    },
+    uploadIcon: {
+        type: String,
+        default: 'plusempty'
     }
 })
 const getUploadButtonSize = computed(() => {
@@ -47,13 +51,7 @@ const getUploadButtonSize = computed(() => {
     }
 })
 
-const fileList = ref([])
-watch(
-    () => ps.fileList,
-    (value) => {
-        fileList.value = value
-    }
-)
+const fileList = ref(ps.fileList)
 const getFileList = computed(() => {
     return fileList.value.map((item) => {
         return { ...item, url: item.fileUrl }
@@ -104,9 +102,13 @@ function arrayBufferToBinary(buffer) {
     // 使用二进制编码器将字节序列转换为字符串
     return encoder.encode(new Uint8Array(buffer)).toString()
 }
-watch(fileList, (value) => {
-    es('handleUpload', value)
-})
+watch(
+    fileList,
+    (value) => {
+        es('handleUpload', value)
+    },
+    { deep: true }
+)
 const uploadFilePromise = (url, binary) => {
     return new Promise((resolve, reject) => {
         uni.uploadFile({

src/pages/panel/appraisal-record/add.vue

@@ -29,7 +29,9 @@ import { saveRqmOpinionApi } from '@/api/appraisal-record'
 import { getAdminListApi } from '@/api/base'
 import { onLoad } from '@dcloudio/uni-app'
 import { reactive, ref } from 'vue'
+import useAppraisalRecordStore from '@/store/appraisal-record'
 
+const appraisalRecordStore = useAppraisalRecordStore()
 //表单数据
 const formData = reactive({
     id: '',
@@ -53,7 +55,7 @@ const getAdminList = async (realName) => {
         pageSize: 100,
         realName
     }
-    const res = await getAdminListApi(params)
+    const res = await getAdminListApi(params, { loading: true })
     if (res.code == 200) {
         selectList.value = res.data.list.map((item) => {
             return {
@@ -69,9 +71,19 @@ const handleCancel = () => {
     uni.navigateBack()
 }
 const handleSave = async () => {
-    const res = await saveRqmOpinionApi(formData, { loading: true })
+    const params = {
+        ...formData
+    }
+    if (!params.mid) {
+        params.mid = -1
+    }
+    if (!params.opinionType) {
+        params.opinionType = -1
+    }
+    const res = await saveRqmOpinionApi(params, { loading: true })
     if (res.code == 200) {
         uni.navigateBack()
+        appraisalRecordStore.getRqmDetails()
         uni.$message.showToast(res.message)
     } else {
         uni.$message.showToast(res.message)

src/pages/panel/appraisal-record/components/card-details-item.vue

 <template>
     <view class="card-details-item">
         <view class="label">{{ label }}</view>
-        <text>
-            <slot>-</slot>
-        </text>
+        <text>{{ value }}</text>
     </view>
 </template>
 
@@ -12,6 +10,10 @@ const ps = defineProps({
     label: {
         type: String,
         default: ''
+    },
+    value: {
+        type: String,
+        default: ''
     }
 })
 </script>
@@ -19,7 +21,13 @@ const ps = defineProps({
 .card-details-item {
     display: flex;
     justify-content: space-between;
-    align-items: center;
     margin-bottom: 16rpx;
+    .label {
+        min-width: 50%;
+    }
+    text {
+        text-align: right;
+        word-break: break-all;
+    }
 }
 </style>

src/pages/panel/appraisal-record/details.vue

@@ -15,11 +15,11 @@
                 <view class="details-header">
                     <view class="details-header-top">
                         <view class="txt">{{ details.status == 1 ? 'OPEN' : 'ClOSE' }}</view>
-                        <score-details
+                        <global-score
                             v-if="details.score != -1"
                             :type="details.eventType == 1 ? 'success' : 'warning'"
                             :count="details.score"
-                        ></score-details>
+                        ></global-score>
                     </view>
                     <view class="details-header-bottom">
                         <view class="left">
@@ -63,23 +63,25 @@
                 </view>
             </view>
             <card-details type="company" title="公司值班信息" showfooter :idcard="details.dmName" :calendar="details.optionSaveTime">
-                <card-details-item label="公司值班经理">{{ showData(details.dmName, '-') }}</card-details-item>
-                <card-details-item label="公司值班经理意见">
-                    {{ showData(details.opinionType) ? useGetDictByValue('opinionType', details.opinionType) : '-' }}
-                </card-details-item>
-                <card-details-item label="公司值班经理意见描述">{{ showData(details.dmMsg, '-') }}</card-details-item>
+                <card-details-item label="公司值班经理" :value="showData(details.dmName, '-')"></card-details-item>
+                <card-details-item
+                    label="公司值班经理意见"
+                    :value="details.opinionType != -1 ? useGetDictByValue('opinionType', details.opinionType) : '-'"
+                ></card-details-item>
+                <card-details-item label="公司值班经理意见描述" :value="showData(details.dmMsg, '-')"></card-details-item>
             </card-details>
             <card-details type="quality" title="品质中心信息" showfooter :idcard="details.qmName" :calendar="details.qualitySaveTime">
-                <card-details-item label="品质中心经理">{{ showData(details.qmName, '-') }}</card-details-item>
-                <card-details-item label="品质中心经理意见">
-                    {{ showData(details.qualityOpinionType) ? useGetDictByValue('opinionType', details.qualityOpinionType) : '-' }}
-                </card-details-item>
-                <card-details-item label="品质中心经理意见描述">{{ showData(details.qmMsg, '-') }}</card-details-item>
+                <card-details-item label="品质中心经理" :value="showData(details.qmName, '-')"></card-details-item>
+                <card-details-item
+                    label="品质中心经理意见"
+                    :value="details.qualityOpinionType != -1 ? useGetDictByValue('opinionType', details.qualityOpinionType) : '-'"
+                ></card-details-item>
+                <card-details-item label="品质中心经理意见描述" :value="showData(details.qmMsg, '-')"></card-details-item>
             </card-details>
             <card-details type="appeal" title="申诉状态" titleIcon="email">
                 <template v-if="showData(details.appealInfo)">
                     <view class="appeal-status">{{ useGetDictByValue('appealInfo', details.appealInfo) }}</view>
-                    <image :src="item.fileUrl" v-for="item in file" :key="item.id" />
+                    <image :src="item.fileUrl" v-for="(item, index) in getFileList" :key="item.id" @tap="previewImage(index)" />
                 </template>
                 <global-empty v-else></global-empty>
             </card-details>
@@ -88,42 +90,39 @@
 </template>
 
 <script setup>
-import { onShow } from '@dcloudio/uni-app'
 import CardDetails from './components/card-details.vue'
 import CardDetailsItem from './components/card-details-item.vue'
-import { ref } from 'vue'
 import { showData, timeStampFormat } from '@/utils/tool'
 import { useGetDictByValue } from '@/components/global-picker/useDict'
-import { getRqmDetailsApi } from '@/api/appraisal-record'
+import useAppraisalRecordStore from '@/store/appraisal-record'
+import { storeToRefs } from 'pinia'
+import { onLoad } from '@dcloudio/uni-app'
 
-const details = ref()
-const file = ref([])
-//获取详情
-const getRqmDetails = async (id) => {
-    const res = await getRqmDetailsApi({ id }, { loading: true })
-    if (res.code == 200) {
-        details.value = res.data
-        file.value = JSON.parse(res.data.file)
-    } else {
-        uni.$message.showToast(res.message)
-    }
-}
 const query = defineProps(['id'])
-onShow(() => {
-    getRqmDetails(query.id)
+const appraisalRecordStore = useAppraisalRecordStore()
+const { details, getFileList } = storeToRefs(appraisalRecordStore)
+onLoad(() => {
+    appraisalRecordStore.setState('id', query.id)
+    appraisalRecordStore.getRqmDetails()
 })
+
 //跳转
 const goTo = () => {
     uni.navigateTo({
-        url: 'edit',
-        success: () => {
-            uni.$emit('appraisalRecordEdit', details.value)
-        }
+        url: 'edit'
     })
 }
 //返回
 const goBack = () => {
     uni.navigateBack()
+    uni.$emit('appraisalRecordReload')
+}
+//图片预览
+const previewImage = (index) => {
+    uni.previewImage({
+        current: index,
+        urls: getFileList.value.map((item) => item.fileUrl)
+    })
 }
 </script>
 <style lang="scss" scoped>

src/pages/panel/appraisal-record/edit.vue

@@ -62,31 +62,35 @@
                 type="company"
                 title="公司值班信息"
                 showfooter
-                :idcard="formData.dmName"
-                :calendar="formData.optionSaveTime"
+                :idcard="details.dmName"
+                :calendar="details.optionSaveTime"
                 edit
                 @handleAdd="handleAdd(0)"
+                v-if="details"
             >
-                <card-details-item label="公司值班经理">{{ showData(formData.dmName, '-') }}</card-details-item>
-                <card-details-item label="公司值班经理意见">
-                    {{ showData(formData.opinionType) ? useGetDictByValue('opinionType', formData.opinionType) : '-' }}
-                </card-details-item>
-                <card-details-item label="公司值班经理意见描述">{{ showData(formData.dmMsg, '-') }}</card-details-item>
+                <card-details-item label="公司值班经理" :value="showData(details.dmName, '-')"></card-details-item>
+                <card-details-item
+                    label="公司值班经理意见"
+                    :value="details.opinionType != -1 ? useGetDictByValue('opinionType', details.opinionType) : '-'"
+                ></card-details-item>
+                <card-details-item label="公司值班经理意见描述" :value="showData(details.dmMsg, '-')"></card-details-item>
             </card-details>
             <card-details
                 type="quality"
                 title="品质中心信息"
                 showfooter
-                :idcard="formData.qmName"
-                :calendar="formData.qualitySaveTime"
+                :idcard="details.qmName"
+                :calendar="details.qualitySaveTime"
                 edit
                 @handleAdd="handleAdd(1)"
+                v-if="details"
             >
-                <card-details-item label="品质中心经理">{{ showData(formData.qmName, '-') }}</card-details-item>
-                <card-details-item label="品质中心经理意见">
-                    {{ showData(formData.qualityOpinionType) ? useGetDictByValue('opinionType', formData.qualityOpinionType) : '-' }}
-                </card-details-item>
-                <card-details-item label="品质中心经理意见描述">{{ showData(formData.qmMsg, '-') }}</card-details-item>
+                <card-details-item label="品质中心经理" :value="showData(details.qmName, '-')"></card-details-item>
+                <card-details-item
+                    label="品质中心经理意见"
+                    :value="details.qualityOpinionType != -1 ? useGetDictByValue('opinionType', details.qualityOpinionType) : '-'"
+                ></card-details-item>
+                <card-details-item label="品质中心经理意见描述" :value="showData(details.qmMsg, '-')"></card-details-item>
             </card-details>
             <view class="appeal">
                 <view class="appeal-title">
@@ -94,7 +98,7 @@
                     <global-picker pickAlign="right" dictkey="appealInfo" v-model="formData.appealInfo" clearable></global-picker>
                 </view>
                 <view class="appeal-content">
-                    <global-upload :fileList="formData.file" url="/resource/uploadFile" @handleUpload="handleUpload"></global-upload>
+                    <global-upload :fileList="getFileList" url="/resource/uploadFile" @handleUpload="handleUpload"></global-upload>
                 </view>
             </view>
         </view>
@@ -110,14 +114,17 @@
 import { reactive, ref } from 'vue'
 import CardDetails from './components/card-details.vue'
 import CardDetailsItem from './components/card-details-item.vue'
-import { onLoad } from '@dcloudio/uni-app'
+import { onShow } from '@dcloudio/uni-app'
 import { showData } from '@/utils/tool'
 import useBaseStore from '@/store/base'
 import { useGetDictByValue } from '@/components/global-picker/useDict'
 import useAppraisalRecordStore from '@/store/appraisal-record'
 import { updateRqmDataApi } from '@/api/appraisal-record'
 import { getAcReduceListApi } from '@/api/base'
+import { storeToRefs } from 'pinia'
 
+const appraisalRecordStore = useAppraisalRecordStore()
+const { details, getFileList } = storeToRefs(appraisalRecordStore)
 // 校验规则
 const rules = reactive({
     eventTime: [
@@ -159,17 +166,45 @@ const formData = reactive({
     qualityOpinionMsg: '',
     qualityOpinionType: -1,
     status: '',
-    file: [],
     emailSendTime: -1
 })
+const fileList = ref([])
+onShow(() => {
+    formData.id = details.value.id
+    formData.ac = details.value.ac
+    formData.acOwn = details.value.acOwn
+    formData.acType = details.value.acType
+    formData.appealInfo = details.value.appealInfo
+    formData.appraisee = details.value.appraisee
+    formData.department = details.value.department
+    formData.dmUid = details.value.dmUid
+    formData.eventMsg = details.value.eventMsg
+    formData.eventSource = details.value.eventSource
+    formData.eventTime = details.value.eventTime
+    formData.eventType = details.value.eventType
+    formData.examineBasis = details.value.examineBasis
+    formData.examineType = details.value.examineType
+    formData.onDutyUser = details.value.onDutyUser
+    formData.opinionMsg = details.value.opinionMsg
+    formData.opinionType = details.value.opinionType
+    formData.score = details.value.score
+    formData.qmUid = details.value.qmUid
+    formData.qualityOpinionMsg = details.value.qualityOpinionMsg
+    formData.qualityOpinionType = details.value.qualityOpinionType
+    formData.status = details.value.status
+    formData.emailSendTime = details.value.emailSendTime
+    //初始化文件列表
+    fileList.value = getFileList.value
+})
 //提交表单
 const formRef = ref()
 const handleSubmit = async () => {
     await formRef.value?.validate()
-    const params = { ...formData, file: JSON.stringify(file.value) }
+    const params = { ...formData, file: JSON.stringify(fileList.value) }
     const res = await updateRqmDataApi(params, { loading: true })
     if (res.code == 200) {
         uni.navigateBack()
+        appraisalRecordStore.getRqmDetails()
         uni.$message.showToast(res.message)
     } else {
         uni.$message.showToast(res.message)
@@ -193,21 +228,9 @@ const handleAdd = (isDuty) => {
         }
     })
 }
-//获取页面内容
-const file = ref([])
-const details = ref()
-onLoad(() => {
-    uni.$once('appraisalRecordEdit', (data) => {
-        details.value = data
-        Object.assign(formData, data)
-        formData.file = JSON.parse(data.file)
-        file.value = JSON.parse(data.file)
-        formData.eventTime = String(data.eventTime)
-    })
-})
 //获取文件内容
-const handleUpload = (fileList) => {
-    file.value = fileList
+const handleUpload = (data) => {
+    fileList.value = data
 }
 //切换机号
 const changeAc = async () => {

src/pages/panel/appraisal-record/list.vue

 <template>
-    <global-page-swiper title="考核记录" refresherEnabled loadingMoreEnabled :tabList="tabList" :api="getRqmListApi">
+    <global-page-swiper title="考核记录" refresherEnabled loadingMoreEnabled :tabList="tabList" :api="getRqmListApi" ref="paging">
         <template #="{ dataList }">
             <view class="list">
                 <view class="item" v-for="item in dataList" :key="item.id" @tap="goDetails(item)">
@@ -9,11 +9,7 @@
                             <view class="txt">{{ showData(item.appraisee) }}</view>
                             <view class="place">{{ showData(item.department) }}</view>
                         </view>
-                        <score-details
-                            v-if="item.score != -1"
-                            :type="item.eventType == 1 ? 'success' : 'warning'"
-                            :count="item.score"
-                        ></score-details>
+                        <global-score v-if="item.score != -1" :type="item.eventType == 1 ? 'success' : 'warning'" :count="item.score"></global-score>
                     </view>
                     <view class="item-content">
                         {{ item.eventMsg || '暂无内容~' }}
@@ -47,6 +43,11 @@ const appraisalRecordStore = useAppraisalRecordStore()
 onLoad(() => {
     appraisalRecordStore.getRqmOptions()
 })
+//刷新
+const paging = ref()
+uni.$on('appraisalRecordReload', () => {
+    paging.value?.reload()
+})
 </script>
 <style lang="scss" scoped>
 @import './constants/list.scss';

src/store/appraisal-record.js

-import { getRqmOptionsApi } from '@/api/appraisal-record'
+import { getRqmDetailsApi, getRqmOptionsApi } from '@/api/appraisal-record'
 import { defineStore } from 'pinia'
 
 const useAppraisalRecordStore = defineStore('appraisalRecord', {
@@ -8,10 +8,16 @@ const useAppraisalRecordStore = defineStore('appraisalRecord', {
                 appraisee: [],
                 department: [],
                 examineType: []
-            }
+            },
+            id: '',
+            details: undefined
+        }
+    },
+    getters: {
+        getFileList(state) {
+            return state.details?.file || []
         }
     },
-    getters: {},
     actions: {
         async getRqmOptions() {
             const res = await getRqmOptionsApi({})
@@ -20,6 +26,19 @@ const useAppraisalRecordStore = defineStore('appraisalRecord', {
                 this.selectList.department = res.data.department || []
                 this.selectList.examineType = res.data.examineType || []
             }
+        },
+        async getRqmDetails() {
+            const res = await getRqmDetailsApi({ id: this.id }, { loading: true })
+            if (res.code == 200) {
+                this.details = res.data
+                this.details.file = JSON.parse(res.data.file)
+                this.details.eventTime = String(res.data.eventTime)
+            } else {
+                uni.$message.showToast(res.message)
+            }
+        },
+        setState(...args) {
+            this.$patch({ [args[0]]: args[1] })
         }
     },
     // 配置持久化

src/utils/http.js

@@ -117,6 +117,7 @@ export const http = (options) => {
             ...options,
             // 响应成功
             success(res) {
+                console.log('接口响应结果:', res)
                 serviceLoading.close()
                 // 状态码 2xx， axios 就是这样设计的
                 const statusCode = parseInt(res.statusCode)