You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
134 lines
4.3 KiB
134 lines
4.3 KiB
<template>
|
|
<view class="w-full">
|
|
<!-- 有子项目 -->
|
|
<view class="flex items-center justify-between p-3">
|
|
<u-icon @click="openMenu(item)" class="mover" name="https://www.tall.wiki/staticrec/drag.svg" size="48"></u-icon>
|
|
|
|
<view @click="openProject(item)" class="flex-1 px-3">
|
|
<view class="flex items-center mb-1">
|
|
<view class="mr-2">{{ item.name }}</view>
|
|
<!-- 状态 TODO:-->
|
|
<view class="px-2 text-xs text-green-400 bg-green-100 rounded-full flex-shrink-0">进行中</view>
|
|
</view>
|
|
|
|
<view class="flex items-center text-xs text-gray-400">
|
|
<view class="pr-2">{{ dayjs(item.startTime).format('MM-DD HH:mm') }}</view>
|
|
至
|
|
<view class="pl-2">{{ dayjs(item.endTime).format('MM-DD HH:mm') }}</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 箭头 -->
|
|
<view v-if="item.sonProjectList && item.sonProjectList.length">
|
|
<u-icon @click="$emit('openSubProject', item.sonProjectList.length, index)" class="text-gray-400" name="arrow-up" size="14px" v-if="item.show"></u-icon>
|
|
<u-icon @click="$emit('openSubProject', item.sonProjectList.length, index)" class="text-gray-400" name="arrow-down" size="14px" v-else></u-icon>
|
|
</view>
|
|
<u-icon @click="openProject(item)" class="text-gray-400" name="arrow-right" size="14px" v-else></u-icon>
|
|
</view>
|
|
|
|
<!-- 有子项目 -->
|
|
<view class="ml-8" v-if="item.show">
|
|
<view :id="'cu-' + index + '-' + subIndex" :key="subIndex" class="cu-item flex-col" v-for="(subItem, subIndex) in item.sonProjectList">
|
|
<!-- <view :key="subItem.id" v-for="subItem in item.sonProjectList"> -->
|
|
<view class="flex items-center justify-between p-3">
|
|
<u-icon @click="openMenu(subItem)" class="mover" name="https://www.tall.wiki/staticrec/drag.svg" size="48"></u-icon>
|
|
|
|
<view @click="openProject(subItem)" class="flex-1 px-3">
|
|
<view class="flex items-center">
|
|
<view class="mr-2">{{ subItem.name }}</view>
|
|
<!-- 状态 -->
|
|
<view
|
|
:class="
|
|
subItem.status === 0
|
|
? 'text-blue-400 bg-blue-100'
|
|
: subItem.status === 1
|
|
? 'text-green-400 bg-green-100'
|
|
: subItem.status === 2
|
|
? 'text-red-400 bg-red-100'
|
|
: 'text-gray-400 bg-gray-100'
|
|
"
|
|
class="px-2 text-xs text-gray-400 bg-gray-100 rounded-full flex-shrink-0"
|
|
>
|
|
{{ subItem.status === 0 ? '未开始' : subItem.status === 1 ? '进行中' : subItem.status === 2 ? '暂停' : '已完成' }}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 箭头 -->
|
|
<u-icon @click="openProject(subItem)" class="text-gray-400" name="arrow-right" size="14px"></u-icon>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref, computed } from 'vue';
|
|
import dayjs from 'dayjs';
|
|
import { useStore } from 'vuex';
|
|
import config from '@/common/js/config.js';
|
|
|
|
defineProps({
|
|
item: {
|
|
type: Object,
|
|
default: () => {},
|
|
},
|
|
index: {
|
|
type: Number,
|
|
default: 0,
|
|
},
|
|
// menuList: {
|
|
// type: Array,
|
|
// default: () => [],
|
|
// },
|
|
});
|
|
const emit = defineEmits(['setData']);
|
|
|
|
const store = useStore();
|
|
const userId = computed(() => store.getters['user/userId']);
|
|
|
|
const data = ref({
|
|
showMenu: false,
|
|
tips: {
|
|
text: '',
|
|
color: '#909399',
|
|
fontSize: 28,
|
|
},
|
|
// show: false,
|
|
// border: 'border border-blue-500 shadow rounded-md',
|
|
// showBorder: false,
|
|
projectId: 0,
|
|
});
|
|
|
|
// 打开项目详情
|
|
function openProject(project) {
|
|
const gateway = config.apiUrl;
|
|
const url = `${gateway}/defaultwbs`;
|
|
const { name, id } = project;
|
|
uni.navigateTo({ url: `/pages/project/project?u=${userId.value}&p=${id}&pname=${name}&url=${encodeURIComponent(url)}` });
|
|
}
|
|
|
|
/**
|
|
* 弹出项目操作面板
|
|
*/
|
|
function openMenu(project) {
|
|
data.showMenu = true;
|
|
data.projectId = project.id;
|
|
data.tips.text = project.name;
|
|
|
|
emit('setData', data.showMenu, data.projectId, data.tips);
|
|
// this.$emit('setData', data.showMenu, data.projectId, data.tips);
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.border-100 {
|
|
height: 4rpx;
|
|
margin: 0 20rpx;
|
|
}
|
|
|
|
.border-80 {
|
|
height: 4rpx;
|
|
margin: 0 20rpx 0 90rpx;
|
|
}
|
|
</style>
|
|
|