<template>
  <div>
    <div class="content-head">
      <dataBreadcrumb :breads="breads"></dataBreadcrumb>
      <h3>签署合同</h3>
      <h5>签署合同</h5>
    </div>
    <div class="content">
      <div class="flex">
        <div>下载合同：</div>
        <ul>
          <li class="flex">
            <div>合同名字.pdf</div>
            <el-button size="mini">下载</el-button>
          </li>
        </ul>
      </div>
      <div class="contractContent flex-center">
        <h1>合同内容</h1>
      </div>
      <div class="button flex-center">
        <el-button @click="revoke">撤销签章</el-button>
        <el-button>电子签章</el-button>
      </div>
    </div>
    <div class="bottomButton">
      <el-button @click="back">取消</el-button>
      <el-button type="primary">提交</el-button>
    </div>
  </div>
</template>

<script>
import dataBreadcrumb from '@components/dataBreadcrumb.vue'
export default {
  components: {
    dataBreadcrumb
  },
  data() {
    return {
		 breads: ['应收账款买断管理', '应收账款买断列表']
    }
  },
  methods: {
    back() {
      this.$router.go(-1)
    },	// 删除操作
    revoke(row, index) {
      // 二次确认删除
      this.$confirm('该操作撤销全部电子签章，你还要继续吗？', '是否撤销电子签章', {
        type: 'warning'
      })
        .then(() => {
          this.$message.success('撤销成功')
        })
        .catch(() => {})
    }
  }

}
</script>

<style scoped>
	.contractContent{
		width: 100%;
		height: 500px;
		border:1px solid #000000;
		margin-top: 30px;
	}
	.button{
		margin-top: 30px;
		height: 50px;
		width: 100%;
	}
	ul>li>div{
		margin-right: 10px;
	}
</style>
