<template>
    <div class="main-content12">
        <div class="pageheader">
            <span class="pagetitle">{{info.type_desc}}-提交页SEO</span>
        </div>

        <div class="flex-common">
            <PromptText text="温馨提示：提交页标题不允许使用“知网”、“pmlc”、“amlc”和“smlc”等关键词。" :type="2" class="mb16"/>

            <el-form ref="formRef">
                <div class="flex-wrap">
                    <div class="flex-left">
                        <GuipFormItem column="column" class="mb24" label="提交页标题（T：title）">
                            <GuipInput slot="formDom" ref="GuipInput" class=" mb24" width="100%"
                                       placeholder="建议80字内" v-model="info.seo_form_title">
                            </GuipInput>
                        </GuipFormItem>
                        <GuipFormItem column="column" label="提交页关键词（K：keyword）">
                            <GuipInput slot="formDom" ref="GuipInput" width="100%" height="68px"
                                       type="textarea" v-model="info.seo_form_keyword">
                            </GuipInput>
                        </GuipFormItem>
                    </div>
                    <div class="flex-line "></div>
                    <div class="flex-right">
                        <GuipFormItem column="column" label="提交页描述（D：description）">
                            <GuipInput slot="formDom" ref="GuipInput" width="100%" height="160px"
                                       type="textarea" v-model="info.seo_form_desc">
                            </GuipInput>
                        </GuipFormItem>
                    </div>
                </div>
            </el-form>
        </div>

        <div class="save-button">
            <GuipButton type="primary" :btnstyle="saveBtnStyleObj" @click="saveConfirm">保存</GuipButton>
        </div>
    </div>
</template>
<script>

import GuipFormItem from "@/components/GuipFormItem.vue";
import PromptText from "@/components/PromptText.vue";
import GuipButton from "@/components/GuipButton.vue";
import GuipInput from "@/components/GuipInput.vue";

export default {
    name: 'submitSeoSet',
    props: {
        serviceInfo: {
            type: Object,
            required: true
        }
    },
    components: {
        GuipInput,
        GuipButton, PromptText, GuipFormItem

    },
    data(){
        return {
            token: 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpYXQiOjE3NTAwNTM3MjQsIm5iZiI6MTc1MDA1MzcyNCwiZXhwIjoxNzUyNjQ1NzI0LCJ1c2VyIjoic3VidXNlciIsImxvZ2luX3R5cGUiOjAsImFpZCI6IjEifQ.xyIqBLelB-k6jCifgRevBJTyg_Qrm6m1e4OcHhOpepU',
            info: {},
            //添加按钮样式
            saveBtnStyleObj: {
                width: '144px',
                height: '46px',
                borderRadius: '4px',
                background: '#006AFF',
            },
        }
    },
    mounted() {
        this.info = JSON.parse(JSON.stringify(this.serviceInfo))
    },
    methods: {
        saveConfirm() {
            let obj = {}
            obj.uid = this.info.uid
            obj.type = this.info.type
            obj.submit_title = this.info.seo_form_title
            obj.submit_keyword = this.info.seo_form_keyword
            obj.submit_desc = this.info.seo_form_desc

            const that = this
            this.$http('POST', '/agentnew/ajax_update_service_submit_page_seo', obj,{
                headers:{
                    'Auth': this.token
                }
            }).then(response => {
                if(response.status){
                    that.$message.success('保存成功');
                    that.$emit('saveEvent', that.info)
                    return true;
                }
                that.$message.success(response.info);
            }).catch(error => {
                console.error(error, 'error')
            })
        },
    }
}
</script>
<style lang="scss">

</style>