Browse Source

落地页

xia 4 years ago
parent
commit
b347d31a7a

+ 91 - 47
src/api/index.ts

@@ -1,4 +1,4 @@
-import {AxiosPromise} from "axios";
+import { AxiosPromise } from "axios";
 import axios from "./config";
 
 // NOTE: 暂时使用ts-ignore忽略module not exported的问题
@@ -46,7 +46,7 @@ export const getDeliveryBookList = (
     official_name: string;
     book_name: string;
     page: number;
-  }> = {page: 1}
+  }> = { page: 1 }
 ): AxiosPromise<IList<IDeliveryBook>> => {
   return axios("/getUserDeliveryBooks", {
     params: query,
@@ -69,7 +69,7 @@ export const getBooksByName = (
   key_word: string,
   page = 1
 ): AxiosPromise<IList<IBookSearchResult>> => {
-  return axios("/searchBooks", {params: {key_word, page}});
+  return axios("/searchBooks", { params: { key_word, page } });
 };
 
 /**
@@ -82,9 +82,9 @@ export const getAdPushList = (
     account_id: string;
     advertiser_id: string;
     page: number;
-  }> = {page: 1}
+  }> = { page: 1 }
 ): AxiosPromise<IList<ADpushSimple>> => {
-  return axios("/ad/userAdAdvertisers", {params: query});
+  return axios("/ad/userAdAdvertisers", { params: query });
 };
 
 /**
@@ -96,7 +96,7 @@ export const getOfficialAccounts = (query: {
   platform: string;
   page: number;
 }): AxiosPromise<IList<IOfficials>> => {
-  return axios("/userOfficialAccounts", {params: query});
+  return axios("/userOfficialAccounts", { params: query });
 };
 
 /**
@@ -113,9 +113,9 @@ export const getADPlanlist = (
     end_date: any;
     cost_order: number;
     page: number;
-  }> = {page: 1}
+  }> = { page: 1 }
 ): AxiosPromise<IList<ADPlanItem>> => {
-  return axios("/ad/adData", {params: query});
+  return axios("/ad/adData", { params: query });
 };
 
 /**
@@ -129,9 +129,9 @@ export const getDeliveryStatList = (
     book_name: string;
     page: number;
     day_num: number;
-  }> = {page: 1}
+  }> = { page: 1 }
 ): AxiosPromise<any> => {
-  return axios("/delivery/stat", {params: query});
+  return axios("/delivery/stat", { params: query });
 };
 
 /*
@@ -165,7 +165,7 @@ export const logout = () => {
  * @param id 记录id
  */
 export const onStopDeliveryBook = (id: number) => {
-  return axios("/stopDeliveryBook", {params: {id}});
+  return axios("/stopDeliveryBook", { params: { id } });
 };
 
 /**
@@ -187,9 +187,9 @@ export const getDeliveryMoreStatList = (
     official_name: string;
     book_name: string;
     page: number;
-  }> = {page: 1}
+  }> = { page: 1 }
 ): AxiosPromise<IList<any>> => {
-  return axios("/delivery/moreStat", {params: query});
+  return axios("/delivery/moreStat", { params: query });
 };
 
 /* 广告授权
@@ -238,9 +238,9 @@ export const opertaroLog = (
     end_time: string;
     page: number;
     ad_id: string;
-  }> = {page: 1}
+  }> = { page: 1 }
 ): AxiosPromise<IList<adPlanLog>> => {
-  return axios("/ad/adOptLogs", {params: query});
+  return axios("/ad/adOptLogs", { params: query });
 };
 
 /* 获取广告状态
@@ -257,7 +257,7 @@ export const getAdplanTable = (query: {
   desc: string;
   name: string;
 }>> => {
-  return axios("/ad/adStatFields", {params: query});
+  return axios("/ad/adStatFields", { params: query });
 };
 
 //广告计划字段
@@ -268,7 +268,7 @@ export const getAdplanData = (query: {
   ids: string;
   page: number;
 }): AxiosPromise<any> => {
-  return axios("/ad/adStats", {params: query});
+  return axios("/ad/adStats", { params: query });
 };
 
 //获取计划的回传配置
@@ -276,7 +276,7 @@ export const getAdBackPlan = (query: {
   ad_lid: string;
   back_platform: string;
 }): AxiosPromise<any> => {
-  return axios("/getReportConfig", {params: query});
+  return axios("/getReportConfig", { params: query });
 };
 
 //设置回传配置
@@ -301,9 +301,9 @@ export const getRegisterData = (
     is_paid: number;
     show_all: number;
     page: number;
-  }> = {page: 1}
+  }> = { page: 1 }
 ): AxiosPromise<IList<RegisterData>> => {
-  return axios("/getAdMatchUsers", {params: query});
+  return axios("/getAdMatchUsers", { params: query });
 };
 
 //强制回传
@@ -330,7 +330,7 @@ export const getDesignList = (query: {
   desc: string;
   name: string;
 }>> => {
-  return axios("/delivery/getDeliveryStatFields", {params: query});
+  return axios("/delivery/getDeliveryStatFields", { params: query });
 };
 
 //财务数据
@@ -339,9 +339,9 @@ export const getFinanceList = (
     start_ymd: string;
     end_ymd: string;
     page: number;
-  }> = {page: 1}
+  }> = { page: 1 }
 ): AxiosPromise<IList<FinanceData>> => {
-  return axios("/ad/adFinanceStat", {params: query});
+  return axios("/ad/adFinanceStat", { params: query });
 };
 
 //广告组数据
@@ -354,9 +354,9 @@ export const getAdgroupList = (
     end_date: string;
     page: number;
     uids: string;
-  }> = {page: 1}
+  }> = { page: 1 }
 ): AxiosPromise<IList<AdGroupData>> => {
-  return axios("/ad/adCampaigns", {params: query});
+  return axios("/ad/adCampaigns", { params: query });
 };
 
 //修改广告组状态
@@ -376,9 +376,9 @@ export const getAdgroupData = (
     begin_date: string;
     end_date: string;
     uids: string;
-  }> = {page: 1}
+  }> = { page: 1 }
 ): AxiosPromise<IList<AdgroupList>> => {
-  return axios("/ad/adAdvertisers", {params: query});
+  return axios("/ad/adAdvertisers", { params: query });
 };
 
 //更新账户日预算
@@ -405,7 +405,7 @@ export const setChannelRate = (data: {
 
 //保存自定义列
 export const setCoustomClomuns = (data: any): any => {
-  return axios.post("/ad/saveFields", {fields: data});
+  return axios.post("/ad/saveFields", { fields: data });
 };
 
 //获取组统计
@@ -419,7 +419,7 @@ export const ALLadGroupData = (
     uids: string;
   }>
 ) => {
-  return axios("/ad/adCampaignSum", {params: query});
+  return axios("/ad/adCampaignSum", { params: query });
 };
 
 //获取🐖统计
@@ -433,7 +433,7 @@ export const ALLAcountGroupData = (
     uids: string;
   }>
 ) => {
-  return axios("/ad/adAdvertiserSum", {params: query});
+  return axios("/ad/adAdvertiserSum", { params: query });
 };
 
 //获取广告计划汇总
@@ -448,7 +448,7 @@ export const getadDataSum = (
     status: number | string;
   }>
 ) => {
-  return axios("/ad/adSumData", {params: query});
+  return axios("/ad/adSumData", { params: query });
 };
 
 //设置回传付费最低金额
@@ -466,7 +466,7 @@ export const statusAdChange = (data: {
   advertiser_id: string | number;
   is_enable: string | number;
 }) => {
-  return axios("/ad/updateAdvertiserStatus", {params: data});
+  return axios("/ad/updateAdvertiserStatus", { params: data });
 };
 
 /**
@@ -481,7 +481,7 @@ export const getAuthorUser = (): AxiosPromise<IUserAdmin> => {
 export const getOfficialBackConfig = (
   channel_id: number
 ): AxiosPromise<AccountPlanConfig> => {
-  return axios("/channel/reportConfig", {params: {channel_id}});
+  return axios("/channel/reportConfig", { params: { channel_id } });
 };
 
 // 保存公众号回传配置
@@ -513,41 +513,85 @@ export const getLandingPageList = (data: {
   end_time?: string;
   status?: number;
 }) => {
-  return axios("/landingPage/list", {params: data});
+  return axios("/landingPage/list", { params: data });
 };
 
 /**
  * 删除落地页
  * @returns
  */
-export const landingDelete = (data: {id: string | number}) => {
-  return axios("/landingPage/delete", {params: data});
+export const landingDelete = (data: { id: string | number }) => {
+  return axios("/landingPage/delete", { params: data });
 };
 
 /**
  * 落地页 创建落地页
  * @returns
  */
- export const landingAdd = (data: any) => {
+export const landingAdd = (data: any) => {
   return axios.post("/landingPage/add", data);
- }
+};
+
+/**
+ * 落地页书籍列表
+ * @returns
+ */
+export const landingBook = (data: {
+  book_name?: string;
+  official_name?: string;
+}) => {
+  return axios("/landingPage/books", { params: data });
+};
+
+/**
+ * 生成落地页
+ * @returns
+ */
+export const setLandingBook = (data: any) => {
+  return axios.post("/landingPage/setLink", data);
+};
+
+/**
+ * 落地页章节列表
+ * @returns
+ */
+export const landingCharpter = (data: { bid?: string }) => {
+  return axios("/landingPage/chapters", { params: data });
+};
 
- /**
+/**
+ * 落地页我得图片
+ * @returns
+ */
+export const landingMypic = (data:any) => {
+  return axios("/landingPage/myDocuments", { params: data });
+};
+
+/**
+ * 落地页保存封面
+ * @returns
+ */
+export const landingSaveMypic = (url: string) => {
+  return axios("/landingPage/uploadDocument", { params: { link: url } });
+};
+
+/**
  * 落地页 编辑
  * @returns
  */
 export const landingEdit = (data: any) => {
   return axios.post("/landingPage/edit", data);
- }
+};
+
 /**
  * 落地页 提交审核
  * @returns
  */
-export const landingSubmit = (data: {id: string | number}) => {
-  return axios("/landingPage/submit", {params: data});
- }
+export const landingSubmit = (data: { id: string | number }) => {
+  return axios("/landingPage/submit", { params: data });
+};
 
- /*
+/*
  * 获取落地页公众号列表
  * @returns
  */
@@ -567,8 +611,8 @@ export const getLandingDomains = (): AxiosPromise<IList<IDomainItem>> => {
  * 获取落地页详情
  * @returns
  */
-export const getLandingInfo = (id:string): AxiosPromise<any> => {
-  return axios("/landingPage/info",{params: {id}});
+export const getLandingInfo = (id: string): AxiosPromise<any> => {
+  return axios("/landingPage/info", { params: { id } });
 };
 
 /**
@@ -630,4 +674,4 @@ export const onUpload = (
  */
 export const getLandingTempalte = (): any => {
   return axios("/landingPage/bodyTemplates");
-};
+};

+ 7 - 0
src/components/Tinymce/src/Editor.vue

@@ -1,5 +1,6 @@
 <template>
   <div class="tinymce-container" :style="{ width: containerWidth }">
+    <slot />
     <textarea
       :id="tinymceId"
       ref="elRef"
@@ -216,5 +217,11 @@ export default defineComponent({
     z-index: -1;
     visibility: hidden;
   }
+  .btns{
+    position: absolute;
+    top: 4px;
+    right: 10px;
+    z-index: 20;
+  }
 }
 </style>

+ 4 - 2
src/plugins/install.ts

@@ -1,7 +1,7 @@
 /*
  * @Author: pikachu
  * @Date: 2021-04-28 09:20:56
- * @LastEditors: pikachu
+ * @LastEditors: Please set LastEditors
  */
 import {App} from "vue";
 import {
@@ -31,7 +31,8 @@ import {
   Card,
   Steps,
   Upload,
-  List
+  List,
+  Spin
 } from "ant-design-vue";
 
 import VueClipboard3 from "./vue-clipboard";
@@ -76,6 +77,7 @@ const install = (app: App<Element>) => {
     .use(Card)
     .use(Steps)
     .use(List)
+    .use(Spin)
     .use(Upload);
 };
 

+ 8 - 4
src/store/modules/app/_type.ts

@@ -14,8 +14,9 @@ type State = {
   user: Partial<IUser>;
   officials: SelectOptions<number>;
   platforms: SelectOptions<string>;
-  collapsed:boolean;
-  selectTime:any[];
+  collapsed: boolean;
+  selectTime: any[];
+  setTemStepOne: { [key: string]: any };
 };
 
 // mutation 定义
@@ -25,8 +26,9 @@ enum MutationType {
   setUser = "setUser",
   setOfficial = "setOfficial",
   setPlatforms = "setPlatforms",
-  setCollapsed = 'setCollapsed',
-  setSelectTime = 'setSelectTime'
+  setCollapsed = "setCollapsed",
+  setSelectTime = "setSelectTime",
+  setTemStepOne = "setTemStepOne",
 }
 
 type Mutations<S = State> = {
@@ -37,6 +39,7 @@ type Mutations<S = State> = {
   [MutationType.setPlatforms](state: S, platforms: SelectOptions<string>): void;
   [MutationType.setCollapsed](state: S, platforms: boolean): void;
   [MutationType.setSelectTime](state: S, platforms: any[]): void;
+  [MutationType.setTemStepOne](state: S, setTemStepOne: any[]): void;
 };
 
 // action 定义
@@ -71,6 +74,7 @@ type Getters = {
   platforms(state: State): SelectOptions<string>;
   collapsed(state: State): boolean;
   selectTime(state: State): any[];
+  getOneTemp(state: State): { [key: string]: any };
 };
 
 export { State, Mutations, MutationType, Actions, ActionType, Getters };

+ 1 - 0
src/store/modules/app/getters.ts

@@ -11,6 +11,7 @@ const getters: GetterTree<State, RootState> & Getters = {
   platforms: (state) => state.platforms,
   collapsed: (state) => state.collapsed,
   selectTime: (state) => state.selectTime,
+  getOneTemp: (state) => state.setTemStepOne,
 };
 
 export default getters;

+ 3 - 0
src/store/modules/app/mutations.ts

@@ -25,6 +25,9 @@ const mutations: MutationTree<State> & Mutations = {
   [MutationType.setPlatforms](state, platforms) {
     if (!state.platforms.length) state.platforms = platforms;
   },
+  [MutationType.setTemStepOne](state, setTemStepOne) {
+     state.setTemStepOne = setTemStepOne;
+  },
 };
 
 export default mutations;

+ 1 - 0
src/store/modules/app/state.ts

@@ -23,6 +23,7 @@ const state: State = {
   officials: [],
   platforms: [],
   selectTime:[],
+  setTemStepOne:{},
   collapsed:
     store.getItem("collapsed") && store.getItem("collapsed") === "true"
       ? true

+ 2 - 2
src/views/put/landing/add.vue

@@ -4,7 +4,7 @@
       <div class="step-container">
         <a-steps :current="stepCurrent">
           <a-step title="填写基本信息" />
-          <a-step title="编辑内容1" />
+          <a-step title="编辑内容" />
         </a-steps>
       </div>
       <div class="step-content-container">
@@ -44,7 +44,7 @@ const LandingAddPage = defineComponent({
   },
   setup() {
     const state = reactive({
-      stepCurrent: 1,
+      stepCurrent: 0,
       stepComponent: ["step-one", "step-two"],
       isOver: false,
       forms: ref<Record<string, any>>({}),

+ 22 - 37
src/views/put/landing/stepComp/step-one.vue

@@ -6,7 +6,11 @@
       :colon="false"
     >
       <a-form-item label="落地页名称" v-bind="validateInfos.title">
-        <a-input placeholder="请输入落地页名称" v-model:value="forms.title" :maxLength="30"/>
+        <a-input
+          placeholder="请输入落地页名称"
+          v-model:value="forms.title"
+          :maxLength="30"
+        />
       </a-form-item>
       <a-form-item label="公众号" v-bind="validateInfos.gzh_name">
         <a-select
@@ -37,15 +41,6 @@
           </template>
         </a-select>
       </a-form-item>
-      <a-form-item label="推广书籍" v-bind="validateInfos.bid">
-        <a-select placeholder="请选择需要推广的书籍" v-model:value="forms.bid">
-          <template v-for="book in books" :key="book.bid">
-            <a-select-option :value="book.bid">
-              {{ book.book_name }}
-            </a-select-option>
-          </template>
-        </a-select>
-      </a-form-item>
       <a-form-item label="公司主体">
         <a-input
           placeholder="请输入公司主体"
@@ -113,7 +108,8 @@ import { defineComponent, reactive, ref, toRefs } from "vue";
 import { InfoCircleOutlined } from "@ant-design/icons-vue";
 import { useForm } from "@ant-design-vue/use";
 import { useRouter } from "vue-router";
-
+import store from "@/store";
+import { MutationType } from "@/store/modules/app/_type";
 import ImageUpload from "@/components/image-upload/index.vue";
 
 import { getLandingBooks, getLandingDomains, getLandingOfficials } from "@/api";
@@ -123,13 +119,13 @@ const StepOne = defineComponent({
   name: "StepOne",
   components: {
     ImageUpload,
-    InfoCircleOutlined
+    InfoCircleOutlined,
   },
   props: {
     content: Object,
     default() {
       return {};
-    }
+    },
   },
   emits: ["next"],
   setup(props, { emit }) {
@@ -138,7 +134,6 @@ const StepOne = defineComponent({
     const state = reactive({
       officials: ref<IGZHItem[]>([]),
       domains: ref<IDomainItem[]>([]),
-      books: ref<IPBookItem[]>([]),
       forms: {
         title: "",
         name: "",
@@ -153,42 +148,34 @@ const StepOne = defineComponent({
         jump_type: "copy_name",
         sub_img: "",
         gzh_img: "",
-        content: ""
-      }
+        content: "",
+      },
     });
     const formsRules = reactive({
       title: [{ required: true, trigger: "blur", message: "请输入落地页名称" }],
       gzh_name: [
-        { required: true, trigger: "change", message: "请选择公众号" }
+        { required: true, trigger: "change", message: "请选择公众号" },
       ],
       domain: [
         {
           required: true,
           trigger: "change",
-          message: "请选择域名"
-        }
-      ],
-      bid: [
-        {
-          required: true,
-          type: "number",
-          trigger: "change",
-          message: "请选择推广书籍"
-        }
+          message: "请选择域名",
+        },
       ],
       link_source: [
         {
           required: true,
           trigger: "change",
-          message: "请选择渠道"
-        }
+          message: "请选择渠道",
+        },
       ],
       sub_img: [
         {
           required: true,
-          message: "请上传关注图片"
-        }
-      ]
+          message: "请上传关注图片",
+        },
+      ],
     });
 
     const { validate, validateInfos } = useForm(state.forms, formsRules);
@@ -198,15 +185,12 @@ const StepOne = defineComponent({
         const [
           { data: official },
           { data: domains },
-          { data: books }
         ] = await Promise.all([
           getLandingOfficials(),
           getLandingDomains(),
-          getLandingBooks()
         ]);
         state.officials = official.list;
         state.domains = domains.list;
-        state.books = books.list;
         state.forms = Object.assign(state.forms, (props as any)?.content ?? {});
         console.log(state.forms);
       } catch (error) {
@@ -245,6 +229,7 @@ const StepOne = defineComponent({
     const onNextStep = async () => {
       try {
         await validate();
+        store.commit(MutationType.setTemStepOne, state.forms);
         emit("next", state.forms);
       } catch (error) {
         console.log(error);
@@ -258,9 +243,9 @@ const StepOne = defineComponent({
       onDomainChange,
       onUploadChange,
       onBack,
-      onNextStep
+      onNextStep,
     };
-  }
+  },
 });
 
 export default StepOne;

+ 213 - 47
src/views/put/landing/stepComp/step-two.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="edit-content">
     <div class="edit-form">
-      <div class="edit-form-item">
+      <!-- <div class="edit-form-item">
         <p class="edit-label">正文</p>
         <div class="charpt-list form-content">
           <template v-for="(item, idx) in charptList" :key="idx">
@@ -39,6 +39,42 @@
             添加新章节+
           </div>
         </div>
+      </div> -->
+      <div class="edit-form-item">
+        <p class="edit-label">推广书籍</p>
+        <div class="edit-form-select">
+          <a-select
+            v-model:value="bookId"
+            placeholder="请选择推广书籍支持搜索"
+            style="width: 200px"
+            :filter-option="false"
+            :not-found-content="fetching ? undefined : null"
+            @search="fetchBook"
+            @change="selectBook"
+            show-search
+          >
+            <template v-if="fetching" #notFoundContent>
+              <a-spin size="small" />
+            </template>
+            <a-select-option v-for="d in bookList" :key="d.bid">
+              {{ d.book_name }}
+            </a-select-option>
+          </a-select>
+        </div>
+      </div>
+      <div class="edit-form-item">
+        <p class="edit-label">选择章节</p>
+        <div class="edit-form-select">
+          <a-select
+            v-model:value="charptId"
+            placeholder="选择章节"
+            style="width: 200px"
+          >
+            <a-select-option v-for="d in charptList" :key="d.sequence">
+              {{ d.name }}
+            </a-select-option>
+          </a-select>
+        </div>
       </div>
       <div class="edit-form-item">
         <p class="edit-label">顶部图片</p>
@@ -66,10 +102,13 @@
           ></div>
         </div>
       </div>
+      <div></div>
       <div>
-      <Tinymce v-model="mycontent" :height="600">
-
-      </Tinymce>
+        <Tinymce v-model="mycontent" :height="600">
+          <a-button @click="importTemp" class="btns" type="primary"
+            >导入模板</a-button
+          >
+        </Tinymce>
       </div>
       <div class="button-form">
         <a-button style="margin-right:20px" @click="goPrev">上一步</a-button>
@@ -86,8 +125,9 @@
         <a-tab-pane key="10" tab="女频"></a-tab-pane>
         <a-tab-pane key="11" tab="男频"></a-tab-pane>
         <a-tab-pane key="12" tab="活动"></a-tab-pane>
+        <a-tab-pane key="14" tab="我的"></a-tab-pane>
       </a-tabs>
-      <div class="radio-grouped">
+      <div class="radio-grouped" v-show="activeKey != 12 && activeKey != 14">
         <a-radio-group
           v-model:value="chooseType"
           style="margin: 0 auto"
@@ -97,6 +137,17 @@
           <a-radio-button value="2">古代</a-radio-button>
         </a-radio-group>
       </div>
+      <div class="upload-my" v-show="activeKey == 14">
+        <a-upload
+          v-model:file-list="fileList"
+          :show-upload-list="false"
+          :custom-request="onFileChange"
+        >
+          <a-button type="primary">
+            点击上传
+          </a-button>
+        </a-upload>
+      </div>
       <a-list
         class="loadmore-list"
         :loading="listLoading"
@@ -125,9 +176,13 @@
             <div :class="['img-item', index == temChecked ? 'current' : '']">
               <a-popover title="预览" trigger="click">
                 <template #content>
-                  <img :src="item.link"/>
+                  <img :src="item.link" />
                 </template>
-                <img :src="item.link" @click="chooseImg(item, index)"  width="144"/>
+                <img
+                  :src="item.link"
+                  @click="chooseImg(item, index)"
+                  width="144"
+                />
               </a-popover>
             </div>
           </a-list-item>
@@ -138,15 +193,33 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, reactive, ref, toRefs, onMounted } from "vue";
-import { getLandingPic, getLandingTempalte } from "@/api";
-import {Tinymce} from "@/components/Tinymce/index";
+import {
+  defineComponent,
+  reactive,
+  ref,
+  toRefs,
+  onMounted,
+  computed,
+} from "vue";
+import {
+  getLandingPic,
+  getLandingTempalte,
+  landingBook,
+  landingCharpter,
+  setLandingBook,
+  landingMypic,
+  landingSaveMypic,
+  onUpload,
+} from "@/api";
+import store from "@/store";
+import { Tinymce } from "@/components/Tinymce/index";
 import { message } from "ant-design-vue";
 import useApp from "@/hooks/useApp";
+import useDebounceFn from "@/hooks/useDebounceFn";
 const StepTwo = defineComponent({
   name: "StepTwo",
-  components:{
-  Tinymce
+  components: {
+    Tinymce,
   },
   props: {
     content: Object,
@@ -157,13 +230,13 @@ const StepTwo = defineComponent({
   setup(props, { emit }) {
     const { route, router } = useApp();
     const state = reactive({
-      charptList: ref<Array<{ content: string; title: string }>>([
-        {
-          title: "",
-          content: "",
-        },
-      ]),
-      mycontent:'',
+      fileList: ref<any>([]),
+      bookId: "",
+      charptId: "",
+      fetching: false,
+      bookList: ref<any>([]),
+      charptList: ref<any>([]),
+      mycontent: "",
       modelShow: false,
       selectImg: false,
       activeKey: "10",
@@ -178,6 +251,7 @@ const StepTwo = defineComponent({
       templateItemChecked: ref<any>({}),
       templateChecked: ref<any>(null),
       templateList: ref<any[]>([]),
+      stepOneTem: computed(() => store.getters.getOneTemp),
     });
     const addNewCharpt = () => {
       let data = {
@@ -194,6 +268,71 @@ const StepTwo = defineComponent({
       state.modelShow = true;
       loadMore();
     };
+    //搜索书籍
+    const fetchBook = useDebounceFn((val: string) => {
+      if (val) {
+        state.fetching = true;
+        landingBook({ book_name: val }).then((res) => {
+          let bookList = res.data.list;
+          state.bookList = bookList;
+          state.fetching = false;
+        });
+      }
+    }, 800);
+    const onFileChange = async (file: { file: File }) => {
+      if (file.file.size / 1024 > 600)
+        return message.error("图片大小超过600KB,请重新选择");
+      try {
+        let tempFile = file.file;
+        const { data } = await onUpload(tempFile, "customTop");
+        let url = data.url;
+        await landingSaveMypic(url);
+        message.success("上传我的图片成功!");
+      } catch (error) {
+        message.error(error.msg ?? "系统错误");
+      }
+    };
+    //落地页
+    const importTemp = () => {
+      console.log(state.bookId);
+      let errors = 0;
+      let content: Array<any> = [];
+      if (!state.bookId || !state.charptId) {
+        message.error("请选择书籍或者章节");
+        errors++;
+      }
+      if (!state.chooseImgUrl) {
+        message.error("头像不能为空");
+        errors++;
+      }
+      if (state.templateItemChecked && !state.templateItemChecked.id) {
+        message.error("模板不能为空");
+        errors++;
+      }
+      if (errors > 0) {
+        return false;
+      }
+      const data = {
+        head_img: state.chooseImgUrl,
+        body_template_id: state.templateItemChecked.id,
+        bid: state.bookId,
+        sequence: state.charptId,
+      };
+      let landData = { ...state.stepOneTem, ...data };
+      setLandingBook(landData).then((res) => {
+        let html = res.data.html_raw;
+        state.mycontent = html;
+      });
+    };
+    const uploadMyPic = () => {};
+    //选择章节
+    const selectBook = useDebounceFn((val: string) => {
+      if (val) {
+        landingCharpter({ bid: val }).then((res) => {
+          state.charptList = res.data;
+        });
+      }
+    }, 500);
     //选择图片
     const chooseImg = (item: any, idx: number) => {
       state.temItem = item;
@@ -209,16 +348,29 @@ const StepTwo = defineComponent({
           const {
             content,
             body_template_id,
+            bid,
+            book_name,
             head_img,
+            html_raw,
+            sequence,
           } = (props as any).content;
           try {
-            state.charptList = content ? JSON.parse(content) : [{ title: "", content: ""}];
-            state.chooseImgUrl = head_img ?? '';
+            state.charptList = content
+              ? JSON.parse(content)
+              : [{ title: "", content: "" }];
+            state.chooseImgUrl = head_img ?? "";
             state.selectImg = head_img ? true : false;
-            if(!body_template_id) return
+            if (!body_template_id) return;
             state.templateChecked = state.templateList.findIndex(
               (item) => item.id == body_template_id
             );
+            state.bookId = bid;
+            state.bookList = [{ bid: bid, book_name: book_name }];
+            state.charptId = sequence;
+            state.mycontent = html_raw;
+            landingCharpter({ bid }).then((res) => {
+              state.charptList = res.data;
+            });
             state.templateItemChecked =
               state.templateList[state.templateChecked];
           } catch (e) {
@@ -241,15 +393,25 @@ const StepTwo = defineComponent({
         state.temChecked = null;
         state.dataList = [];
       }
-      getLandingPic(
-        state.activeKey,
-        state.chooseType,
-        page ?? state.currentPage
-      ).then((res: any) => {
-        state.dataList = state.dataList.concat(res.data.list);
-        state.currentPage = res.data.meta.current_page + 1;
-        if (res.data.meta.is_end) state.showLoaderMore = false;
-      });
+      if (state.activeKey != "14") {
+        getLandingPic(
+          state.activeKey,
+          state.chooseType,
+          page ?? state.currentPage
+        ).then((res: any) => {
+          state.dataList = state.dataList.concat(res.data.list);
+          state.currentPage = res.data.meta.current_page + 1;
+          if (res.data.meta.is_end) state.showLoaderMore = false;
+        });
+      } else {
+        landingMypic({ page: page ? page : state.currentPage }).then(
+          (res: any) => {
+            state.dataList = state.dataList.concat(res.data.list);
+            state.currentPage = res.data.meta.current_page + 1;
+            if (res.data.meta.is_end) state.showLoaderMore = false;
+          }
+        );
+      }
     };
     //选择顶部图
     const handleSumbit = () => {
@@ -273,24 +435,16 @@ const StepTwo = defineComponent({
         body_template_id: state.templateItemChecked.id,
         content: JSON.stringify(content),
       };
-      emit("prev",data);
+      emit("prev", data);
     };
     //保存表单
     const submitForm = () => {
       let errors = 0;
       let content: Array<any> = [];
-      state.charptList.map((r: any) => {
-        let item = {
-          title: r.title,
-          content: r.content,
-        };
-        if (!r.title || !r.content) {
-          message.error("标题或者内容不能为空");
-          errors++;
-        }
-        content.push(item);
-        return r;
-      });
+      if (!state.bookId || !state.charptId) {
+        message.error("请选择书籍或者章节");
+        errors++;
+      }
       if (!state.chooseImgUrl) {
         message.error("头像不能为空");
         errors++;
@@ -299,15 +453,22 @@ const StepTwo = defineComponent({
         message.error("模板不能为空");
         errors++;
       }
+      if (!state.mycontent) {
+        message.error("请先导入生成落地页模板");
+        errors++;
+      }
       if (errors > 0) {
         return false;
       }
       const data = {
         head_img: state.chooseImgUrl,
         body_template_id: state.templateItemChecked.id,
-        content: JSON.stringify(content),
+        bid: state.bookId,
+        sequence: state.charptId,
+        html_raw: state.mycontent,
       };
-      emit("next", data);
+      let landData = { ...state.stepOneTem, ...data };
+      emit("next", landData);
     };
 
     onMounted(() => {
@@ -324,6 +485,11 @@ const StepTwo = defineComponent({
       chooseTemplate,
       goPrev,
       submitForm,
+      fetchBook,
+      selectBook,
+      importTemp,
+      uploadMyPic,
+      onFileChange,
     };
   },
 });
@@ -343,7 +509,7 @@ export default StepTwo;
     border-radius: 6px;
     overflow: hidden;
     position: relative;
-    
+
     &.current {
       border: 2px solid #006eff;
       &::after {