<template>
	<div class="detail">
        <mt-header class="detail_head" fixed title="分配资产">
            <router-link to="" slot="left">
                <mt-button icon="back" v-on:click="jumpBack()"></mt-button>
            </router-link>
        </mt-header>
        <div class="detailBox textColor">
            资产编号构成：部门编号 + 字母前缀 + 数字序号，字母前缀最多四位，数字序号由系统排序生成
        </div>
        <div class="detailBox">
            <mt-field label="部门编号" placeholder="请输入部门编号" v-model="assetsForm.divisionCode"></mt-field>
            <mt-field label="字母前缀" placeholder="请输入字母前缀" v-model="assetsForm.suffixCode"></mt-field>
        </div>
        <div class="example">示例：Lishui-LXDN0001、Lishui-LXDN0002</div>
        <mt-button class="allBtn" size="large" type="primary" v-on:click.native="submit()">确定</mt-button>
        <mt-button class="allBtn" size="large" v-on:click.native="jumpBack()">取消</mt-button>
    </div>
</template>

<script>
	export default {
		data() {
			return {
                user: JSON.parse(sessionStorage.getItem("user")),
                assetsForm: {
                    goodsId: this.$route.params.id,
                    divisionCode: this.$route.params.divisionCode,
                    suffixCode: this.$route.params.suffixCode,
                },
                canClick: true,
			}
		},
		methods: {
            // 创建
            submit() {
                if(this.canClick) {
                    this.canClick = false;
                    var reg = /^^[A-Za-z]{1,4}$/;
                    if(this.assetsForm.divisionCode == null || this.assetsForm.divisionCode == "") {
                        this.$toast({
                            message: '请输入部门编号',
                            duration: 2000
                        });
                        this.canClick = true;
                        return false;
                    } else if(this.assetsForm.suffixCode == null || this.assetsForm.suffixCode == "") {
                        this.$toast({
                            message: '请输入字母前缀',
                            duration: 2000
                        });
                        this.canClick = true;
                        return false;
                    } else if(!reg.test(this.assetsForm.suffixCode)) {
                        this.$toast({
                            message: '请输入不多于四位字母前缀',
                            duration: 2000
                        });
                        this.canClick = true;
                        return false;
                    } else {
                        this.$indicator.open();
                        var _this = this;
                        this.http.post( this.port.assets.distribute, this.assetsForm,
                        res => {
                            this.$indicator.close();
                            if (res.code == "ok") {
                                this.$toast({
                                    message: '修改成功',
                                    duration: 2000
                                });
                                setTimeout(function(){
                                    _this.$router.go(-1);
                                }, 1000);
                            } else {
                                this.canClick = true;
                                this.$toast({
                                    message: res.msg,
                                    duration: 2000
                                });
                            }
                        },
                        error => {
                            this.canClick = true;
                            this.$indicator.close();
                            this.$toast({
                                message: error,
                                duration: 2000
                            });
                        });
                    }
                } else {
                    this.$toast({
                        message: '请勿重复提交',
                        duration: 2000
                    });
                }
            },

            jumpBack() {
                this.$router.go(-1);
            }
        },
        created() {
        },
		mounted() {
            
		}
	}

</script>

<style scoped>
    .detail_head {
        background: #fff;
        color: #333;
        height: 0.4rem;
    }

    .detail_body {
        margin-top: 0.4rem;
        padding-bottom: 0.15rem;
    }

    .detail {
        background: #EFEFEF;
        overflow: hidden;
    }

    .detailBox {
        background: #fff;
        margin-bottom: 0.11rem;
    }

    .left{
        float:left;
        margin: 0.15rem;
    }

    .upload .left {
        margin: 0.1rem 0.11rem;
    }

    .right div{
        line-height: 0.21rem;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .btn {
        width: 80%;
        margin: 0.2rem auto 80px;
    }

    .allocation {
        width: 100%;
        height: 100%;
    }

    .address_first .current{
        background:#eee;
        color: #6f83ff;
        border-left: 2px solid #6f83ff;
    }

    .right > ul {
        margin: 0;
        padding: 0;
        overflow: auto;
        -webkit-transition-duration: 0.4s;
        box-sizing:border-box;
        padding: 0.08rem 0.1rem;
    }

    .right > ul > li {
        display: inline-block;
        height: 0.2rem;
        line-height: 0.2rem;
        font-size: 0.14rem;
        color: #ccc;
        padding: 0 0.12rem;
        margin: 0.06rem 0.03rem;
        border: 1px solid #ccc;
        border-radius: 50px;
        min-width: 0.3rem;
        text-align: center;
    }

    .right > ul > li.add {
        border: 1px solid #777;
        color: #777;
    }
    
    .right > ul > li.active {
        border: 1px solid #2680EB;
        color: #2680EB;
    }

    .upload_add {
        display: inline-block;
        margin-bottom: 0.2rem;
    }

    .upload_add_image {
        padding-top: 0.08rem;
        margin: 0.15rem 0 0 0.3rem ;
        width: 1rem;
        height: 0.9rem;
        border: 1px dashed rgba(0, 0, 0, .2);
    }

    .upload_add-image .camera {
        font-size: 24px;
    }

    .upload_add_image p {
        padding: 0;
        margin: 0;
        color: #8e8e8e;
    }

    .right div img.pic {
        width: 0.8rem;
        height: 0.8rem;
        margin: 0.15rem 0 0 0.3rem ;
    }

    .textColor {
        margin-top: 0.4rem;
        color: #8e8e8e;
        padding: 0.12rem;
        font-size: 0.12rem;
    }

    .example {
        color: #8e8e8e;
        padding: 0.02rem 0.12rem;
        font-size: 0.12rem;
    }

    .allBtn {
        width: 80%;
        margin: 0.18rem auto;
    }
</style>
<style>
    .detail_head .mint-header-title {
        font-weight: 600;
        font-size: 0.15rem;
    }

    .detail_head .mint-button-text {
        color: #26a2ff;
    }

    .detailBox .mint-cell {
        padding: 0 0 0 0.02rem;
    }
    
    .mint-popup.allocation  {
        background: #efefef;
    }

    .mint-msgbox {
        width: 70%;
    }

    .mint-cell-wrapper {
        background-image: none;
    }
</style>