231 lines
7.2 KiB
Plaintext
231 lines
7.2 KiB
Plaintext
<script setup lang="ts">
|
||
import { NSelect, useMessage,NModal } from 'naive-ui'
|
||
import { getLabCsrActList, getLabActList } from '@/api/daikin/base'
|
||
import HomeHead from '@/views/home/components/HomeHead.vue'
|
||
|
||
const message = useMessage()
|
||
const actTopIsSelects = ref()
|
||
const actMidIsSelects = ref()
|
||
const actDownIsSelects = ref()
|
||
|
||
|
||
const route = useRoute()
|
||
onBeforeMount(async () => {
|
||
pageInfo.index = route.params.id
|
||
value.value = route.params.id
|
||
getSwiperList()
|
||
const { data } = await getLabActList()
|
||
const { actTopIsSelect, actMidIsSelect, actDownIsSelect } = data
|
||
actTopIsSelects.value = actTopIsSelect
|
||
actMidIsSelects.value = actMidIsSelect
|
||
actDownIsSelects.value = actDownIsSelect
|
||
|
||
})
|
||
let swiperList = ref([])
|
||
|
||
async function getSwiperList() {
|
||
const indexId = pageInfo.index
|
||
const { rows, total } = await getLabCsrActList({ indexId, pageNum: pageInfo.currentPage, pageSize: pageInfo.pageSize })
|
||
pageInfo.total = total
|
||
if (!rows) return
|
||
const datas = rows.map((item: any) => Object.assign(item, {
|
||
indexId: item.indexId + '',
|
||
}))
|
||
swiperList.value = datas
|
||
swiperList.value = datas.map((item: { filePathList: any[] }) => {
|
||
const fileList = item.filePathList.map((itt: any) => Object.assign(itt, {
|
||
name: itt.originalFileName,
|
||
url: itt.url
|
||
}))
|
||
return { ...item, fileList }
|
||
})
|
||
}
|
||
const value = ref()
|
||
const optt = [{ id: '1', cateName: '核心部品强化' }, { id: '2', cateName: '新领域部材探索' }, { id: '3', cateName: '外部调研报告' }]
|
||
|
||
const thisSelect = (e) => {
|
||
pageInfo.index = e
|
||
}
|
||
const thisSelects = () => {
|
||
pageInfo.index = ''
|
||
}
|
||
|
||
const pageInfo = reactive({
|
||
currentPage: 1,
|
||
pageSize: 13,
|
||
total: 13,
|
||
index: ''
|
||
})
|
||
const ss = computed(() => [pageInfo.index, pageInfo.currentPage])
|
||
watch(() => unref(ss),
|
||
async (v) => {
|
||
|
||
getSwiperList()
|
||
|
||
},
|
||
{ immediate: true, deep: true },
|
||
)
|
||
|
||
const handleSizeChange = (e) => {
|
||
console.log(e)
|
||
}
|
||
|
||
const handleCurrentChange = (e) => {
|
||
console.log(e)
|
||
}
|
||
|
||
const srcType = ref()
|
||
const pdfShow =ref(false)
|
||
const src = ref()
|
||
const openUrl = async (url)=>{
|
||
// console.log(url,2222)
|
||
if(!url) {
|
||
message.info("没有可预览文件！")
|
||
return
|
||
}
|
||
srcType.value = getLastSubstring(url)
|
||
if(['doc', 'docx', 'ppt', 'pptx', 'xls', 'xlsx','pdf'].includes(srcType.value)){
|
||
// src.value = filePath
|
||
// pdfShow.value = true
|
||
url='https://view.xdocin.com/view?src='+url
|
||
const screenWidth = window.screen.width;
|
||
const screenHeight = window.screen.height;
|
||
window.open(url, '', 'width=' + screenWidth + ',height=' + screenHeight + ',top=' + 0 + ',left=' + 0)
|
||
}
|
||
else{
|
||
message.error("文件格式不是 'doc', 'docx', 'ppt', 'pptx', 'xls', 'xlsx','pdf'！")
|
||
}
|
||
|
||
|
||
}
|
||
function getLastSubstring(str: string): string {
|
||
const lastIndex = str.lastIndexOf('.');
|
||
if (lastIndex !== -1) {
|
||
return str.substring(lastIndex + 1);
|
||
} else {
|
||
return '';
|
||
}
|
||
}
|
||
|
||
|
||
function downClicks(data) {
|
||
if (actTopIsSelects.value === 2) {
|
||
message.info("没有访问权限")
|
||
return
|
||
}
|
||
let url, name
|
||
if (data.filePath === undefined || data.filePath === '') {
|
||
message.info("没有可下载文件！")
|
||
return
|
||
}
|
||
else {
|
||
url = data.filePath
|
||
name = data.title
|
||
}
|
||
|
||
if (!url) return
|
||
openUrl(url)
|
||
}
|
||
|
||
async function downloadFiles(url: RequestInfo | URL, name: string) {
|
||
try {
|
||
const response = await fetch(url);
|
||
const blob = await response.blob();
|
||
|
||
const downloadUrl = URL.createObjectURL(blob);
|
||
const link = document.createElement('a');
|
||
link.href = downloadUrl;
|
||
link.download = name // 替换为你要保存的文件名
|
||
link.click();
|
||
URL.revokeObjectURL(downloadUrl);
|
||
} catch (error) {
|
||
message.error('下载文件出错：', error);
|
||
}
|
||
}
|
||
|
||
|
||
</script>
|
||
|
||
<template>
|
||
<HomeHead class="top">
|
||
</HomeHead>
|
||
<div class="relative w-full h-full">
|
||
<div class="font-600 flex items-center mt30px">
|
||
<img src="./images/logo.svg" class="h56px mr21px" />
|
||
<div class="text-36px">差别化研究分类列表</div>
|
||
</div>
|
||
<div class="flex my20px">
|
||
|
||
<!-- <el-button type="primary" @click="handleEdit" class="mr-20px">新增研究方向内容</el-button> -->
|
||
<div class="leading-30px w125px h50px ml20px">请选择类别：</div>
|
||
<n-select class="w250px" size="large" v-if="optt" v-model:value="value" :show-arrow="false" :show-checkmark="false"
|
||
:options="optt" label-field="cateName" value-field="id" @update:value="thisSelect" />
|
||
<el-button type="primary" @click="thisSelects" class="ml-20px mt5px">全部</el-button>
|
||
</div>
|
||
|
||
<el-table :data="swiperList" style="width: 100%,height: 600px;overflow-y: auto;"
|
||
:header-cell-style="{ background: '#2A7BF7', color: '#fff', height: '60px', textAlign: 'center', 'font-size': '24px' }"
|
||
:cell-style="{ 'text-align': 'center', 'overflow-y': 'auto' }">
|
||
|
||
<el-table-column label="标题" prop="title">
|
||
<template #default="scope">
|
||
<span @click="downClicks(scope.row)">{{ scope.row.title }}</span>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="分类选项" width="280">
|
||
<template #default="scope">
|
||
<div>
|
||
<div v-if="scope.row.indexId === '1'">核心部品强化</div>
|
||
<div v-if="scope.row.indexId === '2'">新领域部材探索</div>
|
||
<div v-if="scope.row.indexId === '3'">外部调研报告</div>
|
||
</div>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="文件列表" prop="fileList">
|
||
<template #default="scope">
|
||
<div v-if="scope.row.fileList" v-for="(it, index) in scope.row.fileList">
|
||
{{ it.name }}
|
||
</div>
|
||
</template>
|
||
|
||
</el-table-column>
|
||
<el-table-column label="创建时间" prop="createTime" />
|
||
<!-- <el-table-column label="通知范围" prop="fileList" >
|
||
<template #default="scope">
|
||
<div v-if="actTopUserLists" v-for="(it,index) in actTopUserLists">
|
||
{{it.nickName}}
|
||
</div>
|
||
</template>
|
||
|
||
</el-table-column> -->
|
||
<!-- <el-table-column label="操作" :header-style="{ background: 'red' }">
|
||
<template #default="scope">
|
||
<el-button size="small" @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
|
||
<el-button size="small" type="danger" @click="handleDelete(scope.$index, scope.row)">删除</el-button>
|
||
</template>
|
||
</el-table-column> -->
|
||
</el-table>
|
||
</div>
|
||
|
||
|
||
|
||
<div class=" fixed bottom-65px right-100px z-200">
|
||
<el-pagination v-model:current-page="pageInfo.currentPage" v-model:page-size="pageInfo.pageSize"
|
||
layout="prev, pager, next, jumper" :total="pageInfo.total" @size-change="handleSizeChange"
|
||
@current-change="handleCurrentChange" />
|
||
</div>
|
||
|
||
<n-modal v-model:show="pdfShow">
|
||
<div class="w90% h90% ">
|
||
<Amtion :data="src" :datas="srcType" />
|
||
</div>
|
||
</n-modal>
|
||
</template>
|
||
|
||
<style scoped lang="less">
|
||
.top {
|
||
position: absolute;
|
||
right: 30px;
|
||
top: -92px;
|
||
}
|
||
</style> |