From 9201d70b3d0977bdfb7eff4d41455f5b7c178d81 Mon Sep 17 00:00:00 2001 From: odc.xiaohui <xiaohui@Q1> Date: 星期一, 04 十二月 2023 15:42:46 +0800 Subject: [PATCH] 修改视频专网 --- src/views/index.vue | 289 ++++++++++++++++++++++++--------------------------------- 1 files changed, 124 insertions(+), 165 deletions(-) diff --git a/src/views/index.vue b/src/views/index.vue index 5574922..2b64254 100644 --- a/src/views/index.vue +++ b/src/views/index.vue @@ -1,132 +1,74 @@ <template> <div class="p-2"> - <transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave"> - <div class="mb-[10px]" v-show="showSearch"> - <el-card shadow="hover"> - <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px"> - <!-- <el-form-item label="鏂囦欢鍚�" prop="fileName">--> - <!-- <el-input v-model="queryParams.fileName" placeholder="璇疯緭鍏ユ枃浠跺悕" clearable style="width: 200px" @keyup.enter="handleQuery" />--> - <!-- </el-form-item>--> - <el-form-item label="鍘熷悕" prop="originalName"> - <el-input v-model="queryParams.originalName" placeholder="璇疯緭鍏ュ師鍚�" clearable style="width: 200px" @keyup.enter="handleQuery" /> - </el-form-item> -<!-- <el-form-item label="鏂囦欢鍚庣紑" prop="fileSuffix">--> -<!-- <el-input v-model="queryParams.fileSuffix" placeholder="璇疯緭鍏ユ枃浠跺悗缂�" clearable style="width: 200px" @keyup.enter="handleQuery" />--> +<!-- <transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">--> +<!-- <div class="mb-[10px]" v-show="showSearch">--> +<!-- <el-card shadow="hover">--> +<!-- <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">--> + +<!-- <el-form-item label="鍘熷悕" prop="originalName">--> +<!-- <el-input v-model="queryParams.originalName" placeholder="璇疯緭鍏ュ師鍚�" clearable style="width: 200px" @keyup.enter="handleQuery" />--> <!-- </el-form-item>--> - <!-- <el-form-item label="鍒涘缓鏃堕棿">--> - <!-- <el-date-picker--> - <!-- v-model="dateRangeCreateTime"--> - <!-- value-format="YYYY-MM-DD HH:mm:ss"--> - <!-- type="daterange"--> - <!-- range-separator="-"--> - <!-- start-placeholder="寮�濮嬫棩鏈�"--> - <!-- end-placeholder="缁撴潫鏃ユ湡"--> - <!-- :default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 1, 1, 23, 59, 59)]"--> - <!-- ></el-date-picker>--> - <!-- </el-form-item>--> - <!-- <el-form-item label="鏈嶅姟鍟�" prop="service">--> - <!-- <el-input v-model="queryParams.service" placeholder="璇疯緭鍏ユ湇鍔″晢" clearable style="width: 200px" @keyup.enter="handleQuery" />--> - <!-- </el-form-item>--> - <el-form-item> - <el-button type="primary" icon="search" @click="handleQuery">鎼滅储</el-button> - <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button> - </el-form-item> - </el-form> - </el-card> - </div> - </transition> + +<!-- <el-form-item>--> +<!-- <el-button type="primary" icon="search" @click="handleQuery">鎼滅储</el-button>--> +<!-- <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>--> +<!-- </el-form-item>--> +<!-- </el-form>--> +<!-- </el-card>--> +<!-- </div>--> +<!-- </transition>--> <el-card shadow="hover"> <template #header> - <el-row :gutter="10" class="mb8"> - <el-col :span="1.5"> + <el-row style="text-align: center"> + <el-col> <el-button type="primary" plain icon="Upload" @click="handleFile" v-if="isContains(useUserStore().permissions, 'system:oss:upload')">涓婁紶鏂囦欢</el-button> </el-col> + <!-- <el-col :span="1.5">--> -<!-- <el-button type="primary" plain icon="Upload" @click="handleImage" v-if="isContains(useUserStore().permissions, 'system:oss:upload')">涓婁紶鍥剧墖</el-button>--> +<!-- <el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-if="isContains(useUserStore().permissions, 'system:oss:remove')">--> +<!-- 鍒犻櫎--> +<!-- </el-button>--> <!-- </el-col>--> -<!-- <el-col :span="1.5">--> -<!-- <el-button type="primary" plain icon="Upload" @click="handleVideo" v-if="isContains(useUserStore().permissions, 'system:oss:upload')">涓婁紶瑙嗛</el-button>--> -<!-- </el-col>--> - <el-col :span="1.5"> - <el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-if="isContains(useUserStore().permissions, 'system:oss:remove')"> - 鍒犻櫎 - </el-button> - </el-col> - <!-- <el-col :span="1.5">--> - <!-- <el-button--> - <!-- :type="previewListResource ? 'danger' : 'warning'"--> - <!-- plain--> - <!-- @click="handlePreviewListResource(!previewListResource)"--> - <!-- v-hasPermi="['system:oss:edit']"--> - <!-- >棰勮寮�鍏� :--> - <!-- {{--> - <!-- previewListResource ? "绂佺敤" : "鍚敤" }}</el-button--> - <!-- >--> - <!-- </el-col>--> - <el-col :span="1.5"> - <el-button type="info" plain icon="Operation" @click="handleOssConfig" v-hasPermi="['system:oss:lists']">閰嶇疆绠$悊</el-button> - </el-col> - <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar> +<!-- <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>--> </el-row> </template> - - <el-table - v-loading="loading" - :data="ossList" - @selection-change="handleSelectionChange" - :header-cell-class-name="handleHeaderClass" - @header-click="handleHeaderCLick" - v-if="showTable" - > - <el-table-column type="selection" width="55" align="center" /> - <!-- <el-table-column label="瀵硅薄瀛樺偍涓婚敭" align="center" prop="ossId" v-if="true" />--> - <!-- <el-table-column label="鏂囦欢鍚�" align="center" prop="fileName" />--> - <el-table-column label="鍘熷悕" align="center" prop="originalName" /> -<!-- <el-table-column label="鏂囦欢鍚庣紑" align="center" prop="fileSuffix" />--> - <!-- <el-table-column label="鏂囦欢灞曠ず" align="center" prop="url">--> - <!-- <template #default="scope">--> - <!-- <ImagePreview--> - <!-- v-if="previewListResource && checkFileSuffix(scope.row.fileSuffix)"--> - <!-- :width="100"--> - <!-- :height="100"--> - <!-- :src="scope.row.url"--> - <!-- :preview-src-list="[scope.row.url]"--> - <!-- />--> - <!-- <span v-text="scope.row.url" v-if="!checkFileSuffix(scope.row.fileSuffix) || !previewListResource" />--> - <!-- </template>--> - <!-- </el-table-column>--> -<!-- <el-table-column label="鍒涘缓鏃堕棿" align="center" prop="createTime" width="180" sortable="custom">--> +<!-- <el-table--> +<!-- v-loading="loading"--> +<!-- :data="ossList"--> +<!-- @selection-change="handleSelectionChange"--> +<!-- :header-cell-class-name="handleHeaderClass"--> +<!-- @header-click="handleHeaderCLick"--> +<!-- v-if="showTable"--> +<!-- >--> +<!-- <el-table-column type="index" />--> +<!--<!– <el-table-column type="selection" width="55" align="center" />–>--> +<!-- <el-table-column label="鍘熷悕" align="center" prop="originalName" />--> +<!-- <el-table-column label="涓婁紶鏃堕棿" align="center" prop="createTime" />--> +<!-- <el-table-column label="鎿嶄綔" align="center" class-name="small-padding fixed-width">--> <!-- <template #default="scope">--> -<!-- <span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d}') }}</span>--> +<!-- <el-tooltip content="鏌ョ湅鎻愬彇鐮�" placement="top">--> +<!-- <el-button link type="primary" icon="Search" @click="handleCode(scope.row)" v-if="isContains(useUserStore().permissions, 'system:oss:view')"></el-button>--> +<!-- </el-tooltip>--> +<!-- <el-tooltip content="涓嬭浇" placement="top">--> +<!-- <el-button link type="primary" icon="Download" @click="handleDownload(scope.row)" v-if="isContains(useUserStore().permissions, 'system:oss:download')"></el-button>--> +<!-- </el-tooltip>--> +<!-- <el-tooltip content="鍒犻櫎" placement="top">--> +<!-- <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-if="isContains(useUserStore().permissions, 'system:oss:remove')"></el-button>--> +<!-- </el-tooltip>--> <!-- </template>--> <!-- </el-table-column>--> - <el-table-column label="涓婁紶浜�" align="center" prop="createByName" /> - <!-- <el-table-column label="鏈嶅姟鍟�" align="center" prop="service" sortable="custom" />--> - <el-table-column label="鎿嶄綔" align="center" class-name="small-padding fixed-width"> - <template #default="scope"> - <el-tooltip content="鏌ョ湅鎻愬彇鐮�" placement="top"> - <el-button link type="primary" icon="Search" @click="handleCode(scope.row)" v-if="isContains(useUserStore().permissions, 'system:oss:view')"></el-button> - </el-tooltip> - <el-tooltip content="涓嬭浇" placement="top"> - <el-button link type="primary" icon="Download" @click="handleDownload(scope.row)" v-if="isContains(useUserStore().permissions, 'system:oss:download')"></el-button> - </el-tooltip> - <el-tooltip content="鍒犻櫎" placement="top"> - <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-if="isContains(useUserStore().permissions, 'system:oss:remove')"></el-button> - </el-tooltip> - </template> - </el-table-column> - </el-table> +<!-- </el-table>--> - <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" /> +<!-- <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />--> </el-card> <!-- 娣诲姞鎴栦慨鏀筄SS瀵硅薄瀛樺偍瀵硅瘽妗� --> <el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body> <el-form ref="ossFormRef" :model="form" :rules="rules" label-width="80px"> <el-form-item label="鏂囦欢鍚�"> - <fileUpload ref="childFile" @closePopup="getList()" v-model="form.file" v-if="type === 0" /> + <fileUpload ref="childFile" @closePopup="getList();lookPawsd($event)" v-model="form.file" v-if="type === 0" /> <imageUpload v-model="form.file" v-if="type === 1" /> - <video-upload v-model="form.file" v-if="type === 2" />" + <video-upload v-model="form.file" v-if="type === 2" /> </el-form-item> </el-form> <template #footer> @@ -137,12 +79,17 @@ </template> </el-dialog> <el-dialog :title="titleDownload" v-model="visibleCode" width="500px" append-to-body> + <p style="color: red">鎻愬彇鐮佸皢浼氬湪24灏忔椂鍚庡け鏁堣灏藉揩涓嬭浇!</p> <span v-show="titleDownload=='鏌ョ湅鎻愬彇鐮�'">{{testtxt}}</span> - <el-input style="margin: 10px 0" ref="inputRef" :style="inputSty" v-show="titleDownload!='鏌ョ湅鎻愬彇鐮�'" v-model="pasTxt" v-if="isContains(useUserStore().permissions, 'system:oss:download')" placeholder="璇疯緭鍏ユ枃浠舵彁鍙栫爜"></el-input> - <el-button link type="primary" v-show="titleDownload!='鏌ョ湅鎻愬彇鐮�'" icon="Download" @click="handleDownloadFile()" v-if="isContains(useUserStore().permissions, 'system:oss:download')">涓嬭浇</el-button> + <el-input style="margin: 10px 0" ref="inputRef" :style="inputSty" v-show="titleDownload=='杈撳叆鎻愬彇鐮�'" v-model="pasTxt" v-if="isContains(useUserStore().permissions, 'system:oss:download')" placeholder="璇疯緭鍏ユ枃浠舵彁鍙栫爜"></el-input> + <el-input style="margin: 10px 0" ref="inputRef" :style="inputSty" v-show="titleDownload=='璇疯緭鍏ユ彁鍙栫爜'" v-model="pasTxt" placeholder="璇疯緭鍏ユ枃浠舵彁鍙栫爜"></el-input> +<!-- <el-button link type="primary" v-show="titleDownload=='杈撳叆鎻愬彇鐮�'" icon="Download" @click="handleDownloadFile()" v-if="isContains(useUserStore().permissions, 'system:oss:download')">涓嬭浇</el-button>--> +<!-- <el-button link type="primary" v-show="titleDownload=='璇疯緭鍏ユ彁鍙栫爜'" icon="Delete" @click="delFile()" >鍒犻櫎</el-button>--> <template #footer> <div class="dialog-footer"> - <el-button type="primary" @click="visibleCode = false">纭� 瀹�</el-button> + <el-button link type="primary" v-show="titleDownload=='杈撳叆鎻愬彇鐮�'" icon="Download" @click="handleDownloadFile()" v-if="isContains(useUserStore().permissions, 'system:oss:download')">涓嬭浇</el-button> + <el-button link type="primary" v-show="titleDownload=='璇疯緭鍏ユ彁鍙栫爜'" icon="Delete" @click="delFile()" >鍒犻櫎</el-button> +<!-- <el-button type="primary" @click="visibleCode = false">纭� 瀹�</el-button>--> <el-button @click="visibleCode = false">鍙� 娑�</el-button> </div> </template> @@ -152,17 +99,13 @@ <script setup name="Oss" lang="ts"> import { listOss, delOss, createUser, examineIds } from "@/api/system/oss"; -import ImagePreview from "@/components/ImagePreview/index.vue"; import { OssForm, OssQuery, OssVO } from "@/api/system/oss/types"; -import { getInfo } from "@/api/login"; import { to as tos } from "await-to-js"; import useUserStore from "@/store/modules/user"; -import { setToken } from "@/utils/auth"; +import { getToken, setToken } from "@/utils/auth"; import usePermissionStore from "@/store/modules/permission"; import { isHttp } from "@/utils/validate"; -import { any } from "vue-types"; - -const router = useRouter(); +import router from '@/router'; const { proxy } = getCurrentInstance() as ComponentInternalInstance; const ossList = ref<OssVO[]>([]); @@ -190,6 +133,7 @@ const inputSty =ref<any>() const currentIp = ref('') const childFile = ref<any>() +const figType = ref<any>() // 榛樿鎺掑簭 const defaultSort = ref({ prop: 'createTime', order: 'ascending' }); @@ -318,9 +262,6 @@ getList(); } /** 浠诲姟鏃ュ織鍒楄〃鏌ヨ */ -const handleOssConfig = () => { - router.push('/system/oss-config/index') -} /** 鏂囦欢鎸夐挳鎿嶄綔 */ const handleFile = () => { reset(); @@ -346,8 +287,13 @@ const submitForm = async () => { await childFile.value.handleCilck() dialog.visible = false; - // setTimeout(() =>{ getList();},1000) - +} +const lookPawsd = async (row: OssVO) => { + console.log(row, row.ossId); + testtxt.value = row.password; + titleDownload.value = '鏌ョ湅鎻愬彇鐮�' + pasTxt.value = '' + visibleCode.value = true } const handleCode = async (row: OssVO) => { console.log(row, row.ossId); @@ -382,6 +328,13 @@ downIds.value = ref(row.ossId) console.log(toRaw(downIds.value.value)); } +const delFile=async () => { + let oss = figType.value+'/'+ pasTxt.value; + await delOss(oss).finally(() => loading.value = false); + await getList(); + proxy?.$modal.msgSuccess("鍒犻櫎鎴愬姛"); + visibleCode.value = false +} const handleDownloadFile = ()=>{ console.log(downIds.value); if (pasTxt.value){ @@ -393,31 +346,31 @@ } // inputRef.value.style.border = '1px solid red' } - + visibleCode.value=false } /** 鐢ㄦ埛鐘舵�佷慨鏀� */ -const handlePreviewListResource = async (preview: boolean) => { - let text = preview ? "鍚敤" : "鍋滅敤"; - try { - await proxy?.$modal.confirm('纭瑕�"' + text + '""棰勮鍒楄〃鍥剧墖"閰嶇疆鍚�?'); - await proxy?.updateConfigByKey("sys.oss.previewListResource", preview); - await getList() - proxy?.$modal.msgSuccess(text + "鎴愬姛"); - } catch { return } -} /** 鍒犻櫎鎸夐挳鎿嶄綔 */ const handleDelete = async (row?: OssVO) => { - const ossIds = row?.ossId || ids.value; - await proxy?.$modal.confirm('鏄惁纭鍒犻櫎OSS瀵硅薄瀛樺偍缂栧彿涓�"' + ossIds + '"鐨勬暟鎹」?'); - loading.value = true; - await delOss(ossIds).finally(() => loading.value = false); - await getList(); - proxy?.$modal.msgSuccess("鍒犻櫎鎴愬姛"); + let ossIds = row?.ossId || ids.value; + titleDownload.value = '璇疯緭鍏ユ彁鍙栫爜' + pasTxt.value = '' + inputSty.value ={ + border: '1px solid blue', + borderRadius: '5px' + } + visibleCode.value = true + figType.value = ossIds + console.log(figType); + // await proxy?.$modal.confirm('鏄惁纭鍒犻櫎OSS瀵硅薄瀛樺偍缂栧彿涓�"' + ossIds + '"鐨勬暟鎹」?'); + // loading.value = true; + // ossIds = ossIds+'/'+pasTxt.value; + // await delOss(ossIds).finally(() => loading.value = false); + // await getList(); + // proxy?.$modal.msgSuccess("鍒犻櫎鎴愬姛"); } const refreshPage = async () => { - // const [err] = await tos(useUserStore().getInfo()); - // console.log(err); const accessRoutes = await usePermissionStore().generateRoutes(); + console.log(accessRoutes,'accessRoutes',router); // 鏍规嵁roles鏉冮檺鐢熸垚鍙闂殑璺敱琛� accessRoutes.forEach((route) => { if (!isHttp(route.path)) { @@ -429,6 +382,7 @@ const isContains = (arr: string | any[], value: any) => { return arr.includes(value); }; + const setAddUser = async (val: any | number | (string | number)[]) => { console.log(val); const res = await createUser(val) @@ -436,15 +390,13 @@ if (res.code==200){ const data = res.data; setToken(data.access_token); - await refreshPage() + const [err] = await tos(useUserStore().getInfo()); + console.log('useUserStore', useUserStore,err); await getList() - await nextTick(async () => { - const [err] = await tos(useUserStore().getInfo()); - console.log('useUserStore', useUserStore,err); + + // await refreshPage() + console.log('permissions', useUserStore().permissions,'system:oss:upload'); - - }) - // token.value = data.access_token; } } @@ -457,32 +409,39 @@ // }); onBeforeMount( async () => { console.log('绗竴',useUserStore().permissions); - try { - // 浣跨敤fetch API鑾峰彇褰撳墠IP鍦板潃 - await fetch('https://api.ipify.org/?format=json') - .then(response => response.json()) - .then(async data => { - currentIp.value = data.ip; - let obj = { - username: data.ip - } - await setAddUser(obj) - }) - .catch(error => { - console.error('鑾峰彇IP鍦板潃澶辫触锛�', error); - }); - } catch (error) { - console.log(error); - } + // try { + // // 浣跨敤fetch API鑾峰彇褰撳墠IP鍦板潃 + // await fetch('https://api.ipify.org/?format=json') + // .then(response => response.json()) + // .then(async data => { + // currentIp.value = data.ip; + // let obj = { + // username: data.ip + // } + // await setAddUser(obj) + // }) + // .catch(error => { + // console.error('鑾峰彇IP鍦板潃澶辫触锛�', error); + // }); + // } catch (error) { + // console.log(error); + // } }) onMounted(async () => { - console.log('绗簩',useUserStore().permissions); + console.log('绗簩aaaaaaa',useUserStore().permissions); // 绛夊緟 useUserStore() 鏂规硶鐨� getInfo() 鏂规硶杩斿洖缁撴灉骞惰祴鍊肩粰 err 鍙橀噺 // const [err] = await tos(useUserStore().getInfo()); + if (getToken()){ + console.log('鏈塼oken'); + await getList(); + }else { + console.log('鏃爐oken'); + router.push('/login') + } // 璋冪敤 getList() 鏂规硶 - // await getList(); + }) </script> -- Gitblit v1.8.0