|
|
@@ -1,8 +1,11 @@
|
|
|
<template>
|
|
|
- <com-head :options="headList" >
|
|
|
+ <com-head :options="headList">
|
|
|
<el-form label-width="84px" inline="true">
|
|
|
<el-form-item label="场景标题：">
|
|
|
- <el-input v-model="search.state.sceneTitle" placeholder="请输入"></el-input>
|
|
|
+ <el-input
|
|
|
+ v-model="search.state.sceneTitle"
|
|
|
+ placeholder="请输入"
|
|
|
+ ></el-input>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="拍摄时间：">
|
|
|
<el-date-picker
|
|
|
@@ -10,7 +13,8 @@
|
|
|
type="daterange"
|
|
|
range-separator="至"
|
|
|
start-placeholder="开始日期"
|
|
|
- end-placeholder="结束日期">
|
|
|
+ end-placeholder="结束日期"
|
|
|
+ >
|
|
|
</el-date-picker>
|
|
|
</el-form-item>
|
|
|
<el-form-item class="searh-btns" style="grid-area: 1 / 3 / 2 / 4;">
|
|
|
@@ -24,7 +28,12 @@
|
|
|
<div class="body-head">
|
|
|
<h3 style="visibility: hidden;">场景管理</h3>
|
|
|
<div class="table-ctrl-right">
|
|
|
- <el-button type="primary" v-if="auth.delete" @click="cameraCompany.show = true">同步场景</el-button>
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ v-if="auth.delete"
|
|
|
+ @click="cameraCompany.show = true"
|
|
|
+ >同步场景</el-button
|
|
|
+ >
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
@@ -38,16 +47,50 @@
|
|
|
>
|
|
|
<!-- -1 计算失败 0 计算中 1 计算成功并可以外网访问，不能编辑 2计算成功只能内网，能编辑 -->
|
|
|
<el-table-column label="序号" width="55" v-slot:default="{ $index }">
|
|
|
- <div style="text-align: center">{{ pag.state.size * (pag.state.currPage - 1) + $index + 1 }}</div>
|
|
|
+ <div style="text-align: center">
|
|
|
+ {{ pag.state.size * (pag.state.currPage - 1) + $index + 1 }}
|
|
|
+ </div>
|
|
|
</el-table-column>
|
|
|
<el-table-column label="场景标题" prop="sceneName"></el-table-column>
|
|
|
<el-table-column label="S/N码" prop="snCode"></el-table-column>
|
|
|
<el-table-column label="浏览数量" prop="viewCount"></el-table-column>
|
|
|
- <el-table-column label="拍摄时间" prop="createTime" v-slot:default="{ row }"> {{row.createTime.substr(0, 11)}}</el-table-column>
|
|
|
- <el-table-column label="操作" v-slot:default="{ row }" >
|
|
|
+ <el-table-column
|
|
|
+ label="拍摄时间"
|
|
|
+ prop="createTime"
|
|
|
+ v-slot:default="{ row }"
|
|
|
+ >
|
|
|
+ {{ row.createTime.substr(0, 11) }}</el-table-column
|
|
|
+ >
|
|
|
+ <el-table-column label="操作" v-slot:default="{ row }">
|
|
|
<span class="oper-span" @click="shareHandle(row)">查看</span>
|
|
|
- <span class="oper-span" @click="auth.update && user.info.id == row.creatorId && editModel(row)" :class="{disable: !(auth.update && user.info.id == row.creatorId)}" v-if="auth.update">编辑</span>
|
|
|
- <span class="oper-span" @click="auth.delete && user.info.departmentId == row.deptId && dataList.delete(row)" :class="{disable: !(auth.delete && user.info.departmentId == row.deptId)}" style="color: var(--primaryColor)">删除</span>
|
|
|
+ <span
|
|
|
+ class="oper-span"
|
|
|
+ @click="
|
|
|
+ auth.update && user.info.id == row.creatorId && editModel(row)
|
|
|
+ "
|
|
|
+ :class="{ disable: !(auth.update && user.info.id == row.creatorId) }"
|
|
|
+ v-if="auth.update"
|
|
|
+ >编辑</span
|
|
|
+ >
|
|
|
+ <span
|
|
|
+ class="oper-span"
|
|
|
+ @click="download(row)"
|
|
|
+ v-if="row.num"
|
|
|
+ >下载</span
|
|
|
+ >
|
|
|
+ <span
|
|
|
+ class="oper-span"
|
|
|
+ @click="
|
|
|
+ auth.delete &&
|
|
|
+ user.info.departmentId == row.deptId &&
|
|
|
+ dataList.delete(row)
|
|
|
+ "
|
|
|
+ :class="{
|
|
|
+ disable: !(auth.delete && user.info.departmentId == row.deptId),
|
|
|
+ }"
|
|
|
+ style="color: var(--primaryColor)"
|
|
|
+ >删除</span
|
|
|
+ >
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
|
|
|
@@ -57,9 +100,9 @@
|
|
|
:current-page="pag.state.currPage"
|
|
|
:page-size="pag.state.size"
|
|
|
layout="total, sizes, prev, pager, next, jumper"
|
|
|
- :total="pag.state.total"/>
|
|
|
-
|
|
|
-
|
|
|
+ :total="pag.state.total"
|
|
|
+ />
|
|
|
+
|
|
|
<com-dialog
|
|
|
title="场景归属"
|
|
|
v-model:show="editCompany.show"
|
|
|
@@ -72,7 +115,6 @@
|
|
|
</el-form>
|
|
|
</com-dialog>
|
|
|
|
|
|
-
|
|
|
<com-dialog
|
|
|
title="选择相机"
|
|
|
:width="480"
|
|
|
@@ -87,14 +129,57 @@
|
|
|
v-for="item in cameras"
|
|
|
:key="item.snCode"
|
|
|
:label="item.snCode"
|
|
|
- :value="item.snCode">
|
|
|
+ :value="item.snCode"
|
|
|
+ >
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
</com-dialog>
|
|
|
|
|
|
-
|
|
|
+ <com-dialog
|
|
|
+ title="场景离线包下载"
|
|
|
+ :width="500"
|
|
|
+ v-model:show="cameraDownload.show"
|
|
|
+ :hideFloor="cameraDownload.data.type == '1'"
|
|
|
+ enterText="下 载"
|
|
|
+ @quit="suspend"
|
|
|
+ @submit="downloadItemCompany"
|
|
|
+ >
|
|
|
+ <div>
|
|
|
+ <div class="title">
|
|
|
+ {{
|
|
|
+ cameraDownload.data.type == "0"
|
|
|
+ ? "下载场景离线数据包，可在本地运行查看。"
|
|
|
+ : cameraDownload.data.type == "1"
|
|
|
+ ? "正在打包场景离线数据"
|
|
|
+ : cameraDownload.data.name
|
|
|
+ }}
|
|
|
+ </div>
|
|
|
+ <div style="marginTop:20px" v-if="cameraDownload.data.type == '0'">
|
|
|
+ 当前剩余下载次数：<span>{{ cameraDownload.data.value }}</span
|
|
|
+ >次
|
|
|
+ </div>
|
|
|
+ <div v-else-if="cameraDownload.data.type == '1'">
|
|
|
+ <div
|
|
|
+ class="text"
|
|
|
+ style="display:flex;justify-content: space-between;margin-top:15px"
|
|
|
+ >
|
|
|
+ <span>{{ cameraDownload.data.name }}</span>
|
|
|
+ <span>{{ cameraDownload.data.value }}</span>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <el-slider
|
|
|
+ :disabled="true"
|
|
|
+ v-model="cameraDownload.data.value"
|
|
|
+ :show-tooltip="false"
|
|
|
+ >
|
|
|
+ </el-slider>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </com-dialog>
|
|
|
+
|
|
|
<com-dialog
|
|
|
title="同步场景"
|
|
|
v-model:show="asyncSceneCompany"
|
|
|
@@ -110,95 +195,193 @@
|
|
|
import { ref, watch } from "vue";
|
|
|
import getTableState from "@/state/tableRef";
|
|
|
import auth from "@/state/viewAuth";
|
|
|
-import user from '@/state/user'
|
|
|
+import user from "@/state/user";
|
|
|
import comAsync from "./async";
|
|
|
import comHead from "@/components/head";
|
|
|
import comDialog from "@/components/dialog";
|
|
|
import comPagination from "@/components/pagination";
|
|
|
import comCompany from "@/components/company-select";
|
|
|
-import { getApp } from '@/app'
|
|
|
-import { dateFormat } from '@/util'
|
|
|
+import { getApp } from "@/app";
|
|
|
+import { dateFormat } from "@/util";
|
|
|
import {
|
|
|
getSceneList,
|
|
|
deleteScene,
|
|
|
getCameraOptions,
|
|
|
-} from '@/request/config'
|
|
|
-import axios from 'axios';
|
|
|
-
|
|
|
+ checkHasDownload,
|
|
|
+ getDownloadProcess,
|
|
|
+} from "@/request/config";
|
|
|
+import axios from "axios";
|
|
|
|
|
|
export default {
|
|
|
- name: 'vrmodel',
|
|
|
+ name: "vrmodel",
|
|
|
setup() {
|
|
|
const state = getTableState({
|
|
|
getUrl: getSceneList,
|
|
|
delUrl: deleteScene,
|
|
|
- delAttr: {'sceneNum': 'num'},
|
|
|
- searchAttr: { start: "", end: '', sceneTitle: '', snCode: '' }
|
|
|
+ delAttr: { sceneNum: "num" },
|
|
|
+ searchAttr: { start: "", end: "", sceneTitle: "", snCode: "" },
|
|
|
});
|
|
|
- const editCompany = ref({data: {}, show: false})
|
|
|
- const cameraCompany = ref({data: null, show: false})
|
|
|
- const asyncSceneCompany = ref(false)
|
|
|
- const cameras = ref([])
|
|
|
+ const editCompany = ref({ data: {}, show: false });
|
|
|
+ const cameraCompany = ref({ data: null, show: false });
|
|
|
+ const cameraDownload = ref({ data: { type: 0, value: 0 }, show: false });
|
|
|
+ const asyncSceneCompany = ref(false);
|
|
|
+ const cameras = ref([]);
|
|
|
const headList = ref([{ name: "场景管理", value: 2 }]);
|
|
|
- const currModel = ref(1)
|
|
|
- const time = ref(null)
|
|
|
+ const currModel = ref(1);
|
|
|
+ const time = ref(null);
|
|
|
|
|
|
watch(time, () => {
|
|
|
if (time.value) {
|
|
|
- console.log(time.value[0], time.value[1])
|
|
|
- let start1 = new Date(time.value[0])
|
|
|
- let start2 = new Date(time.value[1])
|
|
|
+ console.log(time.value[0], time.value[1]);
|
|
|
+ let start1 = new Date(time.value[0]);
|
|
|
+ let start2 = new Date(time.value[1]);
|
|
|
if (start2.getTime() - start1.getTime() < 0) {
|
|
|
- getApp().$message.error('结束日期必须大于开始日期', '提示')
|
|
|
+ getApp().$message.error("结束日期必须大于开始日期", "提示");
|
|
|
} else {
|
|
|
- state.search.value.state.start = dateFormat(start1, 'yyyy-MM-dd')
|
|
|
- state.search.value.state.end = dateFormat(start2, 'yyyy-MM-dd')
|
|
|
+ state.search.value.state.start = dateFormat(start1, "yyyy-MM-dd");
|
|
|
+ state.search.value.state.end = dateFormat(start2, "yyyy-MM-dd");
|
|
|
}
|
|
|
} else {
|
|
|
- state.search.value.state.start = state.search.value.state.end = ''
|
|
|
+ state.search.value.state.start = state.search.value.state.end = "";
|
|
|
}
|
|
|
- })
|
|
|
+ });
|
|
|
watch(
|
|
|
- [() => state.search.value.state.start, () => state.search.value.state.end],
|
|
|
+ [
|
|
|
+ () => state.search.value.state.start,
|
|
|
+ () => state.search.value.state.end,
|
|
|
+ ],
|
|
|
() => {
|
|
|
if (!state.search.value.state.start || !state.search.value.state.end) {
|
|
|
- time.value = null
|
|
|
+ time.value = null;
|
|
|
}
|
|
|
}
|
|
|
- )
|
|
|
+ );
|
|
|
|
|
|
watch(asyncSceneCompany, () => {
|
|
|
- asyncSceneCompany.value || state.dataList.value.refer()
|
|
|
- })
|
|
|
+ asyncSceneCompany.value || state.dataList.value.refer();
|
|
|
+ });
|
|
|
|
|
|
- return { ...state, headList, currModel, time, auth, editCompany, cameras, cameraCompany, asyncSceneCompany, user };
|
|
|
+ return {
|
|
|
+ ...state,
|
|
|
+ headList,
|
|
|
+ currModel,
|
|
|
+ time,
|
|
|
+ auth,
|
|
|
+ cameraDownload,
|
|
|
+ editCompany,
|
|
|
+ cameras,
|
|
|
+ cameraCompany,
|
|
|
+ asyncSceneCompany,
|
|
|
+ user,
|
|
|
+ };
|
|
|
},
|
|
|
methods: {
|
|
|
+ download(item) {
|
|
|
+ //查询下载进度 0未创建 1打包中 2等待下载
|
|
|
+ axios
|
|
|
+ .get(checkHasDownload + item.num, { sceneNum: item.num, isTiles: true })
|
|
|
+ .then((res) => {
|
|
|
+ console.log("type---> res :", res.data);
|
|
|
+ this.cameraDownload.data = {
|
|
|
+ type: res.data.downloadUrl ? 2 : 0,
|
|
|
+ sceneNum: item.num,
|
|
|
+ value: res.data.count,
|
|
|
+ name: item.sceneName + ".zip",
|
|
|
+ url: res.data.downloadUrl,
|
|
|
+ };
|
|
|
+ if(res.data.count == 0){
|
|
|
+ return this.$message.error("暂无剩余下载次数!", "提示");
|
|
|
+ }else{
|
|
|
+ this.cameraDownload.show = true;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
editModel(item) {
|
|
|
- window.open(process.env.VUE_APP_DOMAIN + '/epc.html?m=' + item.num + '&token=' + user.value.token)
|
|
|
+ window.open(
|
|
|
+ process.env.VUE_APP_DOMAIN +
|
|
|
+ "/epc.html?m=" +
|
|
|
+ item.num +
|
|
|
+ "&token=" +
|
|
|
+ user.value.token
|
|
|
+ );
|
|
|
},
|
|
|
+
|
|
|
shareHandle(item) {
|
|
|
- window.open(process.env.VUE_APP_DOMAIN + '/spc.html?m=' + item.num)
|
|
|
+ window.open(process.env.VUE_APP_DOMAIN + "/spc.html?m=" + item.num);
|
|
|
+ },
|
|
|
+ suspend(){
|
|
|
+ clearTimeout(this.timer)
|
|
|
+ },
|
|
|
+ downloadItemCompany() {
|
|
|
+ //查询下载进度 0未创建 1打包中 2等待下载
|
|
|
+ //查询进度
|
|
|
+ let that = this
|
|
|
+ const { type, sceneNum, url } = this.cameraDownload.data;
|
|
|
+ let download = (downloadUrl) =>{
|
|
|
+ let iframe = document.createElement('iframe')
|
|
|
+ iframe.style.display = 'none'
|
|
|
+ iframe.src = downloadUrl
|
|
|
+ document.body.appendChild(iframe);
|
|
|
+ that.cameraDownload.show = false;
|
|
|
+ }
|
|
|
+ if(type == 2){
|
|
|
+ return download(url)
|
|
|
+ }
|
|
|
+ let cameraDownloaddata = this.cameraDownload.data;
|
|
|
+ let fn = () => {
|
|
|
+ that.timer = setTimeout(() => {
|
|
|
+ callback(cameraDownloaddata);
|
|
|
+ }, 1000);
|
|
|
+ // downIngs[this.scene.num] = this.timer;
|
|
|
+ };
|
|
|
+ let callback = (item) => {
|
|
|
+ axios.get(getDownloadProcess, {
|
|
|
+ params:{
|
|
|
+ sceneNum: sceneNum,
|
|
|
+ isTiles: true,
|
|
|
+ }
|
|
|
+ }).then((res) => {
|
|
|
+ const { percent,url } = res.data
|
|
|
+ that.cameraDownload.data = {
|
|
|
+ ...cameraDownloaddata,
|
|
|
+ type:1,
|
|
|
+ value:percent
|
|
|
+ }
|
|
|
+ if(!url){
|
|
|
+ fn()
|
|
|
+ }else{ //拿到下载链接
|
|
|
+ url&&download(url)
|
|
|
+ }
|
|
|
+ console.log("type---> res :",item, res.data);
|
|
|
+ });
|
|
|
+ }
|
|
|
+ fn()
|
|
|
+ // if (type !== 2) {
|
|
|
+ // this.cameraDownload.data = {
|
|
|
+ // ...cameraDownloaddata,
|
|
|
+ // type: 1,
|
|
|
+ // value: 50,
|
|
|
+ // };
|
|
|
+ // }
|
|
|
},
|
|
|
updateCameraCompany() {
|
|
|
if (!this.cameraCompany.data) {
|
|
|
- return this.$message.error('请选择相机!', '提示')
|
|
|
+ return this.$message.error("请选择相机!", "提示");
|
|
|
}
|
|
|
- this.cameraCompany.show = false
|
|
|
- this.asyncSceneCompany = true
|
|
|
- }
|
|
|
+ this.cameraCompany.show = false;
|
|
|
+ this.asyncSceneCompany = true;
|
|
|
+ },
|
|
|
},
|
|
|
async activated() {
|
|
|
- let res = await axios.get(getCameraOptions)
|
|
|
- this.cameras = res.data.list
|
|
|
+ let res = await axios.get(getCameraOptions);
|
|
|
+ this.cameras = res.data.list;
|
|
|
},
|
|
|
components: {
|
|
|
"com-head": comHead,
|
|
|
"com-dialog": comDialog,
|
|
|
"com-company": comCompany,
|
|
|
"com-async": comAsync,
|
|
|
- "com-pagination": comPagination
|
|
|
-
|
|
|
+ "com-pagination": comPagination,
|
|
|
},
|
|
|
};
|
|
|
</script>
|
|
|
@@ -246,7 +429,7 @@ export default {
|
|
|
top: 0;
|
|
|
right: 0;
|
|
|
bottom: 0;
|
|
|
- background-color: rgba(0,0,0,0.8);
|
|
|
+ background-color: rgba(0, 0, 0, 0.8);
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
justify-content: center;
|
|
|
@@ -276,4 +459,7 @@ export default {
|
|
|
.vrmodel-from .el-select {
|
|
|
width: 100%;
|
|
|
}
|
|
|
-</style>
|
|
|
+.el-slider__button-wrapper {
|
|
|
+ top: -6px !important;
|
|
|
+}
|
|
|
+</style>
|
