提交一波

src/router/async.ts

@@ -56,13 +56,13 @@ const LandingAddPage: RouteConfig = {
   hidden: true,
   component: () => import("@/views/put/landing/add.vue")
 };
-export const Operation: RouteConfig = {
-  name: "Operation",
-  path: "/Operation",
+export const LandingEditPage: RouteConfig = {
+  name: "LandingEditPage",
+  path: "/put/landing/edit",
   meta: {
     title: "落地页编辑",
   },
-  component: () => import("@/views/landing/landing/edit.vue"),
+  component: () => import("@/views/put/landing/edit.vue"),
 };
 const PutLog: RouteConfig = {
   name: "PutLog",
@@ -138,7 +138,6 @@ export const PutManager: RouteConfig = {
     PutDataTab,
     PutData,
     PutDataMore,
-    Operation,
     LandingPage,
     LandingAddPage
   ],

src/views/put/landing/add.vue

@@ -31,7 +31,7 @@ const LandingAddPage = defineComponent({
   },
   setup() {
     const state = reactive({
-      stepCurrent: 0,
+      stepCurrent: 1,
       stepComponent: ["step-one", "step-two"]
     });
 

src/views/put/landing/edit.vue

@@ -1,7 +1,5 @@
 <template>
-  <div class="edit-wrap">
-    <div class=""></div>
-  </div>
+  
 </template>
 
 <script lang="ts">
@@ -19,14 +17,12 @@ const EditContent = defineComponent({
     LockOutlined,
   },
   setup() {
-   
-    return { };
+
+    return {};
   },
 });
 
 export default EditContent;
 </script>
 
-<style lang="scss" scoped>
 
-</style>

src/views/put/landing/stepComp/step-two.vue

@@ -1,13 +1,135 @@
 <template>
-  <div>步骤二</div>
+  <div class="edit-content">
+    <div class="edit-form">
+      <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">
+            <div class="charpt-list-item">
+              <p class="item-label">文章标题</p>
+              <div class="item-input">
+                <a-input
+                  v-model:value="item.title"
+                  placeholder="请输入标题"
+                  style="width:638px"
+                />
+              </div>
+              <a href="javascript:;" class="delete-text" v-show="idx > 0" @click="deleteLine(idx)"
+                >删除</a
+              >
+            </div>
+            <div class="charpt-list-item bor-line">
+              <p class="item-label">正文内容</p>
+              <div class="item-input">
+                <a-textarea
+                  v-model:value="item.content"
+                  placeholder="请输入正文"
+                  :auto-size="{ minRows: 5, maxRows: 10 }"
+                />
+              </div>
+            </div>
+            <hr />
+          </template>
+          <div class="add-item" @click="addNewCharpt">
+            添加新章节+
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
 </template>
 
 <script lang="ts">
-import { defineComponent } from "vue";
+import { defineComponent, reactive, ref, toRefs } from "vue";
 
 const StepTwo = defineComponent({
-  name: "StepTwo"
+  name: "StepTwo",
+  setup(props, { emit }) {
+    const state = reactive({
+      charptList: ref<Array<{ content: string; title: string }>>([
+        {
+          title: "大苏打萨达速度阿萨德阿萨德阿士大夫撒方式打发的撒范德萨飞",
+          content: "sadassssssssssssssssasdsaddasdas",
+        },
+      ]),
+    });
+    const addNewCharpt = () => {
+      let data = {
+        title: "",
+        content: "",
+      };
+      state.charptList.push(data);
+    };
+    const deleteLine = (idx:number) =>{
+      state.charptList.splice(idx,1)
+    }
+    return {
+      ...toRefs(state),
+      addNewCharpt,
+      deleteLine
+    };
+  },
 });
 
 export default StepTwo;
 </script>
+<style lang="scss" scoped>
+.edit-form {
+  .add-item {
+    width: 270px;
+    height: 40px;
+    line-height: 35px;
+    color: #006eff;
+    font-size: 16px;
+    text-align: center;
+    background: #ffffff;
+    border-radius: 3px;
+    border: 2px solid #006eff;
+    margin: 15px auto 0;
+  }
+  .edit-form-item {
+    font-size: 16px;
+    display: flex;
+    align-items: center;
+    hr {
+      margin-bottom: 25px;
+      border: none;
+      height: 1px;
+      background-color: #e5e5e5;
+    }
+    .edit-label {
+      margin-right: 15px;
+    }
+    .form-content {
+      padding: 30px 50px;
+      background: #f7f7f7;
+    }
+
+    .charpt-list-item {
+      display: flex;
+      align-items: center;
+      margin-bottom: 30px;
+      overflow: hidden;
+      &.bor-line {
+        margin-bottom: 25px;
+      }
+      .item-label {
+        margin-right: 18px;
+      }
+      .delete-text {
+        display: block;
+        margin-left: 15px;
+      }
+    }
+  }
+}
+</style>
+<style lang="scss">
+.bor-line {
+  .item-input {
+    textarea {
+      width: 638px;
+    }
+  }
+}
+</style>