浏览代码

Merge branch 'master' of qk:zhuishuyun/precise_delivery_distribution_front

xia 3 年之前
父节点
当前提交
e02a544dd0

+ 28 - 2
src/components/image-upload/index.vue

@@ -13,8 +13,17 @@
         </template>
       </div>
       <p class="tip-text" v-if="tips">{{ tips }}</p>
+      <a v-if="cover" herf="javavscript:;" class="pre-view" @click.stop="onPreView">预览</a>
     </div>
   </a-upload>
+  <a-modal
+    title="预览"
+    :visible="visible"
+    @cancel="onPreView"
+    footer=""
+  >
+    <img v-if="cover" :src="cover" alt="预览图" class="pre-view-pic"/>
+  </a-modal>
 </template>
 
 <script lang="ts">
@@ -54,7 +63,8 @@ const ImageUpload = defineComponent({
     console.log(props.value);
     const state = reactive({
       uploading: false,
-      cover: props.value ?? ""
+      cover: props.value ?? "",
+      visible: false,
     });
     watch(
       () => props.value,
@@ -63,6 +73,7 @@ const ImageUpload = defineComponent({
       }
     );
     const onFileChange = async (file: { file: File }) => {
+      if(file.file.size / 1024 > 600) return message.error("图片大小超过600KB,请重新选择");
       try {
         state.uploading = true;
         let tempFile = file.file;
@@ -75,8 +86,11 @@ const ImageUpload = defineComponent({
         state.uploading = false;
       }
     };
+    const onPreView = () => {
+      state.visible = state.visible ? false : true;
+    };
 
-    return { ...toRefs(state), onFileChange };
+    return { ...toRefs(state), onFileChange, onPreView };
   }
 });
 
@@ -107,6 +121,14 @@ export default ImageUpload;
     width: 250px;
   }
 
+  .pre-view {
+    position: absolute;
+    right: -10px;
+    bottom: 0%;
+    transform: translate(105%, 0%);
+    font-size: 12px;
+  }
+
   .cover-edit-wrap {
     position: absolute;
     width: 100%;
@@ -129,4 +151,8 @@ export default ImageUpload;
     // }
   }
 }
+.pre-view-pic {
+  width: 100%;
+  max-height: 100%;
+}
 </style>

+ 1 - 0
src/views/put/landing/add.vue

@@ -96,6 +96,7 @@ const LandingAddPage = defineComponent({
 
     //上一步
     const onTapPrev = (content: Record<string, any>) => {
+      Object.assign(state.forms, content)
       state.stepCurrent--;
     };
     return {

+ 2 - 4
src/views/put/landing/stepComp/step-one.vue

@@ -6,7 +6,7 @@
       :colon="false"
     >
       <a-form-item label="落地页名称" v-bind="validateInfos.title">
-        <a-input placeholder="请输入落地页名称" v-model:value="forms.title" />
+        <a-input placeholder="请输入落地页名称" v-model:value="forms.title" :maxLength="30"/>
       </a-form-item>
       <a-form-item label="公众号" v-bind="validateInfos.gzh_name">
         <a-select
@@ -98,7 +98,7 @@
         />
       </a-form-item>
       <a-form-item label="简介">
-        <a-textarea v-model:value="forms.name"></a-textarea>
+        <a-textarea v-model:value="forms.name" :maxLength="50"></a-textarea>
       </a-form-item>
       <a-form-item :wrapper-col="{ offset: 3 }">
         <a-button @click="onBack" style="margin-right: 10px">返回</a-button>
@@ -156,7 +156,6 @@ const StepOne = defineComponent({
         content: ""
       }
     });
-
     const formsRules = reactive({
       title: [{ required: true, trigger: "blur", message: "请输入落地页名称" }],
       gzh_name: [
@@ -195,7 +194,6 @@ const StepOne = defineComponent({
     const { validate, validateInfos } = useForm(state.forms, formsRules);
 
     const initConfigData = async () => {
-      console.log(props);
       try {
         const [
           { data: official },

+ 18 - 2
src/views/put/landing/stepComp/step-two.vue

@@ -9,6 +9,7 @@
               <p class="item-label">文章标题</p>
               <div class="item-input">
                 <a-input
+                  :maxLength="50"
                   v-model:value="item.title"
                   placeholder="请输入标题"
                   style="width:638px"
@@ -193,7 +194,8 @@ const StepTwo = defineComponent({
     const getTemList = () => {
       getLandingTempalte().then((res: any) => {
         state.templateList = res.data.list;
-        if (props && (props as any).content && route.query && route.query.id) {
+        //  之前的回显条件&& route.query && route.query.id
+        if (props && (props as any).content) {
           const {
             content,
             body_template_id,
@@ -248,7 +250,21 @@ const StepTwo = defineComponent({
     };
     //上一步
     const goPrev = () => {
-      emit("prev");
+      let content: Array<any> = [];
+      state.charptList.map((r: any) => {
+        let item = {
+          title: r.title,
+          content: r.content,
+        };
+        content.push(item);
+        return r;
+      });
+      const data = {
+        head_img: state.chooseImgUrl,
+        body_template_id: state.templateItemChecked.id,
+        content: JSON.stringify(content),
+      };
+      emit("prev",data);
     };
     //保存表单
     const submitForm = () => {