Home Explore Help
Register Sign In
lianghj
/
queenshow
1
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

Merge branch 'dev' of http://124.70.149.18:10880/lianghj/queenshow into dev

lianghongjie 1 year ago
parent
ad9313b6c5 fd3f90107c
commit
f2246fbd55
11 changed files with 305 additions and 69 deletions
Split View Show Diff Stats
  1. 4 1
      .eslintrc.js
  2. 27 15
      public/index.html
  3. 2 2
      src/modules/resource/actions/promotion.tsx
  4. 0 16
      src/modules/resource/helper.ts
  5. 16 1
      src/pages/share/App.tsx
  6. 119 0
      src/pages/share/sdk.ts
  7. 19 25
      src/pages/website/Promotion2/components/PromotionItem.tsx
  8. 44 0
      src/pages/website/Promotion2/components/ShareModal.tsx
  9. 49 0
      src/pages/website/Promotion2/components/controller.tsx
  10. 14 7
      src/pages/website/Promotion2/index.tsx
  11. 11 2
      src/pages/website/index.ts

+ 4 - 1
.eslintrc.js
View File 

@@ -1,4 +1,7 @@
 
 module.exports = {
 
+  globals: {
 
+    wx: true,
 
+  },
 
   root: true,
 
   env: {
 
     node: true,
 
@@ -19,7 +22,7 @@ module.exports = {
 
     "@typescript-eslint/no-explicit-any": "off",
 
     "prettier/prettier": "off",
 
     "@typescript-eslint/no-var-requires": "off",
 
-    "@typescript-eslint/no-namespace": "off"
 
+    "@typescript-eslint/no-namespace": "off",
 
   },
 
   overrides: [
 
     {

+ 27 - 15
public/index.html
View File 

@@ -1,17 +1,29 @@
 
 <!DOCTYPE html>
 
 <html lang="">
 
-  <head>
 
-    <meta charset="utf-8">
 
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
 
-    <meta name="viewport" content="width=device-width,initial-scale=1.0">
 
-    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
 
-    <title><%= htmlWebpackPlugin.options.title %></title>
 
-  </head>
 
-  <body>
 
-    <noscript>
 
-      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
 
-    </noscript>
 
-    <div id="app"></div>
 
-    <!-- built files will be auto injected -->
 
-  </body>
 
-</html>
 
+
 
+<head>
 
+  <meta charset="utf-8">
 
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
 
+  <meta name="viewport" content="width=device-width,initial-scale=1.0">
 
+  <link rel="icon" href="<%= BASE_URL %>favicon.ico">
 
+  <title>
 
+    <%= htmlWebpackPlugin.options.title %>
 
+  </title>
 
+  <script type="text/javascript">
 
+    var userAgent = navigator.userAgent;
 
+    if (/micromessenger/i.test(userAgent)) {
 
+      document.write('<script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"><\/script>');
 
+    }
 
+  </script>
 
+</head>
 
+
 
+<body>
 
+  <noscript>
 
+    <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled.
 
+        Please enable it to continue.</strong>
 
+  </noscript>
 
+  <div id="app"></div>
 
+  <!-- built files will be auto injected -->
 
+</body>
 
+
 
+</html>

+ 2 - 2
src/modules/resource/actions/promotion.ts → src/modules/resource/actions/promotion.tsx
View File 

@@ -28,7 +28,7 @@ export const promotionAction = ResourceModule.action({
 
     });
 
     if (!title) return;
 
     const res = await this.https.createPromotion({ title });
 
-    console.log(location.host, location.host == "www.infish.cn")
 
+    console.log(location.host, location.host == "www.infish.cn");
 
     if (location.host == "www.infish.cn") {
 
       const url = `${location.origin}/projects/queenshow/editor.html#/?id=${res.result}`;
 
       location.href = url;
 
@@ -45,7 +45,7 @@ export const promotionAction = ResourceModule.action({
 
     });
 
     if (!title) return;
 
     const res = await this.https.createComp({ title });
 
-    console.log(location.host, location.host == "www.infish.cn")
 
+    console.log(location.host, location.host == "www.infish.cn");
 
     if (location.host == "www.infish.cn") {
 
       const url = `${location.origin}/projects/queenshow/editor.html#/?id=${res.result}&mode=editComp`;
 
       location.href = url;

+ 0 - 16
src/modules/resource/helper.ts
View File 

@@ -2,7 +2,6 @@ import { PageListController } from "@queenjs/controllers";
 
 import { ResourceModule } from ".";
 
 import { ComponentController } from "./controllers/ComponentController";
 
 import { MaterialController } from "./controllers/MaterialController";
 
-import { PromotionController } from "./controllers/PromotionController";
 
 
 export const helper = ResourceModule.helper({
 
   createFileName(fileName: string, dir: string) {
 
@@ -15,21 +14,6 @@ export const helper = ResourceModule.helper({
 
     )}_${fileName}`;
 
   },
 
 
-  createPromotinController() {
 
-    const ctrl= new PromotionController();
 
-    ctrl.ListCtrl = new PageListController(this.config?.httpConfig);
 
-    ctrl.ListCtrl.setCrudPrefix("/h5")
 
-    ctrl.createPromotion = this.actions.createPromotion;
 
-    ctrl.onMenuClick = async (name, record) => {
 
-      if(name == "delete") {
 
-       await this.actions.deletePromotion(record);
 
-       ctrl.ListCtrl.fresh();
 
-      }
 
-    }
 
-
 
-    return ctrl;
 
-  },
 
-
 
   createCompController() {
 
     const ctrl= new ComponentController();
 
     ctrl.ListCtrl = new PageListController(this.config?.httpConfig);

+ 16 - 1
src/pages/share/App.tsx
View File 

@@ -1,6 +1,7 @@
 
 import { initRemSize } from "@/hooks/initRemSize";
 
 import { initEditor } from "@/modules/editor";
 
-import { defineComponent } from "vue";
 
+import { defineComponent, onMounted } from "vue";
 
+import WxSdk from "./sdk";
 
 
 export const App = defineComponent(() => {
 
   const editor = initEditor();
 
@@ -12,7 +13,21 @@ export const App = defineComponent(() => {
 
 
   if (id) {
 
     editor.actions.initDesign(id);
 
+
 
+    editor.actions.on("initDesign:success", () => {
 
+      const data = editor.store.designData;
 
+      WxSdk.setShareData({
 
+        title: data.title,
 
+        link: location.href,
 
+        imgUrl: data.thumbnail || "",
 
+        desc: data.title,
 
+      });
 
+    });
 
   }
 
 
+  onMounted(() => {
 
+    WxSdk.init();
 
+  });
 
+
 
   return () => <editor.components.Preview />;
 
 });

+ 119 - 0
src/pages/share/sdk.ts
View File 

@@ -0,0 +1,119 @@
 
+/* eslint-disable */
 
+// @ts-nocheck
 
+import { Dict_Apis } from "@/dict";
 
+import axios from "axios";
 
+var signSuccess = false; //是否已经签名成功
 
+
 
+function isWeixinBrowser() {
 
+  const ua = navigator.userAgent.toLowerCase();
 
+  return /micromessenger/.test(ua) ? true : false;
 
+}
 
+
 
+const WxSdk = {
 
+  defaults: {
 
+    debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
 
+    appId: "", // 必填，公众号的唯一标识
 
+    timestamp: 0, // 必填，生成签名的时间戳
 
+    nonceStr: "", // 必填，生成签名的随机串
 
+    signature: "", // 必填，签名
 
+    jsApiList: ["updateAppMessageShareData", "updateTimelineShareData"], // 必填，需要使用的JS接口列表
 
+  },
 
+  //默认分享设置
 
+  defaultShare: {
 
+    title: "",
 
+    link: location.href,
 
+    imgUrl:
 
+      "//infishwaibao.oss-cn-chengdu.aliyuncs.com/queenshow/img/Logo.8478c1b4.png",
 
+    desc: "",
 
+  },
 
+
 
+  setConfig: function (options: any) {
 
+    const { app_id, nonce_str, signature, timestamp } = options;
 
+    this.defaults = Object.assign(this.defaults, {
 
+      appId: app_id,
 
+      timestamp: timestamp,
 
+      nonceStr: nonce_str,
 
+      signature: signature,
 
+    });
 
+  },
 
+
 
+  sign: function (url: string) {
 
+    var that = this;
 
+
 
+    //签名接口
 
+    axios(`${Dict_Apis.promotion}/wechat/share?`, {
 
+      method: "get",
 
+      params: { url },
 
+    })
 
+      .then(function (response) {
 
+        const data = response.data.result;
 
+        that.setConfig(data);
 
+        wx.config(that.defaults);
 
+        wx.ready(function () {
 
+          signSuccess = true;
 
+          that.setShare(that.defaultShare);
 
+        });
 
+        wx.error(function (res) {
 
+          console.error("error: ", res);
 
+        });
 
+      })
 
+      .catch(function (error) {
 
+        console.error(error);
 
+      });
 
+  },
 
+  init: function () {
 
+    if (isWeixinBrowser()) {
 
+      var signUrl = window.location.href;
 
+      signSuccess = false;
 
+      this.sign(signUrl);
 
+    } else {
 
+      console.error("非微信浏览器");
 
+    }
 
+  },
 
+
 
+  setShareData(shareData: {
 
+    title: string;
 
+    link: string;
 
+    imgUrl: string;
 
+    desc: string;
 
+  }) {
 
+    shareData = Object.assign({}, this.defaultShare, shareData);
 
+    this.defaultShare = shareData;
 
+  },
 
+
 
+  setShare: function (options: {
 
+    link: any;
 
+    title: any;
 
+    desc: any;
 
+    imgUrl: any;
 
+  }) {
 
+    var that = this;
 
+    options = Object.assign({}, that.defaultShare, options);
 
+
 
+    if (!signSuccess) return;
 
+
 
+    wx.updateAppMessageShareData({
 
+      title: options.title, // 分享标题
 
+      desc: options.desc, // 分享描述
 
+      link: options.link, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
 
+      imgUrl: options.imgUrl, // 分享图标
 
+      success: function () {
 
+        console.log("设置成功");
 
+      },
 
+      fail: function (msg: any) {
 
+        console.error("设置失败：" + JSON.stringify(msg));
 
+      },
 
+    });
 
+
 
+    wx.updateTimelineShareData({
 
+      title: options.title, // 分享标题
 
+      link: options.link, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
 
+      imgUrl: options.imgUrl, // 分享图标
 
+      success: function () {
 
+        console.log("设置成功");
 
+      },
 
+    });
 
+  },
 
+};
 
+
 
+export default WxSdk;

+ 19 - 25
src/pages/website/Promotion2/components/PromotionItem.tsx
View File 

@@ -15,11 +15,10 @@ const ShareBox = defineComponent({
 
   },
 
 
   setup(props) {
 
-    
-    let shareLink =
 
-      location.origin + "/share.html?id=" + props.id;
 
+    let shareLink = location.origin + "/share.html?id=" + props.id;
 
     if (location.host == "www.infish.cn") {
 
-      shareLink = location.origin + "/projects/queenshow/share.html?id=" + props.id;
 
+      shareLink =
 
+        location.origin + "/projects/queenshow/share.html?id=" + props.id;
 
     }
 
 
     const qrUrl = useQRCode(shareLink);
 
@@ -37,20 +36,22 @@ const ShareBox = defineComponent({
 
   },
 
 });
 
 
-
 
 export default defineUI({
 
   props: {
 
     record: any(),
 
   },
 
   emits: ["edit", "preview", "menu"],
 
-  setup(props, {emit}) {
 
+  setup(props, { emit }) {
 
     return () => {
 
       const { record } = props;
 
-      
+
 
       return (
 
         <div class={cx(itemStyles, "relative")}>
 
           <View ratio={1.4} class="overflow-hidden relative">
 
-            <Image class="h-1/1 w-1/1 !object-contain bg-[#ebebeb]" src={record?.thumbnail} />
 
+            <Image
 
+              class="h-1/1 w-1/1 !object-contain"
 
+              src={record?.thumbnail}
 
+            />
 
             <Tag
 
               color="#E88B00"
 
               // color="rgba(0, 0, 0, 0.4)"
 
@@ -61,28 +62,27 @@ export default defineUI({
 
             <div class="absolute inset-0 flex items-center justify-center opacity-0 hover:opacity-100 transition-opacity">
 
               <div
 
                 class="text-white icon_action w-60px leading-60px orange cursor-pointer rounded-1/2 text-center"
 
-                onClick={()=>emit("edit", props.record)}
 
+                onClick={() => emit("edit", props.record)}
 
               >
 
                 编辑
 
               </div>
 
 
               <Dropdown
 
-                overlay={<ShareBox id={record._id}/>}
 
+                overlay={<ShareBox id={record._id} />}
 
                 trigger="click"
 
-                placement="bottomCenter"
 
+                placement="bottom"
 
               >
 
                 <div class="text-white icon_action w-60px leading-60px ml-10px cursor-pointer rounded-1/2 text-center">
 
                   预览
 
                 </div>
 
               </Dropdown>
 
-            
             </div>
 
           </View>
 
           <div class="item_footer rounded-b-4px flex items-center justify-between p-15px">
 
             <div>
 
               <div class="text-white text-bold">{record.title}</div>
 
               <div class="flex items-center text-opacity-60 text-white text-12px mt-5px">
 
-                {dayjs(record.updateTime).format("YYYY.MM.DD")} 发布{" "}
 
+                {dayjs(record.updateTime).format("YYYY.MM.DD")} 发布
 
                 <Divider type="vertical"></Divider>
 
                 0次浏览
 
               </div>
 
@@ -91,21 +91,15 @@ export default defineUI({
 
               placement="bottom"
 
               overlay={
 
                 <Menu class="w-90px">
 
-                  <Menu.Item>复制</Menu.Item>
 
-                  <Menu.Item>分享</Menu.Item>
 
+                  {/* <Menu.Item>复制</Menu.Item> */}
 
+                  <Menu.Item onClick={() => emit("menu", "share")}>
 
+                    分享
 
+                  </Menu.Item>
 
                   <Menu.Item>
 
-                    <div
 
-                      onClick={() => emit("menu", "rename")}
 
-                    >
 
-                      重命名
 
-                    </div>
 
+                    <div onClick={() => emit("menu", "rename")}>重命名</div>
 
                   </Menu.Item>
 
                   <Menu.Item>
 
-                    <div
 
-                      onClick={() => emit("menu", "delete")}
 
-                    >
 
-                      删除
 
-                    </div>
 
+                    <div onClick={() => emit("menu", "delete")}>删除</div>
 
                   </Menu.Item>
 
                 </Menu>
 
               }

+ 44 - 0
src/pages/website/Promotion2/components/ShareModal.tsx
View File 

@@ -0,0 +1,44 @@
 
+import { Button, Input } from "ant-design-vue";
 
+import { defineComponent } from "vue";
 
+import { any } from "vue-types";
 
+import { Image } from "@queenjs/ui";
 
+
 
+export default defineComponent({
 
+  props: {
 
+    record: any().isRequired,
 
+  },
 
+  setup(props, { slots }) {
 
+    return () => {
 
+      const { record } = props;
 
+      return (
 
+        <div class="flex items-start">
 
+          <div>
 
+            <div class="scroll w-375px max-h-600px overflow-y-auto bg-light-50">
 
+              {slots.preview?.()}
 
+            </div>
 
+            <div class="mt-20px">
 
+              <Button type="primary" ghost>
 
+                编辑作品
 
+              </Button>
 
+            </div>
 
+          </div>
 
+          <div class="flex-1 ml-40px">
 
+            <h3>设置</h3>
 
+            <div class="flex">
 
+              <div>
 
+                <Image
 
+                  class="w-80px h-80px object-contain rounded-4px border-1px border-solid border-light-50"
 
+                  src={record.thumbnail}
 
+                />
 
+              </div>
 
+              <div class="flex-1 ml-20px">
 
+                <Input placeholder="请输入分享标题" class="w-1/1" />
 
+                <Input placeholder="请输入分享标题" class="mt-10px w-1/1" />
 
+              </div>
 
+            </div>
 
+          </div>
 
+        </div>
 
+      );
 
+    };
 
+  },
 
+});

+ 49 - 0
src/pages/website/Promotion2/components/controller.tsx
View File 

@@ -0,0 +1,49 @@
 
+import { EditorModule } from "@/modules/editor/module";
 
+import { ResourceModule } from "@/modules/resource";
 
+import { PromotionController } from "@/modules/resource/controllers/PromotionController";
 
+import { PageListController } from "@queenjs/controllers";
 
+import ShareModal from "./ShareModal";
 
+
 
+export function createPromotinController(
 
+  resource: ResourceModule,
 
+  editor: EditorModule
 
+) {
 
+  const ctrl = new PromotionController();
 
+
 
+  ctrl.ListCtrl = new PageListController(resource.config?.httpConfig);
 
+  ctrl.ListCtrl.setCrudPrefix("/h5");
 
+  ctrl.createPromotion = resource.actions.createPromotion;
 
+
 
+  async function sharePromotion(record: any) {
 
+    editor.actions.initDesign(record._id);
 
+    editor.actions.switchMode("preview");
 
+    resource.showModal(
 
+      <ShareModal record={record}>
 
+        {{
 
+          preview: () => <editor.components.Preview />,
 
+        }}
 
+      </ShareModal>,
 
+      {
 
+        title: "分享设置",
 
+        width: "1000px",
 
+      }
 
+    );
 
+  }
 
+
 
+  ctrl.onMenuClick = async (name, record) => {
 
+    switch (name) {
 
+      case "delete":
 
+        await resource.actions.deletePromotion(record);
 
+        ctrl.ListCtrl.fresh();
 
+        break;
 
+      case "rename":
 
+        await resource.actions.renamePromotion(record);
 
+        break;
 
+      case "share":
 
+        sharePromotion(record);
 
+        break;
 
+    }
 
+  };
 
+
 
+  return ctrl;
 
+}

+ 14 - 7
src/pages/website/Promotion2/index.tsx
View File 

@@ -1,19 +1,26 @@
 
+import { useEditor } from "@/modules/editor";
 
 import { useResource } from "@/modules/resource";
 
 import { defineComponent } from "vue";
 
-
 
 import PromotionUI from "./components";
 
+import { createPromotinController } from "./components/controller";
 
+
 
 export default defineComponent({
 
   setup() {
 
     const resource = useResource();
 
-    const ctrl = resource.helper.createPromotinController();
 
+    const editor = useEditor();
 
+
 
+    const ctrl = createPromotinController(resource, editor);
 
+
 
     return () => (
 
       <PromotionUI
 
         Controller={ctrl}
 
-        slots={{
 
-          // MaterialItem: ()=>{
 
-          //   return <div>item</div>
 
-          // }
 
-        }}
 
+        slots={
 
+          {
 
+            // MaterialItem: ()=>{
 
+            //   return <div>item</div>
 
+            // }
 
+          }
 
+        }
 
       ></PromotionUI>
 
     );
 
   },

+ 11 - 2
src/pages/website/index.ts
View File 

@@ -1,7 +1,16 @@
 
 import { startApp } from "@/App";
 
 import { initAuthDef } from "@/hooks/initAuthDef";
 
+import { initRemSize } from "@/hooks/initRemSize";
 
+import { initEditor } from "@/modules/editor";
 
 import { initResource } from "@/modules/resource";
 
+import CKEditor from "@ckeditor/ckeditor5-vue";
 
 import router from "./router";
 
 
-document.title = "推广编辑器"
 
-startApp(router, [initAuthDef, initResource]);
 
+document.title = "推广编辑器";
 
+startApp(
 
+  router,
 
+  [initAuthDef, initRemSize, initResource, initEditor],
 
+  (app) => {
 
+    app.use(CKEditor);
 
+  }
 
+);