9 lines
14 KiB
JavaScript
Raw Normal View History

2025-06-30 09:38:03 +08:00
import{_ as L,i as X,r as a,j as V,o as d,d as g,w as c,k as U,c as _,m as O,f as o,b as n,l as m,t as b,p as P,q as Y,s as Z,u as x,v as N,x as ee,y as te,z as se,A as oe,B as le,C as ne,a as D,F as z,n as E}from"./index-f87df9cc.js";const ie={data(){return{url:"",loading:!1,visible:!1,item:{}}},methods:{handleOpen(t={}){this.item=t,this.visible=!0,this.url=location.origin+"/view.html?id="+this.item.id},handleContent(){location.href="/index.zip"},handleExport(){this.loading=!0,X(this.item.id).then(t=>{const e=t.data.data;let r={detail:JSON.parse(e.config.detail),component:JSON.parse(e.config.component)};const h=new Blob([`//将大屏配置文件view.js 放入部署容器根目录
const option =${JSON.stringify(r,null,4)}`],{type:"text/plain;charset=utf-8"});saveAs(h,"view.js"),this.loading=!1,this.$message.success("大屏导出成功")}).catch(t=>{console.log(t),this.$message.error("大屏导出失败"),this.loading=!1})}}},ae={class:"item"},ce=o("div",{class:"header"}," 第一步:下载部署容器(必须) ",-1),re={class:"content"},de={style:{width:"100%"}},he=o("p",null,"下载部署容器。配置 Nginx参考如下",-1),ue={style:{width:"100%"}},pe=o("pre",null,[o("code",null,`
location / {
root /;
index index.html;
try_files $uri $uri/ /index.html;
}
`),m()],-1),_e=[pe],ge={class:"item"},me=o("div",{class:"header"}," 第二步:下载大屏配置文件 ",-1),fe={class:"content"},be={style:{width:"100%"}},ve=o("p",null,"1.【本地文件】下载大屏配置文件。将大屏配置文件view.js 放入部署容器根目录。",-1),ye={class:"item"},we=o("div",{class:"header"}," iframe嵌入 ",-1),ke={class:"content"},Ce=["href"];function xe(t,e,r,h,s,i){const f=a("el-button"),u=a("el-dialog"),v=V("highlight"),k=V("loading");return d(),g(u,{title:`${s.item.title}打包部署`,modelValue:s.visible,"onUpdate:modelValue":e[0]||(e[0]=y=>s.visible=y),"close-on-click-modal":!1,class:"avue-dialog",width:"50%"},{default:c(()=>[U((d(),_("div",O({class:"avue-tip"},t.$loadingParams),[o("div",ae,[ce,o("div",re,[o("div",de,[n(f,{type:"primary",icon:"el-icon-suitcase",onClick:i.handleContent},{default:c(()=>[m("下载容器")]),_:1},8,["onClick"])]),he,o("div",ue,[U((d(),_("p",null,_e)),[[v]])])])]),o("div",ge,[me,o("div",fe,[o("div",be,[n(f,{type:"primary",icon:"el-icon-download",onClick:i.handleExport},{default:c(()=>[m("下载大屏配置文件")]),_:1},8,["onClick"])]),ve,o("p",null,"2.【云端加载】无需下载大屏配置文件访问第一步下载的容器中index.html文件,url中带大屏参数/index.html?id="+b(s.item.id),1)])]),o("div",ye,[we,o("div",ke,[o("p",null,[m("嵌入地址:"),o("a",{href:s.url,target:"_blank"},b(s.url),9,Ce)])])])],16)),[[k,s.loading]])]),_:1},8,["title","modelValue"])}const Ve=L(ie,[["render",xe]]),Ue={props:{category:String},data(){return{loading:!1,box:!1}},methods:{uploadFile(t){this.loading=!0;const e=new FileReader;e.readAsText(t.raw,"UTF-8"),e.onload=r=>{const h=r.target.result;let s=JSON.parse(h)||{},i=s.detail,f=s.component;if(!s.detail){this.loading=!1,this.$message.error("导入文件格式错误");return}let u={category:this.category,title:i.name,name:i.name,width:i.width,height:i.height,component:JSON.stringify(f)};P(u).then(v=>{this.loading=!1;let y=v.data.data.id;this.$message.success("导入成功"),this.box=!1,setTimeout(()=>{let C=this.$router.resolve({path:"/build/"+y});window.open(C.href,"_blank")},300)}).catch(()=>{this.loading=!1})}}}},Se=o("div",{class:"el-upload__text"},[m("将文件拖到此处,或"),o("em",null,"点击上传")],-1);function Te(t,e,r,h,s,i){const f=a("el-icon-upload"),u=a("el-icon"),v=a("el-upload"),k=a("el-dialog"),y=V("loading");return d(),g(k,{title:"导入大屏",width:"30%",class:"avue-dialog","close-on-click-modal":!1,modelValue:s.box,"onUpdate:modelValue":e[0]||(e[0]=C=>s.box=C)},{default:c(()=>[U((d(),_("div",Y(Z(t.$loadingParams)),[s.box?(d(),g(v,{key:0,drag:"",action:"#","show-file-list":!1,"auto-upload":!1,"on-change":i.uploadFile},{default:c(()=>[n(u,null,{default:c(()=>[n(f)]),_:1}),Se]),_:1},8,["on-change"])):x("",!0)],16)),[[y,s.loading]])]),_:1},8,["modelValue"])}const Ne=L(Ue,[["render",Te]]),De={name:"list",components:{exportTip:Ve,importTip:Ne},data(){return{search:{},screenList:[{label:"Desktop(默认)",width:1920,height:1080,icon:"desktop"},{label:"MacBook pro",width:1440,height:900,icon:"mac"},{label:"iPad pro",width:1366,height:1024,icon:"pad"},{label:"手机 Max",width:430,height:932,icon:"phone"},{label:"自定义",width:"-",height:"-",icon:"slot"}],loading1:!1,loading:!1,index:-1,height:0,typeList:[],box:!1,url:N,addColumn:[{label:"分组",prop:"category",span:24,type:"select",dicUrl:N+"/category/list",props:{label:"categoryKey",value:"categoryValue"},rules:[{required:!0,message:"请选择分组",trigger:"blur"}]},{label:"大屏名称",span:24,prop:"title",rules:[{required:!0,message:"请输入大屏名称",trigger:"blur"}]},{label:"密码",span:24,type:"password",labelWidth:100,prop:"password"},{label:"大屏尺寸",span:24,prop:"screen"},{label:"",span:14,prop:"width",display:!1,placeholder:"请输入宽度",rules:[{required:!0,message:"请输入宽度",trigger:"blur"}]},{label:"",span:10,labelWidth:1,display:!1,prop:"height",placeholder:"请输入高度",rules:[{required:!0,message:"请输入高度",trigger:"blur"}]},{label:"缩略图",span:24,pro