<template>
    <div class="edit-view">
        <page-title></page-title>
        <el-tabs class="edit-tabs" v-model="activeName" @tab-click="tabClick">
            <div class="right-btns">
                <el-button type="primary" size="small">新增答复</el-button>
                <el-button type="primary" size="small">新增费用</el-button>
                <el-button type="primary" size="small" @click="$refs.attachmentAdd.show = true">新增附件</el-button>
                <el-button type="primary" size="small">分案/接续流程</el-button>
            </div>
            <div class="tips" v-if="nowStatus">
                <div class="tips-text">
                    <span class="name">当前流程节点</span>
                    <span class="val">{{ nowStatus }}</span>
                </div>

                <div class="tips-text">
                    <span class="name">处理人</span>
                    <span class="val">{{ user }}</span>
                </div>

                <div class="tips-text">
                    <span class="name">处理截止日期</span>
                    <span class="val">无</span>
                </div>

                <el-button @click="action" type="text" size="small">立即处理</el-button>
            </div>
            <el-tab-pane label="基本信息" name="first">
                <base-info ref="base" :info.sync="formData"></base-info>
            </el-tab-pane>
            <el-tab-pane label="附件列表" name="second">
                <attachment-list ref="attachmentList" :logoPatentInfo="formData"></attachment-list>
            </el-tab-pane>
            <el-tab-pane label="费用信息" name="third"></el-tab-pane>
            <el-tab-pane label="流程信息" name="fourth"></el-tab-pane>
        </el-tabs>

        <signed ref="sign" :info="formData" @submit="submit" @uploadAttement="uploadAttement"></signed>

        <attachment-add ref="attachmentAdd" :info="formData"></attachment-add>

        <maintenance ref="maintenance" :info="formData" @submit="submit" @uploadAttement="uploadAttement"></maintenance>
        <accept ref="accept" :info="formData" @submit="submit" @uploadAttement="uploadAttement"></accept>
    </div>
</template>
<script>
import BaseInfo from '../components/logoPatent/BaseInfo.vue';
import Signed from '../components/logoPatent/Signed.vue';
import attachmentList from '../components/logoPatent/AttachmentList.vue';
import logoPatent from '@/mixins/logoPatent';
import AttachmentAdd from '../components/logoPatent/AttachmentAdd.vue';
import Maintenance from '../components/logoPatent/Maintenance.vue';
import Accept from '../components/logoPatent/Accept.vue';
export default {
    name: 'LogoPatentEdit',
    mixins: [logoPatent],
    created() {
        if (this.$route.query.id) {
            this.$http
                .get('logoPatent/get/' + this.$route.query.id)
                .then(res => {
                    this.formData = res;
                    this.$nextTick(() => {
                        this.init();
                    });
                })
                .catch(e => {
                    console.log(e);
                    this.$message.error(e.error);
                });
        }
    },
    data() {
        return {
            saving: false,
            formData: {},
            rules: {},
            clientPartnerIdOptions: [],
            supplierPartnerIdOptions: [],
            activeName: 'first'
        };
    },
    computed: {
        nowStatus() {
            return this.logoWorkflowFormatter('', '', this.formData.logoWorkflow);
        },
        user() {
            if (this.formData.logoWorkflow === 'IS_CONTRACT') {
                return '客户经理';
            } else if (this.formData.logoWorkflow) {
                return '项目经理';
            } else {
                return '';
            }
        }
    },
    methods: {
        init() {
            if (this.activeName === 'first') {
                this.$refs.base.init();
            } else if (this.activeName === 'second') {
                this.$refs.attachmentList.getData();
            }
        },
        tabClick(tab) {
            this.$nextTick(() => {
                this.init();
            });
        },
        onSave() {
            this.$refs.form.validate(valid => {
                if (valid) {
                    this.submit();
                } else {
                    return false;
                }
            });
        },
        submit(info) {
            let data = { ...info };
            this.saving = true;
            this.$http
                .post('/logoPatent/save', data, { body: 'json' })
                .then(res => {
                    this.saving = false;
                    this.$message.success('成功');
                    this.init();
                })
                .catch(e => {
                    console.log(e);
                    this.saving = false;
                    this.$message.error(e.error);
                });
        },
        onDelete() {
            this.$alert('删除将无法恢复，确认要删除么？', '警告', { type: 'error' })
                .then(() => {
                    return this.$http.post(`/logoPatent/del/${this.formData.id}`);
                })
                .then(() => {
                    this.$message.success('删除成功');
                    this.$router.go(-1);
                })
                .catch(e => {
                    if (e !== 'cancel') {
                        console.log(e);
                        this.$message.error((e || {}).error || '删除失败');
                    }
                });
        },
        uploadAttement(info) {
            let data = { ...info };
            if (!data.url) {
                return;
            }
            data.patentId = this.formData.id;
            data.userId = this.$store.state.userInfo.id;
            this.$http.post('/attachment/save', data, { body: 'json' });
        },
        action() {
            if (this.formData.logoWorkflow === 'IS_CONTRACT') {
                this.$refs.sign.show = true;
            } else if (this.formData.logoWorkflow === 'TO_BE_MAINTAINED') {
                this.$refs.maintenance.show = true;
            } else if (this.formData.logoWorkflow === 'PENDING') {
                this.$refs.accept.show = true;
            }
        }
    },
    components: {
        BaseInfo,
        Signed,
        attachmentList,
        AttachmentAdd,
        Maintenance,
        Accept
    }
};
</script>
<style lang="less" scoped>
.edit-tabs {
    position: relative;

    .right-btns {
        position: absolute;
        right: 20px;
        top: -44px;
        .el-button {
            min-width: 100px;
        }
    }
}

.tips {
    .flex();
    height: 40px;
    background: tint(@warn, 68%);
    border: 1px solid @warn;
    margin: 20px 20px 0;
    padding: 0 20px;
    position: relative;

    .tips-text {
        margin-right: 60px;
        .name {
            font-size: 12px;
            color: #5e6166;
            line-height: 22px;
        }

        .val {
            font-size: 12px;
            font-weight: bold;
            color: @warn;
            line-height: 22px;
            margin-left: 10px;
        }
    }

    .el-button {
        position: absolute;
        right: 20px;
    }
}
</style>
