<template>
    <Form :label-width="100">
        <Form-item label="店铺名称：">
            <span>{{}}</span>
        </Form-item>
        <Form-item label="店铺类型：">
            <span>{{}}</span>
        </Form-item>
        <Form-item label="店铺域名：">
            <span>{{}}</span>
        </Form-item>
        <Form-item label="店铺LOGO：">
            <div class="upload-item">
                <div class="upload-item-img">
                    <drag-file-upload
                        :id="{goodIndex:1, imageIndex: 1}"
                        @on-success="uploadImageSuccess"
                        @on-remove="uploadImageRemove">
                    </drag-file-upload>
                </div>
            </div>
            <em class="upload-img-tip">尺寸要求150px＊150px&nbsp;&nbsp;不大于500KB</em>
        </Form-item>
        <Form-item label="店铺简介：">
            <editor :content="content" @change="updateData"></editor>
        </Form-item>
        <Form-item label="品牌－供应商：">
            <Table :columns="columns1" :data="data1"></Table>
        </Form-item>
        <Form-item>
            <Button type="primary" @click="submit">提交</Button>
        </Form-item>
    </Form>

</template>

<script>

import service from 'shop-service';

const _ = require('lodash');

const makeSubmitShop = () => {
    return {
    };
};

export default {
    created() {
    },
    data() {
        return {
            //店铺简介
            content: '',

            //供应商
            columns1: [
                {
                    title: '品牌',
                    key: 'coupon'
                },
                {
                    title: '供应商',
                    key: 'supplier'
                }
            ],
            data1: [
                {
                    coupon: 'hahahah',
                    supplier: 'hhhhhhhh'
                }
            ]
        };
    },
    methods: {
        updateData(c) {
            this.content = c;
        },

        //上传图片
        uploadImageSuccess: function(attach, file) {
            let colorIndex = attach.goodIndex;
            let imageIndex = attach.imageIndex;

            this.product.goods[colorIndex].goodsImage[imageIndex].imageUrl = file.url;
        },
        uploadImageRemove: function(attach) {
            let colorIndex = attach.goodIndex;
            let imageIndex = attach.imageIndex;

            this.product.goods[colorIndex].goodsImage[imageIndex].imageUrl = '';
        },

        //提交
        beforeSubmit: function() {
            let newShop = makeSubmitShop();

//            newShop.expectSaleTimeStr = this.product.expectSaleTimeStr;
//
//            newShop.sellerGoodsInfoStr = JSON.stringify(this.handleColor());

            return newShop;
        },
        submit: function() {
            let newShop = this.beforeSubmit();

            this.$Loading.start();
            service.saveBaseShopInfo(newShop).then((result) => {
                this.$Loading.finish();

                if (result.code === 200) {
                    this.$Notice.success({
                        title: '修改成功',
                        desc: '该店铺保存成功！'
                    });

                    this.$router.push({name: 'shop'});
                } else {
                    this.$Notice.error({
                        title: '保存错误',
                        desc: result.message
                    });

                }
            });
        }

    }
};
</script>

<style lang="scss" scoped>

    .upload-item {
        float: left;
    }

    .upload-img-tip {
        float: left;
        margin-top: 112px;
        padding-left: 20px;
        color: #c90;
        line-height: 1;
        font-size: 12px;
        font-style: normal;
        font-weight: 500;
    }

    .upload-item-img {
        display: inline-block;
        height: 126px;
        width: 124px;
        border: 2px solid #e8e8e8;
        box-sizing: border-box;
    }

</style>