Bladeren bron

Merge branch 'newApi' of https://github.com/le5le-com/visualization-design into newApi

Wind-Breaker1 1 jaar geleden
bovenliggende
commit
37a2447f8b
1 gewijzigde bestanden met toevoegingen van 163 en 9 verwijderingen
  1. 163 9
      src/views/components/Header.vue

+ 163 - 9
src/views/components/Header.vue

@@ -599,6 +599,63 @@
        <p>{{ data.deploy.price+(data.payDiagram.checked?data.payDiagram.price:0) }}</p>
      </div>
    </div>
+</t-dialog>
+<t-dialog
+    v-if="downloadZipDialog.show"
+    v-model:visible="downloadZipDialog.show"
+    class="pay-dialog"
+    :close-on-overlay-click="false"
+    :top="95"
+    :width="700"
+    :cancel-btn="null" 
+    :confirm-btn="downloadZipDialog.checked?'去支付(不支持退款)':'直接下载'"
+    @close="downloadZipDialog.show = false"
+    @confirm="prePayDownloadZip"
+  >
+  <template #header>
+        <div>
+          <span style="vertical-align: middle">导出为Zip文件</span>
+          <t-tooltip  content="这是Tooltip内容">
+            <HelpCircleIcon style="margin-left:12px;" />
+        </t-tooltip>
+        </div>
+   </template>
+   <div style="margin:12px 0px;">
+    Zip包仅包含数据文件和图片文件,不包含js等依赖库。
+【注意】Zip包用于平台(已包含js等依赖库)的快捷导入导出项目,无法作为独立部署包使用。
+   <p v-if="downloadZipDialog.hasJs" style="font-weight:bold;">
+      当前图纸包含js企业图形依赖库。
+      项目中打开如果没有js企业图形依赖库,对应的图元将无法显示。
+      推荐下载为离线部署包(包含js企业图形依赖库)。
+  </p>
+   </div>
+   <div class="pay-box pay-diagram">
+    <div class="pay-up">
+     <div class="pay-title">
+      <t-checkbox v-model="downloadZipDialog.checked"> 企业图形库  
+      
+    </t-checkbox>
+    <ChevronDownIcon @click="downloadZipDialog.expend=false" v-if="downloadZipDialog.expend" />
+      <ChevronRightIcon @click="downloadZipDialog.expend=true" v-else />
+     </div>
+     <div class="pay-price">
+       <p>¥</p>
+       <p>{{ downloadZipDialog.price }}</p>
+     </div>
+    </div>
+    <div v-if="downloadZipDialog.expend" class="pay-down">
+        <div v-for="item in downloadZipDialog.list">
+          <img :src="item" />
+        </div>
+    </div>
+   </div>
+   <div class="pay-footer">
+    合计
+    <div>
+       <p>¥</p>
+       <p>{{downloadZipDialog.checked? downloadZipDialog.price:0 }}</p>
+     </div>
+   </div>
 </t-dialog>
   <t-dialog
     v-if="wechatPayDialog.show"
@@ -721,7 +778,7 @@ const data = reactive<any>({
     expend:false,
     list:[]
   },
-  payGoods:{}
+  payGoods:{},
 });
 
 onBeforeMount(async () => {
@@ -1067,11 +1124,17 @@ const downloadZip = async () => {
   //   // gotoAccount();
   //   return;
   // }
-  if (!user.vip) {
-    MessagePlugin.info('需要开通普通会员~');
-    gotoAccount();
+  // if (!user.vip) {
+  //   MessagePlugin.info('需要开通普通会员~');
+  //   gotoAccount();
+  //   return;
+  // }
+  if(!meta2d.store.data.pens.length){
+    MessagePlugin.info('画布没有画笔!');
     return;
   }
+  preDownloadZip();
+  return;
   MessagePlugin.info('正在下载打包中,可能需要几分钟,请耐心等待...');
   const [{ default: JSZip }, { saveAs }] = await Promise.all([
     import('jszip'),
@@ -1098,6 +1161,77 @@ const downloadZip = async () => {
   saveAs(blob, `${_fileName}.zip`);
 };
 
+const preDownloadZip =async () =>{
+  const meta2dData = meta2d.data();
+  let payList = getPayList(meta2dData);
+  let purchased =await getComponentPurchased({
+    pngs: payList.pngs,
+    jsPens: [],
+    iotPens: [],
+    svgPens: [],
+  });
+  downloadZipDialog.checked = true;
+  console.log("payList",payList);
+  if(payList.jsPens.length||payList.iotPens.length||payList.svgPens.length){
+    downloadZipDialog.hasJs = true;
+  }else{
+    downloadZipDialog.hasJs = false;
+  }
+  let names = purchased.map((item) => item.name);
+  data.goods = await getGoods();
+  let list =  payList.pngs.filter((item) => !names.includes(item));
+  if(!list.length){
+    doDownloadZip();
+  }else{
+    let unitPrice = data.goods.find((item)=>item.type==='图片图元').unitPrice; 
+    downloadZipDialog.price = unitPrice*list.length;
+    downloadZipDialog.show = true;
+    downloadZipDialog.list = list;
+  }
+}
+
+const prePayDownloadZip = async ()=>{
+  if(downloadZipDialog.checked){
+    const res: any = await axios.post('/api/order/deployment/submit', {
+     goods:{},
+    '2ds':downloadZipDialog.list.map((item)=>{return { type: '图片图元', name: item}}),
+    });
+    wechatPayDialog.show = true;
+    wechatPayDialog.isZip = true;
+    data.order = res;
+  }else {
+    doDownloadZip();
+    downloadZipDialog.show = false;
+  }
+}
+
+const doDownloadZip = async ()=>{
+  MessagePlugin.info('正在下载打包中,可能需要几分钟,请耐心等待...');
+  const [{ default: JSZip }, { saveAs }] = await Promise.all([
+    import('jszip'),
+    import('file-saver'),
+  ]);
+
+  const zip: any = new JSZip();
+  const data: Meta2dBackData = meta2d.data();
+  let _fileName =
+    (data.name && data.name.replace(/\//g, '_').replace(/:/g, '_')) ||
+    'le5le.meta2d';
+  const _zip = zip.folder(`${_fileName}`);
+  if (data._id) delete data._id;
+  if (data.id) delete data.id;
+  checkData(data);
+  _zip.file(
+    `${_fileName}.json`,
+    JSON.stringify(data).replaceAll(cdn, '').replaceAll(upCdn, '')
+  );
+  await zipBkImg(_zip);
+  await zipImages(_zip, meta2d.store.data.pens);
+
+  const blob = await zip.generateAsync({ type: 'blob' });
+  saveAs(blob, `${_fileName}.zip`);
+}
+
 // const zip3D = (name: string) => {
 //   const pen_3d = meta2d.store.data.pens.filter(
 //     (pen) =>
@@ -1169,6 +1303,10 @@ const downloadHtml = async () => {
 const preGetPayList = async () => {
   //图形库需要购买
   const meta2dData = meta2d.data();
+  if(!meta2dData.pens.length){
+    MessagePlugin.info('画布没有画笔!');
+    return;
+  }
   let list = getPayList(meta2dData);
   prePayList.pngs = new Set(list.pngs);
   prePayList.jsPens = new Set(list.jsPens);
@@ -1812,11 +1950,11 @@ async function downloadAsFrame(type: Frame) {
     MessagePlugin.warning(noLoginTip);
     return;
   }
-  if (user.vipDesc !== '旗舰会员') {
-    MessagePlugin.info('需要开通旗舰会员~');
-    gotoAccount();
-    return;
-  }
+  // if (user.vipDesc !== '旗舰会员') {
+  //   MessagePlugin.info('需要开通旗舰会员~');
+  //   gotoAccount();
+  //   return;
+  // }
   downloadType = type;
   await preGetPayList();
 }
@@ -2323,6 +2461,15 @@ const payListDialog = reactive({
   title:''
 });
 
+const downloadZipDialog = reactive({
+  show: false,
+  checked:true,
+  expend:false,
+  price:0,
+  list:[],
+  hasJs:false,
+});
+
 const prePay = async () => {
   let list = [];
   if(data.payDiagram.checked){
@@ -2388,6 +2535,11 @@ const finishPay = async () => {
   if (result && result.state) {
     MessagePlugin.success('支付成功');
     wechatPayDialog.show = false;
+    if(wechatPayDialog.isZip){
+      downloadZipDialog.show = false;
+      wechatPayDialog.isZip = false;
+      doDownloadZip();
+    }else{
     payListDialog.show = false;
     MessagePlugin.info('正在下载打包中,可能需要几分钟,请耐心等待...');
     if (downloadType === Frame.html) {
@@ -2395,6 +2547,7 @@ const finishPay = async () => {
     } else {
       preFrameDownload();
     }
+  }
   } else {
     MessagePlugin.error('支付失败');
     // wechatPayDialog.show = false;
@@ -2418,6 +2571,7 @@ const finalPrice = computed(() => {
 
 const wechatPayDialog = reactive({
   show: false,
+  isZip:false
 });
 
 const emit = defineEmits(['success']);