|
@@ -1,19 +1,27 @@
|
|
|
-<!-- 实习报告 -->
|
|
|
<template>
|
|
|
- <v-card class="px-3">
|
|
|
- <!-- 筛选条件 -->
|
|
|
- <div class="d-flex justify-space-between mt-8 mb-10">
|
|
|
- <div class="d-flex align-center">
|
|
|
- <!-- <span class="mx-3 color-666 font-size-14">院系</span> -->
|
|
|
- <Autocomplete class="mr-3" v-model="query.collegeId" :item="yuanXi"></Autocomplete>
|
|
|
- <v-btn color="primary" class="half-button ml-3" @click="handleSearch()">查 询</v-btn>
|
|
|
- <v-btn class="half-button ml-3" prepend-icon="mdi-refresh" variant="outlined" color="primary" @click="handleSearch(true)">刷 新</v-btn>
|
|
|
- </div>
|
|
|
- <v-btn :loading="exportLoading" prepend-icon="mdi-export-variant" color="primary" variant="tonal" class="ml-3" @click="null">导出</v-btn>
|
|
|
+ <v-card class="card-box d-flex pa-3">
|
|
|
+ <div style="width: 20%; border-right: 1px solid #ccc;">
|
|
|
+ <v-treeview
|
|
|
+ :items="treeData"
|
|
|
+ activatable
|
|
|
+ color="primary"
|
|
|
+ item-value="id"
|
|
|
+ open-all
|
|
|
+ open-strategy="single"
|
|
|
+ density="compact"
|
|
|
+ @update:activated="handleClick"
|
|
|
+ @update:opened="handleClick"
|
|
|
+ >
|
|
|
+ <template v-slot:title="{ item }">
|
|
|
+ <div class="treeTitle font-size-15" v-ellipse-tooltip style="max-width: 100%;">{{ formatName(item.title) }}</div>
|
|
|
+ </template>
|
|
|
+ </v-treeview>
|
|
|
</div>
|
|
|
-
|
|
|
- <!-- 列表 -->
|
|
|
- <div class="mt-5" style="min-height: 500px;">
|
|
|
+ <div style="width: 80%" class="ml-3">
|
|
|
+ <div class="d-flex justify-space-between px-3">
|
|
|
+ <TextInput v-model="query.name" :item="textItem" @change="getUserList"></TextInput>
|
|
|
+ <v-btn class="mr-3" width="100" color="primary" prepend-icon="mdi-refresh" variant="outlined" @click="getTreeData">刷 新</v-btn>
|
|
|
+ </div>
|
|
|
<CtTable
|
|
|
:items="tableData"
|
|
|
:headers="headers"
|
|
@@ -28,88 +36,201 @@
|
|
|
>
|
|
|
<template #studentName="{ item }">
|
|
|
<div class="d-flex align-center">
|
|
|
- <v-avatar size="40" :image="getUserAvatar(item?.person?.avatar, item?.person?.sex)"></v-avatar>
|
|
|
- <span class="ml-3">{{ item?.person?.name }}</span>
|
|
|
+ <v-avatar size="40" :image="getUserAvatar(item.headImg, item.teacherSex)"></v-avatar>
|
|
|
+ <span class="ml-3">{{ item?.studentName }}</span>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template #actions="{ item }">
|
|
|
- <v-btn v-if="!item?.recommendationLetter" color="primary" variant="text" @click="handleUploadLetter(item.id)">上传推荐信</v-btn>
|
|
|
- <v-btn v-if="!item?.evaluate" color="#00897B" variant="text" @click="handleIssueCertificate(item.id)">颁发实习证书</v-btn>
|
|
|
+ <v-btn color="primary" variant="text" @click="handleReport(item)">实习报告</v-btn>
|
|
|
</template>
|
|
|
</CtTable>
|
|
|
- <!-- <Loading :visible="loading"></Loading> -->
|
|
|
</div>
|
|
|
- </v-card >
|
|
|
+
|
|
|
+ <v-navigation-drawer v-model="showDetail" absolute location="right" rounded temporary width="700" class="pa-5">
|
|
|
+ <p class="text-center color-primary font-weight-bold mb-5 font-size-20">{{ detailTitle }}</p>
|
|
|
+ <div v-if="reportList && reportList.length > 0">
|
|
|
+ <div v-for="item in reportList" :key="item.date" class="mb-3">
|
|
|
+ <div class="title-date">{{ item.date }}</div>
|
|
|
+ <div class="d-flex flex-wrap">
|
|
|
+ <img
|
|
|
+ v-for="(src, index) in item.arr"
|
|
|
+ :key="index"
|
|
|
+ :src="src"
|
|
|
+ @click="handlePreview(item.arr, index)"
|
|
|
+ class="cursor-pointer"
|
|
|
+ style="width: 200px; height: 250px;"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <Empty v-else :elevation="false" />
|
|
|
+ </v-navigation-drawer>
|
|
|
+ </v-card>
|
|
|
+
|
|
|
+ <PreviewImage v-if="showPreview" :initialIndex="initialIndex" :urlList="urlsList" @close="handleClosePreview" />
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
-defineOptions({name: 'internship-report'})
|
|
|
+defineOptions({ name: 'group-account'})
|
|
|
import { ref } from 'vue'
|
|
|
-import Snackbar from '@/plugins/snackbar'
|
|
|
-import { formatName } from '@/utils/getText'
|
|
|
+import { useI18n } from '@/hooks/web/useI18n'
|
|
|
+import { getEnterpriseTree } from '@/api/recruit/enterprise/system/group'
|
|
|
import { getUserAvatar } from '@/utils/avatar'
|
|
|
+import { formatName } from '@/utils/getText';
|
|
|
|
|
|
+const { t } = useI18n()
|
|
|
+const total = ref(0)
|
|
|
const loading = ref(false)
|
|
|
const query = ref({
|
|
|
- pageSize: 20,
|
|
|
+ pageSize: 10,
|
|
|
pageNo: 1,
|
|
|
- collegeId: null,
|
|
|
+ enterpriseId: '',
|
|
|
+ name: null
|
|
|
})
|
|
|
|
|
|
+// 企业基本信息
|
|
|
+const schoolInfo = ref(localStorage.getItem('schoolInfo') ? JSON.parse(localStorage.getItem('schoolInfo')) : {})
|
|
|
+
|
|
|
+const tableData = ref([
|
|
|
+ {
|
|
|
+ "id": "1899374563922436098",
|
|
|
+ "userId": "1899373349776244738",
|
|
|
+ "personId": "1899374563842744322",
|
|
|
+ "graduationStatus": null,
|
|
|
+ "status": null,
|
|
|
+ "enterpriseId": null,
|
|
|
+ "studentNo": "200004512",
|
|
|
+ "idCardName": null,
|
|
|
+ studentName: '张三',
|
|
|
+ "idCardNo": "440104199908129861",
|
|
|
+ "idCardImg1": null,
|
|
|
+ "idCardImg2": null,
|
|
|
+ "authStatus": "0",
|
|
|
+ "schoolId": "1899055558628085760",
|
|
|
+ "schoolName": "辞图科技",
|
|
|
+ "schoolClassId": null,
|
|
|
+ "schoolDepartmentName": "外语系",
|
|
|
+ "schoolClassName": "德语一班",
|
|
|
+ "majorId": null,
|
|
|
+ "majorName": "德语",
|
|
|
+ "majorCode": null,
|
|
|
+ teacherSex: '1',
|
|
|
+ headImg: '',
|
|
|
+ enterpriseName: '企业1',
|
|
|
+ "emergencyContactName": "吴轩",
|
|
|
+ "emergencyContactPhone": "13229740017",
|
|
|
+ "createTime": 1741681159370
|
|
|
+}
|
|
|
+])
|
|
|
+const treeData = ref([
|
|
|
+ {
|
|
|
+ title: '农学',
|
|
|
+ children: [{ title: '农学1' }, { title: '农学2' }]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '文学',
|
|
|
+ children: [{ title: '文学1' }, { title: '文学2' }]
|
|
|
+ }
|
|
|
+])
|
|
|
const headers = [
|
|
|
{ title: '学生姓名', key: 'studentName', sortable: false },
|
|
|
- { title: '学生学号', key: 'studentName', sortable: false },
|
|
|
- { title: '所属专业', key: 'studentName', sortable: false },
|
|
|
- { title: '录用企业', key: 'studentName', sortable: false, value: item => formatName(item.studentName) },
|
|
|
- { title: '录用部门', key: 'studentName', sortable: false, value: item => formatName(item.studentName) },
|
|
|
- { title: '录用岗位', key: 'studentName', sortable: false, value: item => formatName(item.studentName) },
|
|
|
- { title: '操作', key: 'actions', sortable: false }
|
|
|
+ { title: '实习企业', key: 'enterpriseName', sortable: false },
|
|
|
+ { title: '所属院系', key: 'schoolDepartmentName', sortable: false },
|
|
|
+ { title: '所属专业', key: 'majorName', sortable: false },
|
|
|
+ { title: '所在班级', key: 'schoolClassName', sortable: false },
|
|
|
+ { title: '学号', key: 'studentNo', sortable: false },
|
|
|
+ { title: t('common.actions'), key: 'actions', sortable: false }
|
|
|
]
|
|
|
+const textItem = ref({
|
|
|
+ type: 'text',
|
|
|
+ value: null,
|
|
|
+ width: 250,
|
|
|
+ clearable: true,
|
|
|
+ label: '请输入学生名称搜索'
|
|
|
+})
|
|
|
|
|
|
-const tableData = ref([{ studentName: '123'}])
|
|
|
-const total = ref(0)
|
|
|
-// 列表
|
|
|
-const getData = async (isRefresh = false) => {
|
|
|
- // const { list, total: number } = await getInterviewInvitePage(query.value)
|
|
|
- // tableData.value = list
|
|
|
- // total.value = number
|
|
|
- if (isRefresh) Snackbar.success('刷新成功')
|
|
|
+
|
|
|
+// 获取用户列表
|
|
|
+const getUserList = async () => {
|
|
|
+ // loading.value = true
|
|
|
+ // try {
|
|
|
+ // const { list, total: number } = await getEnterpriseUserList(query.value)
|
|
|
+ // tableData.value = list
|
|
|
+ // total.value = number
|
|
|
+ // } finally {
|
|
|
+ // loading.value = false
|
|
|
+ // }
|
|
|
+}
|
|
|
+
|
|
|
+// 获取树形列表
|
|
|
+const getTreeData = async () => {
|
|
|
+ treeData.value = []
|
|
|
+ try {
|
|
|
+ const data = await getEnterpriseTree()
|
|
|
+ if (!data) return
|
|
|
+ treeData.value[0] = data
|
|
|
+ query.value.enterpriseId = data.id
|
|
|
+ // 获取用户列表
|
|
|
+ getUserList()
|
|
|
+ } catch {}
|
|
|
}
|
|
|
+// getTreeData()
|
|
|
|
|
|
-const handleChangePage = (val) => {
|
|
|
- query.value.pageNo = val
|
|
|
- getData()
|
|
|
+// 分页
|
|
|
+const handleChangePage = (e) => {
|
|
|
+ query.value.pageNo = e
|
|
|
+ getUserList()
|
|
|
}
|
|
|
|
|
|
-const handleSearch = (refresh = false) => {
|
|
|
- query.value.pageNo = 1
|
|
|
- getData(refresh)
|
|
|
+// 树形click
|
|
|
+const handleClick = (e) => {
|
|
|
+ if (!e.length) return
|
|
|
+ query.value.enterpriseId = e[0]
|
|
|
+ getUserList()
|
|
|
}
|
|
|
|
|
|
-const yuanXi = ref({ width: 300, items: [], clearable: false, hideDetails: true, label: '请选择院系' })
|
|
|
-// 列表
|
|
|
-const getYuanXiItem = async () => {
|
|
|
- // const { list } = await getInterviewInvitePage(query.value)
|
|
|
- yuanXi.value.items = [
|
|
|
- { label: '中文系', value: '中文系' },
|
|
|
- { label: '人文学院', value: '人文学院' },
|
|
|
- ]
|
|
|
- if (yuanXi.value.items?.length) {
|
|
|
- query.value.collegeId = yuanXi.value.items[0].value
|
|
|
- getData()
|
|
|
+// 查看实习报告
|
|
|
+const reportList = ref([
|
|
|
+ {
|
|
|
+ date: '2023-01-01',
|
|
|
+ arr: ['https://menduner.citupro.com:3443/dev/person/1899373349776244738/img/c1e6d4d93ef29bf62e07eec698b8a44a1cf690aa1f5c0d36065f0f2fb1144956.png']
|
|
|
}
|
|
|
+])
|
|
|
+const detailTitle = ref('实习报告')
|
|
|
+const showDetail = ref(false)
|
|
|
+const handleReport = (item) => {
|
|
|
+ detailTitle.value = item.studentName + ' - 实习报告'
|
|
|
+ showDetail.value = true
|
|
|
+}
|
|
|
+
|
|
|
+// 图片预览
|
|
|
+const showPreview = ref(false)
|
|
|
+const initialIndex = ref(0)
|
|
|
+const urlsList = ref([])
|
|
|
+const handlePreview = (arr, index) => {
|
|
|
+ urlsList.value = arr
|
|
|
+ initialIndex.value = index
|
|
|
+ showPreview.value = true
|
|
|
}
|
|
|
-getYuanXiItem()
|
|
|
|
|
|
-const exportLoading = ref(false)
|
|
|
+const handleClosePreview = () => {
|
|
|
+ showPreview.value = false
|
|
|
+ initialIndex.value = 0
|
|
|
+ urlsList.value = []
|
|
|
+}
|
|
|
</script>
|
|
|
-<style lang="scss" scoped>
|
|
|
-.title {
|
|
|
- color: var(--color-333);
|
|
|
- font-weight: 600;
|
|
|
- font-size: 16px;
|
|
|
+
|
|
|
+<style scoped lang="scss">
|
|
|
+.title-date {
|
|
|
+ border-left: 5px solid var(--v-primary-base);
|
|
|
+ padding-left: 12px;
|
|
|
+ line-height: 17px;
|
|
|
}
|
|
|
-.left {
|
|
|
- min-width: 200px;
|
|
|
+.treeTitle {
|
|
|
+ width: 100%;
|
|
|
+ max-width: 100%;
|
|
|
+ white-space: nowrap;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ overflow: hidden;
|
|
|
}
|
|
|
</style>
|