client-app/pages/my/project.vue

<template>
    <hc-sys class="hc-my-project-page" navBarUi='my-project-nav-bar'>
        <template #navBar>
            <hc-nav-back-bar title="项目管理">
                <text @click="setDataClick">设置</text>
            </hc-nav-back-bar>
        </template>
        <view class="hc-parting-line"/>
        <uni-collapse class="hc-my-project-collapse" v-model="projectId" accordion>
            <template v-for="item in dataLists">
                <uni-collapse-item :name="item.id">
                    <template v-slot:title>
                        <view class="my-project-bar">
                            <view class="icon">
                                <text class="i-ri-folder-2-line"/>
                            </view>
                            <view class="name">{{item.projectName}}</view>
                        </view>
                    </template>
                    <view class="my-contract-bar">
                        <template v-for="items in item.contractInfoList">
                            <view class="item-bar"
                                  :class="items.id === contractId ? 'is-select':''"
                                  @click="contractClick(item, items)"
                            >
                                <view class="icon">
                                    <text class="i-ri-star-fill" v-if="items.id === contractId"/>
                                </view>
                                <view class="name">{{items.contractName}}</view>
                            </view>
                        </template>
                    </view>
                </uni-collapse-item>
            </template>
        </uni-collapse>
        <!-- 普通弹窗 -->
        <uni-popup ref="popupRef" class="hc-popup" type="bottom">
            <view class="hc-popup-content">
                <view class="title">确认该合同段为登录进入系统的默认项目？</view>
                <view class="popup-btn-bar">
                    <button type="primary" class="popup-btn c1" @click="setProjectClick">设置为默认项目</button>
                </view>
                <view class="popup-btn-bar">
                    <button type="primary" class="popup-btn c2" @click="onlyEffectivelick">仅本次生效</button>
                </view>
                <view class="popup-btn-bar">
                    <button type="primary" class="popup-btn c3" @click="cancelPopup">关闭</button>
                </view>
            </view>
        </uni-popup>
    </hc-sys>
</template>

<script setup>
import {ref, nextTick} from "vue";
import {onLoad} from '@dcloudio/uni-app'
import {useAppStore} from "@/store";
import mainApi from "~api/user/project";
import {errorToast, successToast} from "@/utils/tools";
import {deepClone, getArrValue} from "js-fast-way";

//初始变量
const store = useAppStore()
const userInfo = ref(store.userInfo);
const projectInfo = ref({pid: '', cid: ''});
const projectId = ref('');
const contractId = ref('');
const app = getApp()

//渲染完成
onLoad(() => {
    projectInfo.value = deepClone({
        pid: store.projectId,
        cid: store.contractId
    })
    getProjectAndContract()
})

//获取项目以及合同段数据
const dataLists = ref([])
const getProjectAndContract = async () => {
    const {pid, cid } = projectInfo.value
    uni.showLoading({title: '获取数据中...', mask: true});
    const { data } = await mainApi.getProjectAndContract()
    dataLists.value = getArrValue(data)
    uni.hideLoading();
    await nextTick(() => {
        projectId.value = pid
        contractId.value = cid
    })
}

//合同段点击
const projectData = ref({})
const contractData = ref({})
const contractClick = (project, contract) => {
    //设置数据
    projectData.value = project
    contractData.value = contract
    //设置ID
    projectId.value = project.id
    contractId.value = contract.id
}

//设置项目
const popupRef = ref(null)
const setDataClick = () => {
    popupRef.value?.open()
}

//设置默认项目
const setProjectClick = async () => {
    const pid = projectId.value, cid = contractId.value
    if (!pid || !cid) {
        cancelPopup()
        errorToast('请先选择项目和合同段')
        return
    }
    uni.showLoading({title: '设置中...', mask: true});
    cancelPopup()
    const { error, code, msg } = await mainApi.setDefaultProject({
        projectId: projectId.value,
        contractId: contractId.value,
    })
    if (!error && code === 200) {
        await setProjectContractData()
        uni.hideLoading();
        successToast('设置成功')
        setTimeout(() => {
            uni.navigateBack()
        }, 2000)
    } else {
        uni.hideLoading();
        errorToast('设置失败:' + msg)
    }
}

//仅本次生效
const onlyEffectivelick = async () => {
    const pid = projectId.value, cid = contractId.value
    if (!pid || !cid) {
        cancelPopup()
        errorToast('请先选择项目和合同段')
        return
    }
    uni.showLoading({title: '设置中...', mask: true});
    await setProjectContractData()
    uni.hideLoading();
    successToast('设置成功')
    setTimeout(() => {
        uni.navigateBack()
    }, 1200)
}

//设置项目合同信息
const setProjectContractData = async () => {
    const pid = store.projectId, cid = store.contractId
    const pids = projectId.value, cids = contractId.value
    if (pid !== pids || cid !== cids) {
        store.setProjectId(pids)
        store.setContractId(cids)
        store.setProjectInfo(projectData.value)
        store.setContractInfo(contractData.value)
        app.socketSendMsg(`${pids},${cids}`)
    }
    return true
}

//取消并关闭
const cancelPopup = () => {
    popupRef.value?.close()
}
</script>

<style lang="scss" scoped>
page {
    background: #EFEFF4;
}
</style>

<style lang="scss">
@import "@/style/my/project.scss";
</style>