solve_conflict

src/http.ts

@@ -38,7 +38,10 @@ axios.interceptors.response.use(
       return;
     }
     if (error && error.response) {
-      if (error.response.config.url === '/api/account/profile') {
+      if (
+        error.response.config.url === '/api/account/profile' ||
+        error.response.data.error === '此为付费数据，请购买后访问'
+      ) {
         return;
       }
 

src/styles/tdesign.css

@@ -594,3 +594,7 @@
   min-height: 40px;
   font-size: 14px;
 }
+
+.t-image__wrapper {
+  background: none;
+}

src/views/components/ChargeCloudPublish.vue

@@ -72,6 +72,7 @@ const wechatPayDialog = reactive({
 onBeforeMount(async () => {
   const ret: { list: any } = await axios.post('/api/goods/list', {
     type: '云发布',
+    sort: { createdAt: 1 },
   });
   data.vips = ret.list;
 });
@@ -93,7 +94,7 @@ const onSuccess = (success: boolean) => {
 };
 
 const getPayResult = async () => {
-  const result: { state: number } = await axios.post('/order/pay/state', {
+  const result: { state: number } = await axios.post('/api/order/pay/state', {
     id: data.order.id || data.order._id,
   });
   if (result && result.state) {

src/views/components/Graphics.vue

@@ -77,9 +77,7 @@
                 v-for="elem in item.list"
                 :draggable="true"
                 @dragstart="dragStart($event, elem)"
-                @drag="drag($event, elem)"
-                @dragend="dragEnd()"
-                @click.stop="dragStart($event, elem)"
+                @click.prevent="dragStart($event, elem)"
                 @dblclick.stop="open(elem)"
                 @contextmenu="onContextMenu($event, item, elem)"
               >
@@ -114,8 +112,6 @@
             v-for="elem in subGroups"
             :draggable="true"
             @dragstart="dragStart($event, elem)"
-            @drag="drag($event, elem)"
-            @dragend="dragEnd()"
             @click.stop="dragStart($event, elem)"
             @dblclick.stop="open(elem)"
           >
@@ -182,19 +178,60 @@
     >
       确定删除该数据吗？删除后不可恢复！
     </t-dialog>
+    <t-dialog
+      v-if="chargeDialog.show"
+      :header="chargeDialog.data.name"
+      :visible="true"
+      @close="chargeDialog.show = false"
+      width="70%"
+      :top="8"
+    >
+      <t-image :src="chargeDialog.data.image" />
+      <template #footer>
+        <div class="flex between" style="margin-top: -7px">
+          <p>付费项目，购买后查看并使用</p>
+          <div>
+            <label>金额：</label>
+            <label class="bland">￥{{ chargeDialog.data.price }}</label>
+            <t-button class="primary ml-12" @click="onSubmitOrder"
+              >购买</t-button
+            >
+          </div>
+        </div>
+      </template>
+    </t-dialog>
+
+    <t-dialog
+      v-if="wechatPayDialog.show"
+      v-model:visible="wechatPayDialog.show"
+      class="pay-dialog"
+      header="乐吾乐收银台"
+      :close-on-overlay-click="false"
+      :top="95"
+      :width="700"
+      confirm-btn="支付完成"
+      :cancel-btn="null"
+      @close="getPayResult"
+    >
+      <WechatPay
+        :order="wechatPayDialog.order"
+        :code-url="wechatPayDialog.order.codeUrl"
+        @success="onChargeSuccess"
+      />
+    </t-dialog>
   </div>
 </template>
 
 <script lang="ts" setup>
 import { onMounted, onUnmounted, reactive, ref } from 'vue';
 import { useRouter } from 'vue-router';
+import { MessagePlugin } from 'tdesign-vue-next';
 import axios from 'axios';
 
 import { cases, shapes, formComponents } from '@/services/defaults';
 import { charts } from '@/services/echarts';
 import { getFolders, getFiles, getIcons } from '@/services/png';
 import {
-  getComponents,
   getComponentsList,
   getLe5leV,
   updateCollection,
@@ -204,7 +241,8 @@ import { convertPen } from '@/services/upgrade';
 import { deepClone } from '@meta2d/core';
 import { isGif } from '@/services/utils';
 import { autoSave, delAttrs } from '@/services/common';
-import { MessagePlugin } from 'tdesign-vue-next';
+
+import WechatPay from './WechatPay.vue';
 
 const router = useRouter();
 
@@ -263,6 +301,12 @@ const materials = ref([]);
 const pngs = ref([]);
 const icons = ref([]);
 
+let dropped = false;
+const chargeDialog = reactive<any>({});
+const wechatPayDialog = reactive<any>({
+  show: false,
+});
+
 const groupChange = async (name: string) => {
   activedPanel.value = [];
   activedGroup.value = name;
@@ -335,7 +379,7 @@ const getCaseProjects = async (name: string, group?: string) => {
     {
       query,
       shared: 'true',
-      projection: { _id: 1, name: 1, image: 1, price: 1 },
+      projection: { id: 1, _id: 1, name: 1, image: 1, price: 1 },
     }
   );
 
@@ -343,6 +387,9 @@ const getCaseProjects = async (name: string, group?: string) => {
     return [];
   }
   for (const item of ret.list) {
+    if (!item.id) {
+      item.id = item._id;
+    }
     item.draggable = false;
   }
   return ret.list;
@@ -396,15 +443,19 @@ const getPrivateGroups = async () => {
 
 const dragStart = async (event: DragEvent | MouseEvent, item: any) => {
   event.stopPropagation();
-
-  let data = null;
-
-  if (!item || (event instanceof DragEvent && !event.dataTransfer)) {
+  if (!item) {
     return;
   }
 
-  if (!item.draggable) {
-    data = item.data;
+  meta2d.canvas.addCaches = [];
+  dropped = false;
+
+  let data = null;
+  const id = item._id || item.id;
+  let isAsync: boolean;
+  if (item.draggable === false) {
+    // 场景
+    data = item.data || item;
   } else if (item['3d']) {
     // data = {
     //   name: 'iframe',
@@ -414,6 +465,7 @@ const dragStart = async (event: DragEvent | MouseEvent, item: any) => {
     //   iframe: 'https://view3d.le5le.com/?id=' + (item._id || item.id),
     // };
     //获取3d数据
+    //获取3d数据
     if (!item.data) {
       let ret = await getLe5le3d(item._id || item.id);
       item.data = ret.data;
@@ -426,57 +478,61 @@ const dragStart = async (event: DragEvent | MouseEvent, item: any) => {
       data: item.data,
       //3d场景的其他信息
     };
-  } else {
-    if (item._id && !item.componentDatas) {
-      let res: any = await getComponents(item._id);
-      item.component = true;
-      item.componentDatas = res.componentDatas;
-      item.componentData = res.componentData;
+  } else if (item.component) {
+    // 我的组件
+    if (!item.componentDatas && !item.componentData) {
+      isAsync = true;
+      const ret: any = await axios.post(`/api/data/le5leV-components/get`, {
+        id,
+      });
+      item.componentDatas = ret.componentDatas;
+      item.componentData = ret.componentData;
     }
-    if (!item.data && !item.component && item.image) {
-      let target: any = event.target;
-      target.children[0] && (target = target.children[0].children[0]);
-      // firefox naturalWidth svg 图片 可能是 0
-      const normalWidth = target.naturalWidth || target.width;
-      const normalHeight = target.naturalHeight || target.height;
-      const [name, lockedOnCombine] = isGif(item.image)
-        ? ['gif', 0]
-        : ['image', undefined];
-
-      data = {
-        name,
-        width: 100,
-        height: 100 * (normalHeight / normalWidth),
-        image: item.image,
-        imageRatio: true,
-        lockedOnCombine,
-      };
-    } else if (item.component) {
-      if (item.componentData) {
-        const pens = convertPen([item.componentData]);
-        data = deepClone(pens);
-      } else if (item.componentDatas) {
-        data = deepClone(item.componentDatas);
-      }
-    } else {
-      data = item.componentDatas || item.data;
+    if (item.componentData) {
+      const pens = convertPen([item.componentData]);
+      data = deepClone(pens);
+    } else if (item.componentDatas) {
+      data = deepClone(item.componentDatas);
     }
-  }
+  } else if (item.data) {
+    // 普通图元
+    data = item.data;
+  } else if (item.image) {
+    // 拖拽图片
+    let target: any = event.target;
+    target.children[0] && (target = target.children[0].children[0]);
+    // firefox naturalWidth svg 图片 可能是 0
+    const normalWidth = target.naturalWidth || target.width;
+    const normalHeight = target.naturalHeight || target.height;
+    const [name, lockedOnCombine] = isGif(item.image)
+      ? ['gif', 0]
+      : ['image', undefined];
 
-  if (event instanceof DragEvent) {
-    meta2d.canvas.addCaches = [];
-    event.dataTransfer?.setData('Meta2d', JSON.stringify(data));
+    data = {
+      name,
+      width: 100,
+      height: 100 * (normalHeight / normalWidth),
+      image: item.image,
+      imageRatio: true,
+      lockedOnCombine,
+    };
   } else {
-    if (!Array.isArray(data)) {
-      data = deepClone([data]);
-    }
-    meta2d.canvas.addCaches = data;
+    return;
+  }
+
+  if (!Array.isArray(data)) {
+    data = deepClone([data]);
   }
-};
 
-const drag = (event: DragEvent, item: any) => {};
+  !dropped && (meta2d.canvas.addCaches = data);
 
-const dragEnd = () => {};
+  if (event instanceof DragEvent) {
+    event.dataTransfer.setData(
+      'Meta2d',
+      isAsync ? undefined : JSON.stringify(data)
+    );
+  }
+};
 
 const dragstart = (event: any) => {
   event.target.style.opacity = 0.5;
@@ -487,9 +543,19 @@ const dragend = (event: any) => {
 };
 
 const open = async (item: any) => {
-  if (item.draggable !== false) {
+  if (!item || item.draggable !== false) {
+    return;
+  }
+
+  const ret: any = await getLe5leV(item._id || item.id);
+  if (!ret) {
+    if (item.price > 0) {
+      chargeDialog.data = item;
+      chargeDialog.show = true;
+    }
     return;
   }
+
   router.push({
     path: '/',
     query: {
@@ -497,12 +563,12 @@ const open = async (item: any) => {
     },
   });
 
-  const ret: any = await getLe5leV(item._id || item.id);
   for (const k of delAttrs) {
-    delete (ret as any)[k];
+    delete ret[k];
   }
+
+  autoSave();
   meta2d.open(ret);
-  autoSave(true);
 };
 
 const onChangeGroupPanel = async (val: string[]) => {
@@ -838,13 +904,49 @@ const delComponet = async () => {
   delDialog.show = false;
 };
 
+const drop = (obj: any) => {
+  dropped = true;
+
+  if (obj) {
+    Array.isArray(obj) && open(obj[0]);
+  } else {
+    MessagePlugin.warning('正在请求网络数据中，请稍后重试');
+  }
+};
+
+const onSubmitOrder = async () => {
+  const result: any = await axios.post('/api/order/datas/submit', {
+    collection: 'le5leV',
+    id: chargeDialog.data._id,
+  });
+  if (result) {
+    wechatPayDialog.order = result;
+    wechatPayDialog.show = true;
+  }
+};
+
+const getPayResult = async () => {
+  const result: { state: number } = await axios.post('/api/order/pay/state', {
+    id: wechatPayDialog.order.id || wechatPayDialog.order._id,
+  });
+  if (result && result.state) {
+    return true;
+  }
+};
+
+const onChargeSuccess = () => {
+  MessagePlugin.success('支付成功！');
+  wechatPayDialog.show = false;
+  chargeDialog.show = false;
+};
+
 onMounted(() => {
   groupChange('场景');
   document.addEventListener('dragstart', dragstart, false);
   document.addEventListener('dragend', dragend, false);
 
   setTimeout(() => {
-    meta2d.on('drop', open);
+    meta2d.on('drop', drop);
   }, 2000);
 });
 
@@ -852,7 +954,7 @@ onUnmounted(() => {
   document.removeEventListener('dragstart', dragstart);
   document.removeEventListener('dragend', dragend);
 
-  meta2d.off('drop', open);
+  meta2d.off('drop', drop);
 });
 </script>
 <style lang="postcss" scoped>

src/views/components/Network.vue

@@ -123,7 +123,7 @@
 
 <script lang="ts" setup>
 import { onBeforeMount, ref } from 'vue';
-
+import axios from 'axios';
 import { debounce } from '@/services/debouce';
 
 const { modelValue, mode } = defineProps<{
@@ -167,12 +167,19 @@ const httpMethodChange = (method: string) => {
   }
 };
 
-const onSave = () => {
+const onSave = async () => {
   emit('update:modelValue', modelValue);
   emit('change', modelValue);
 
+  const id = modelValue._id || modelValue.id;
+
   // 保存到我的数据源
-  // todo
+  if (id) {
+    modelValue._id = id;
+    await axios.post(`/api/data/datasources/update`, modelValue);
+  } else {
+    await axios.post(`/api/data/datasources/add`, modelValue);
+  }
 };
 
 const onInput = (text: string) => {
@@ -181,10 +188,15 @@ const onInput = (text: string) => {
 
 // 请求我的数据源接口
 const getNetworks = async () => {
-  // const ret: any = await axios.get(`/api/xxx`);
-  // if (ret) {
-  //   dataDialog.networkList = ret.list
-  // }
+  const ret: any = await axios.post(`/api/data/datasources/list`, {
+    q: {
+      name: modelValue.name,
+    },
+    projection: { updatedAt: 0 },
+  });
+  if (ret) {
+    networkList.value = ret.list;
+  }
 };
 
 const onSelect = (item: any) => {