弹窗确定后在弹列表

需求描述

以前点击重印申请就可以根据条件打开用户可选择的数据列表。现在要加一个提示，以弹窗做提示，如果用户点击“确定”可弹出原来的数据列表，取消则返回。

页面的前端vue代码一

<el-row :gutter="10" class="mb8">
  <el-col :span="1.5">
    <el-button type="success" size="medium">
      <xuanTiList
        @goToXXX="goToXXX"
        @on-click="alert(1)"
      >XX申请</xuanTiList
      >
    </el-button>
  </el-col>
</el-row>

页面的前端vue代码二（没修改前）

<el-dialog title="选择XX号" :visible.sync="open" width="95%" append-to-body :close-on-click-modal="false">
  ……
</el-dialog>
<div @click="open = true" slot="suffix" icon="el-icon-search">

修改方案

1、在打开的页面中添加confirm弹窗

handleTiShi(){
  let _this = this;
  this.$confirm('……沟通，如意见一致<span style=\'color:red;\'>走市场正常报印流程</span>，如意见不一致则再由……', '提示', {
    confirmButtonText: '重印申请',
    cancelButtonText: '取消',
    dangerouslyUseHTMLString: true,
    customClass: 'messageBox',
    type: 'warning'
  }).then(() => {
    _this.get();
    _this.getList();
    _this.open = true;
  });
},

2、不在使用created()调用列表，使用methods，在里面改为_this.get()和 _this.getList();
3、在弹窗中修改true值，先弹窗，后打开dialog这个子页面
<div @click="handleTiShi" slot="suffix" icon="el-icon-search">
完成