ソースを参照

企业-实习情况

Xiao_123 2 ヶ月 前
コミット
bbfa42a467

+ 2 - 0
components.d.ts

@@ -33,7 +33,9 @@ declare module 'vue' {
     Echarts: typeof import('./src/components/Echarts/index.vue')['default']
     ElCascader: typeof import('element-plus/es')['ElCascader']
     ElConfigProvider: typeof import('element-plus/es')['ElConfigProvider']
+    ElIcon: typeof import('element-plus/es')['ElIcon']
     ElTree: typeof import('element-plus/es')['ElTree']
+    ElUpload: typeof import('element-plus/es')['ElUpload']
     Empty: typeof import('./src/components/Empty/index.vue')['default']
     File: typeof import('./src/components/Upload/file.vue')['default']
     HeadSearch: typeof import('./src/components/headSearch/index.vue')['default']

+ 11 - 0
src/views/recruit/enterprise/student/InternFeedback/index.vue

@@ -0,0 +1,11 @@
+<template>
+	<v-card class="card-box">待开发</v-card>
+</template>
+
+<script setup>
+defineOptions({ name: 'InternFeedback' })
+</script>
+
+<style scoped lang="scss">
+
+</style>

+ 63 - 0
src/views/recruit/enterprise/student/InternshipSituation/CertificateForm.vue

@@ -0,0 +1,63 @@
+<template>
+	<div>
+		<CtForm ref="CtFormRef" class="mt-3" :items="formItems">
+			<template #uploadFile="{ item }">
+				<TextInput v-model="item.value" :item="item" @click="openFileInput"></TextInput>
+				<File ref="uploadFile" @success="handleUploadResume"></File>
+			</template>
+		</CtForm>
+		<div class="color-666" style="font-size: 13px;">* 仅支持DOC、DOCX、PDF文件且大小不能超过20MB</div>
+	</div>
+</template>
+
+<script setup>
+defineOptions({ name: 'CertificateForm'})
+import { ref } from 'vue'
+
+const CtFormRef = ref()
+const formItems = ref({
+  options: [
+    {
+      slotName: 'uploadFile',
+      key: 'url',
+      value: '',
+      truthValue: '',
+      label: '点击上传附件 *',
+      outline: true,
+      accept: '.doc, .docx, .pdf',
+      prependInnerIcon: 'mdi-file-document-outline',
+      rules: [v => !!v || '附件不能为空']
+    }
+  ]
+})
+
+// 选择文件
+const uploadFile = ref()
+const openFileInput = () => {
+  uploadFile.value.trigger()
+}
+
+// 上传附件
+const handleUploadResume = async (url, title, filename) => {
+  const obj = formItems.value.options.find(e => e.key === 'url')
+  obj.value = filename
+  obj.truthValue = url
+}
+
+const getQuery = () => {
+	let obj = {}
+	formItems.value.options.forEach(e => {
+		obj[e.key] = e.truthValue
+	})
+	return obj
+}
+
+defineExpose({
+	getQuery,
+	CtFormRef
+})
+</script>
+
+<style scoped lang="scss">
+
+</style>

+ 61 - 0
src/views/recruit/enterprise/student/InternshipSituation/RecommendationLetterForm.vue

@@ -0,0 +1,61 @@
+<template>
+	<CtForm ref="CtFormRef" class="mt-3" :items="formItems">
+    <template #uploadFile="{ item }">
+      <TextInput v-model="item.value" :item="item" @click="openFileInput"></TextInput>
+      <File ref="uploadFile" @success="handleUploadResume"></File>
+    </template>
+  </CtForm>
+  <div class="color-666" style="font-size: 13px;">* 仅支持DOC、DOCX、PDF文件且大小不能超过20MB</div>
+</template>
+
+<script setup>
+defineOptions({ name: 'RecommendationLetterForm'})
+import { ref } from 'vue'
+
+const CtFormRef = ref()
+const formItems = ref({
+  options: [
+    {
+      slotName: 'uploadFile',
+      key: 'url',
+      value: '',
+      truthValue: '',
+      label: '点击上传推荐信 *',
+      outline: true,
+      accept: '.doc, .docx, .pdf',
+      prependInnerIcon: 'mdi-file-document-outline',
+      rules: [v => !!v || '推荐信不能为空']
+    }
+  ]
+})
+
+// 选择文件
+const uploadFile = ref()
+const openFileInput = () => {
+  uploadFile.value.trigger()
+}
+
+// 上传附件
+const handleUploadResume = async (url, title, filename) => {
+  const obj = formItems.value.options.find(e => e.key === 'url')
+  obj.value = filename
+  obj.truthValue = url
+}
+
+const getQuery = () => {
+	let obj = {}
+	formItems.value.options.forEach(e => {
+		obj[e.key] = e.truthValue
+	})
+	return obj
+}
+
+defineExpose({
+	getQuery,
+	CtFormRef
+})
+</script>
+
+<style scoped lang="scss">
+
+</style>

+ 176 - 0
src/views/recruit/enterprise/student/InternshipSituation/index.vue

@@ -0,0 +1,176 @@
+<template>
+	<v-card class="card-box pa-3">
+		<div class="d-flex">
+			<!-- 统计 -->
+			<div class="d-flex align-center statistics">
+				<div v-for="val in statistics" :key="val.key" class="statistics-card pa-5">
+					<div class="color-666">{{ val.label }}</div>
+					<div class="">
+						<span class="value font-weight-bold color-primary">{{ val.value }}</span>
+						<span class="color-999 font-size-14">人</span>
+					</div>
+				</div>
+			</div>
+			<!-- 时间范围筛选 -->
+			<div class="d-flex align-center ml-7">
+        <span class="color-666">自定义日期</span>
+        <div class="ml-5">
+          <date-picker 
+						v-model="date"
+						:item="{
+							mode: 'daterange',
+							clearable: true,
+							placeholder: '请选择要查看的时间范围',
+							format: 'YYYY/MM/DD',
+							width: 250
+						}"
+						@change="handleChangeDate"
+					/>
+        </div>
+      </div>
+		</div>
+
+		<div class="d-flex mt-5">
+			<v-treeview :items="items" color="primary" style="width: 25%; border-right: 1px solid #eee;" class="pr-5"></v-treeview>
+			<CtTable
+				class="ml-5"
+        :items="tableData"
+        :headers="headers"
+        :loading="loading"
+        :elevation="0"
+        :is-tools="false"
+        :showPage="true"
+        :total="total"
+        :page-info="query"
+        itemKey="id"
+        @pageHandleChange="handleChangePage"
+				style="flex: 1;"
+      >
+        <template #studentName="{ item }">
+          <div class="d-flex align-center">
+            <v-avatar size="40" :image="getUserAvatar(item.studentHeadImg, item.sex)"></v-avatar>
+            <span class="ml-3">{{ item?.studentName }}</span>
+          </div>
+        </template>
+        <template #actions="{ item }">
+          <v-btn color="primary" variant="text" @click="handleUploadLetter(item)">上传推荐信</v-btn>
+          <v-btn color="#00897B" variant="text" @click="handleIssueCertificate(item)">颁发实习证书</v-btn>
+        </template>
+      </CtTable>
+		</div>
+	</v-card>
+
+	<!-- 上传推荐信 -->
+	<CtDialog :visible="showLitterDialog" :widthType="2" titleClass="text-h6" title="上传推荐信" @close="showLitterDialog = false;" @submit="handleSubmitLetter">
+    <UploadRecommendationLetterForm ref="RecommendationLetterRef" />
+  </CtDialog>
+
+	<!-- 颁发实习证书 -->
+	<CtDialog :visible="showCertificateDialog" :widthType="2" titleClass="text-h6" title="颁发实习证书" @close="showCertificateDialog = false;" @submit="handleSubmitCertificate">
+    <IssueCertificateForm ref="IssueCertificateFormRef" />
+  </CtDialog>
+</template>
+
+<script setup>
+defineOptions({ name: 'enterpriseStudentInternshipSituation' })
+import { ref } from 'vue'
+import { getUserAvatar } from '@/utils/avatar'
+import DatePicker from '@/components/FormUI/datePicker'
+import UploadRecommendationLetterForm from './RecommendationLetterForm'
+import IssueCertificateForm from './CertificateForm'
+
+const date = ref(null)
+const statistics = ref([
+	{ label: '实习中', value: 2, key: 'studentPracticeApplyCount' },
+	{ label: '实习结束', value: 6, key: 'studentPracticeSuccessCount' },
+	{ label: '等待实习', value: 10, key: 'studentPracticeWaitCount' }
+])
+
+const items = ref([
+  { id: 1, title: '运营部' },
+  { id: 2, title: '开发部' },
+  { id: 3, title: '行政部' },
+  { id: 4, title: '市场部' }
+])
+const loading = ref(false)
+const total = ref(0)
+const query = ref({
+	pageNo: 1,
+	pageSize: 10
+})
+const tableData = ref([
+	{
+		id: 1,
+		studentHeadImg: 'https://minio.menduner.com/dev/4cd324c459e055c34f8467089bd8c3013e2a95dee6f3883cbdacf100b9a50d52.jpeg',
+		studentName: '张三',
+		sex: '1',
+		schoolDepartmentName: '计算机学院',
+		majorName: '计算机科学与技术'
+	},
+	{
+		id: 2,
+		studentHeadImg: 'https://minio.menduner.com/dev/4cd324c459e055c34f8467089bd8c3013e2a95dee6f3883cbdacf100b9a50d52.jpeg',
+		studentName: '张三',
+		sex: '2',
+		schoolDepartmentName: '计算机学院',
+		majorName: '计算机科学与技术'
+	}
+])
+const headers = [
+  { title: '学生姓名', key: 'studentName', sortable: false },
+  { title: '所属院系', key: 'schoolDepartmentName', sortable: false },
+  { title: '所属专业', key: 'majorName', sortable: false },
+  { title: '操作', key: 'actions', sortable: false }
+]
+
+const handleChangePage = (val) => {
+	query.value.pageNo = val
+}
+
+// 时间范围选择
+const handleChangeDate = (time) => {
+	console.log(time, 'range')
+}
+
+// 上传推荐信
+const showLitterDialog = ref(false)
+const RecommendationLetterRef = ref(null)
+const handleUploadLetter = () => {
+	showLitterDialog.value = true
+}
+const handleSubmitLetter = async () => {
+	const { valid } = await RecommendationLetterRef.value.CtFormRef.formRef.validate()
+	if (!valid) return
+	const query = RecommendationLetterRef.value.getQuery()
+	console.log(query, '推荐信-form')
+}
+
+// 颁发实习证书
+const showCertificateDialog = ref(false)
+const IssueCertificateFormRef = ref(null)
+const handleIssueCertificate = () => {
+	showCertificateDialog.value = true
+}
+
+const handleSubmitCertificate = async () => {
+  
+}
+</script>
+
+<style scoped lang="scss">
+.statistics {
+	width: 50%;
+	&-card {
+		width: 33.33%;
+		margin-right: 12px;
+		background-color: #f7f8fa;
+		border-radius: 10px;
+		&:nth-child(3) {
+			margin-right: 0;
+		}
+		.value {
+			font-size: 44px;
+		}
+	}
+}
+</style>