<template>
    <van-overlay :show="show" @click="show = false" :lock-scroll="false" z-index="99">
        <div class="content" ref="content" @click.stop="">
            <div>
                <div class="align-center">拉索宇宙华储艺术品中心委托拍卖协议</div>
                <h4>委托方（以下简称“甲方”）：{{ identityAuthInfo.realName }}</h4>
                <h3>身份证号：{{ identityAuthInfo.idNo }}</h3>
                <h3>联系电话：{{ identityAuthInfo.phone }}</h3>
                <h4>拍卖方 (以下简称“乙方”)：华储艺术品中心（深圳）有限公司</h4>
                <h5>鉴于：</h5>
                <p>
                    1、甲方系本协议约定拍卖品的所有人或受所有人全权委托而签署和履行本协议。<br />
                    2、乙方系具有合法拍卖资质和拍卖经验的拍卖企业，愿意接受委托进行拍卖。<br />
                    3、本协议构成甲乙双方之间委托拍卖合同关系。<br />
                    为此，甲乙双方依照《拍卖法》、《民法典》等法律法规的规定，于本协议网络签署日在深圳市福田区达成协议如下：
                </p>
                <h5>一、委托关系</h5>
                <p>
                    1、乙方系接受甲方委托按照乙方的拍卖程序，通过拉索宇宙APP对外公开拍卖，但乙方对拍卖成交不承担保证责任，也不对竞买人的支付能力承担担保责任。<br />
                    2、甲方知晓并认可乙方的拍卖程序，并愿意按照乙方的拍卖程序进行拍卖和拍卖交割，由其对拍卖交易的后果承担全部法律责任。
                </p>
                <h5>二、拍卖品</h5>
                <p>
                    1、甲方委托乙方拍卖的标的：本数字艺术作品。<br />
                    2、甲方保证其对拍卖标的拥有完全所有权及处分权或者得到了所有权人的完全授权。<br />
                    3、甲方就拍卖品的合法性向乙方承诺：<br />
                    （1）拍卖品来源合法，非盗抢等赃物、非走私物等其他非法物品。<br />
                    （2）拍卖品不存在权属争议，也未设定抵押或质押或留置等负担。<br />
                    （3）拍卖品不存在侵犯他人版权、肖像权等合法权利的情形。<br />
                    4、甲方承诺：根据乙方的要求提供拍卖标的的有关证明和资料，说明知道或应当知道的拍卖标的瑕疵；如参与竞买人对拍卖品提出疑问或异议，甲方应及时予以说明或澄清；甲方对于前述提供的证明、资料及相关说明、澄清等，均保证其真实性，不得弄虚作假。
                </p>
                <h5>三、拍卖安排</h5>
                <h5>1、拍卖前的评估、鉴定：</h5>
                <p>
                    （1）甲方应合理对标的拍卖商品进行合理评估，不得恶意炒作，不得恶意哄抬价格，不得故意进行“托价”行为。<br />
                    （2）竞买人拍得拍卖品后，如委托评估或鉴定机构进行价值评估或相应鉴定，或者其评估、鉴定结论与甲方在拍卖前进行的评估或鉴定结论不符，由甲方与竞买人协商或按照法律规定处理，乙方与此无关，若因此造成乙方损失，甲方负责赔偿。
                </p>
                <h5>2、拍卖期限、地点：</h5>
                <p>
                    双方确认：拍卖品通过乙方自有APP或网站，以网络方式向竞买人拍卖。拍卖时间为立即拍卖或由双方另行协商确认，或乙方按其相关安排自主确定拍卖时间。
                </p>
                <h5>3、拍卖价格：</h5>
                <p>
                    （1）保留价：拍卖品的保留价由甲方在拍卖前确定，乙方可对保留价的确定提供相关意见。<br />
                    （2）竞买人的最高应价未达到保留价时，乙方不得确认成交。<br />
                    （3）甲方可自行设置拍卖标的拍卖一口价，同时，甲方授权乙方随时调整拍卖标的的最高可售价格而无需另行取得甲方同意。
                </p>
                <h5>4、拍卖品的产权转移：</h5>
                <p>
                    （1）拍卖一旦成交，视为甲方对拍卖结果及拍卖价格无异议。<br />
                    （2）拍卖成交后，拍卖标的将由拉索宇宙APP自动转移至买受人。<br />
                    （3）拍卖成交后，拍卖所得款项在扣除乙方及拉索宇宙APP应得款项后，在T+1个工作日支付至甲方指定的银行账户内。
                </p>
                <h5>5、特别承诺：</h5>
                <p>
                    （1）甲方承诺：自己不参与竞买，也不委托他人代为参与竞买拍卖品。<br />
                    （2）任何一方不得擅自变更拍卖品的保留价，乙方也不得低于保留价拍卖。<br />
                    （3）乙方不得转委托而将拍卖品委托其他人进行拍卖。
                </p>
                <h5>6、拍卖的佣金与费用：</h5>
                <p>双方确认，拍卖佣金为拍卖成交价的2.5%的佣金。该佣金在甲方向拉索宇宙APP支付的5%的平台服务费中扣除。</p>
                <h5>7、拍卖品的撤回与撤除：</h5>
                <p>
                    （1）甲方在拍卖开始前可以在拉索宇宙APP上取消对拍卖品的拍卖委托并撤回拍卖品。但若因此造成乙方或他方损失的，乙方应承担全部赔偿责任。<br />
                    （2）乙方有确切证据证明拍卖标的存在下列情况之一的，有权单方解除本协议，撤销对拍卖品的拍卖，并不承担由此产生的法律责任：<br />
                    ① 拍卖品的来源不合法或与甲方承诺不符。<br />
                    ② 拍卖品权属存在争议或权属状况与甲方声明不一致的。<br />
                    ③ 拍卖品非真品或存在甲方未声明的重大瑕疵的。
                </p>
                <h5>8、终止委托：</h5>
                <p>
                    （1）本合同本协议因下列情形之一，终止委托且本合同本协议终止，但如有违约责任或未结清事项，则应在合同终止前承担违约责任或结清相关事项。<br />
                    ① 流拍。<br />
                    ② 拍卖成交。 <br />
                    ③ 甲方撤销委托、撤回拍卖品。<br />
                    ④ 乙方认为本次委托无效或因本合同本协议被依法或依约解除。<br />
                    （2）因流拍致使拍卖标的未能售出的，本合同本协议终止；如甲乙双方愿意再次拍卖，则另行续签合同。
                </p>
                <h5>四、其他事项：</h5>
                <p>
                    1、违约责任：<br />
                    （1）甲乙双方在本协议执行过程中，任何一方不履行协议、违反本协议条约内容，即为违约，且应承担违约责任。<br />
                    （2）甲方隐瞒拍卖品的瑕疵或拍卖品的权属瑕疵，应赔偿由此给乙方造成的损失。<br />
                    （3）甲方参与竞买或委托他人代为竞买自己委托的拍卖品的、甲方故意恶意炒作价格的、甲方进行“托价”行为的，乙方有权制止甲方的相应行为或向有关行政机关举报，并解除合同；甲方对乙方由此受到的损失应承担赔偿责任。<br />
                    2、争议解决：双方因本协议的解释或履行发生争议，应先由双方协商解决。如协商不成，双方任何一方可向乙方所在地人民法院提起诉讼。<br />
                    3、本协议为电子方式签署。自甲方点击“我已阅读且同意签署”按钮即视为协议生效。<br />
                    4、甲方联络方式为其在乙方拉索宇宙APP上所确认之联系方式，若甲方变更联络方式的，应及时通过乙方拉索宇宙APP修改或变更。
                </p>

                <h4>甲方（签章）：{{ identityAuthInfo.realName }}</h4>
                <h3>签订日期：{{ date }}</h3>
                <h4>乙方（签章）：华储艺术品中心（深圳）有限公司</h4>
                <h3>签订日期：{{ date }}</h3>
                <h3>签约地点：中国深圳福田区</h3>

                <h5>
                    本人自愿委托华储进行《{{ info.name }}》，<span v-if="info.number">编号{{ info.number }}</span
                    >的拍卖。
                </h5>

                <div class="btn">
                    <van-button type="primary" round block @click="sure">我已阅读且完全理解</van-button>
                </div>
            </div>
        </div>
    </van-overlay>
</template>

<script>
import { mapState } from 'vuex';
export default {
    computed: {
        ...mapState(['userInfo'])
    },
    props: {
        info: {
            type: Object,
            default: () => {
                return {};
            }
        }
    },
    data() {
        return {
            identityAuthInfo: {},
            date: '',
            show: false
        };
    },
    mounted() {
        this.$http
            .post(
                '/identityAuth/all',
                {
                    query: {
                        userId: this.userInfo.id
                    }
                },
                { body: 'json' }
            )
            .then(res => {
                if (!res.empty) {
                    this.identityAuthInfo = res.content[0];
                }
            });
        this.date = this.dayjs().format('YYYY年MM月DD日');
    },
    methods: {
        sure() {
            this.show = false;
            this.$emit('agree');
        },
        init() {
            this.show = true;
            this.$refs.content.scrollTop = 0;
        }
    }
};
</script>

<style lang="less" scoped>
.content {
    background: @bg;
    border-radius: 8px;
    padding: 16px;
    width: 80vw;
    height: 60vh;
    overflow: auto;
    z-index: 100;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-overflow-scrolling: touch;
    .align-center {
        font-size: @font3;
        font-weight: bold;
        text-align: center;
        margin: 0;
        padding-bottom: 10px;
    }
    p {
        font-size: @font2;
        margin: 6px 0 0;
        color: @text3;
    }

    h4,
    h5,
    h6 {
        font-size: @font2;
        margin: 20px 0 0;
    }
    h3 {
        font-size: @font2;
        margin: 0 0 0;
    }
}

.btn {
    margin: 10px 20px 20px;
}
</style>
