添加生成视频页面

src/api/indexAI.js

@@ -361,6 +361,15 @@ export function insideUpdateFeedBack(query) {
     })
 }
 
+// 创建AI视频
+export function CreateVideoDesign(query) {
+    return request({
+        url: '/aidesign/outside/CreateVideoDesign',
+        method: 'post',
+        data: query
+    })
+}
+
 //获取确认下单地址
 export function GetOrderAddress(formData) {
     const auth = getAuthCredentials();

src/router/index.ts

@@ -88,6 +88,12 @@ const router = new VueRouter({
               component: () => import("../views/AIDesign/feedback.vue"),
               meta: { requiresAuth: true }
           },
+          //生成视频页面
+          {
+              path: "/AIDesign/createVideo",
+              component: () => import("../views/AIDesign/createVideo.vue"),
+              meta: { requiresAuth: true }
+          },
         // 生成方案
         {
           path: "/AIDesign/GeneratePlan",

src/views/AIDesign/createVideo.vue

@@ -0,0 +1,150 @@
+<template>
+    <div class="resout-container AI-Design-container">
+        <div class="header">
+            <van-nav-bar title="一键反馈" left-arrow @click-left="returnPage" @click-right="toHome">
+                <template #right>
+                    <van-icon name="wap-home-o" color="#333" size="26" />
+                </template>
+            </van-nav-bar>
+        </div>
+        <div class="card" style="padding-top: 15px;">
+            <div v-if="feedbackResult == 0" class="title">写反馈</div>
+            <van-field
+                    v-if="feedbackResult == 0"
+                    v-model="feedbackMessage"
+                    rows="12"
+                    autosize
+                    @input="messageInput"
+                    style="padding: 0;"
+                    type="textarea"
+                    maxlength="300"
+                    :placeholder="textareaPlaceholder"
+                    show-word-limit
+            />
+            <img v-if="feedbackResult == 1" src="@/assets/AIDesign/feedback_result.png" class="feedback-result-img" />
+            <div v-if="feedbackResult == 1" class="feedback-result-txt">您已成功提交反馈，我们将尽快处理~</div>
+        </div>
+        <van-button
+                v-if="feedbackResult == 0"
+                type="primary"
+                size="large"
+                color="#2484F2"
+                :disabled="isBtnDisabled"
+                style="width: 90%;margin-top: 20px;border-radius: 15px;"
+                @click="applyFeedback">
+            提交反馈
+        </van-button>
+    </div>
+</template>
+
+<script lang="ts">
+    import { Component, Vue } from "vue-property-decorator";
+    import { outsideUpdateFeedBack, insideUpdateFeedBack } from "@/api/indexAI";
+    import { toLBHome } from '@/utils/index';
+    @Component
+    export default class extends Vue {
+
+        private isBtnDisabled = true;
+        private feedbackMessage = '';
+        private feedbackResult = 0;
+        private wallType: '';
+        private textareaPlaceholder = '差点意思？再生成一张会更好\n也可以在此提出您的宝贵意见...'
+
+        // 处理内外墙api
+        private applyFeedbackApi = {
+            outside: outsideUpdateFeedBack,
+            inside: insideUpdateFeedBack
+        };
+
+        activated(){
+            this.wallType = this.$route.query.wallType;
+            this.feedbackResult =  this.$route.query.feedbackResult;
+            this.initialize();
+        }
+
+        //初始化页面数据
+        private initialize() {
+            this.feedbackMessage = '';
+            this.isBtnDisabled = true;
+        }
+        
+        applyFeedback(){
+            let that = this;
+            const F_ID = this.$route.query.F_id || "";
+            const formData = new FormData();
+            formData.append('F_id', F_ID);
+            formData.append('Feedback', that.feedbackMessage);
+            that.applyFeedbackApi[that.wallType](formData).then(response => {
+                if (response.StatusCode == 200) {
+                    that.feedbackResult = 1;
+                }
+            })
+        }
+
+        messageInput(value){
+            let that = this;
+            if (value.trim() === "") {
+                that.isBtnDisabled = true;
+            }else {
+                that.isBtnDisabled = false;
+            }
+        }
+
+        returnPage() {
+            this.$router.back();
+        }
+
+        toHome() {
+            toLBHome()
+        }
+    }
+</script>
+
+<style scoped lang="scss">
+    .resout-container {
+        background: linear-gradient(to bottom, #dffef6, #e7f8f4);
+        min-height: 100vh;
+        flex-direction: column;
+        display: flex;
+        align-items: center;
+    }
+    .header {
+        border-bottom: 1px solid #f8f8f8;
+        .van-nav-bar__title {
+            font-size: 20px;
+            color: #333;
+        }
+        .van-icon {
+            font-size: 20px;
+            color: #333 !important;
+        }
+    }
+    .card{
+        width: 90%;
+        height: 60vh;
+        min-height: 60vh;
+        background-color: #FFFFFF;
+        border-radius: 15px;
+        margin-top: 70px;
+        flex-direction: column;
+        display: flex;
+        box-sizing: border-box;
+        padding: 15px;
+        .title{
+            font-size: 20px;
+            font-weight: 700;
+            margin-bottom: 15px;
+        }
+        .feedback-result-img{
+            width: 70%;
+            margin-left: 15%;
+            margin-top: 10%;
+        }
+        .feedback-result-txt{
+            font-size: 16px;
+            color: rgb(134, 144, 156);
+            text-align: center;
+            margin-top: 15px;
+        }
+    }
+</style>

src/views/AIDesign/result.vue

@@ -59,6 +59,13 @@
       <!-- 功能按钮组 -->
       <!-- 外墙 -->
       <div class="button-group-outside" v-if="wallType === 'outside' || wallType === 'inside'">
+        <button class="action-button-video flex-center" @click="handleAIfun">
+          <img src="@/assets/AIDesign/file-video.png" class="icon" />
+          <div>
+            <div class="title">查看AI视频</div>
+            <div class="text">全方位查看效果</div>
+          </div>
+        </button>
         <button class="action-button-big flex-center" @click="handleAIfun"
           v-if="agentFrom === 'stoneLikePaint' && allRes && allRes.F_DesignStyle != 'CHANGE_COLOR' && StateCode == 2 && wallType === 'outside'">
           <img src="@/assets/AIDesign/file-excel-line.png" class="icon" />
@@ -918,6 +925,14 @@ export default class extends Vue {
     background: rgba(248, 243, 204, 1);
   }
 
+  .action-button-video {
+    width: 100%;
+    height: 72px;
+    text-align: center;
+    border-radius: 8px;
+    background: rgba(217, 255, 135, 1);
+  }
+
   .action-button-middle {
     width: 48%;
     height: 72px;