Smart_platform_ui/src/components/examineApprove/index.vue

<template>
  <div>
    <avue-crud :option="option"
               :table-loading="loading"
               :data="data"
               ref="crud"
               @refresh-change="refreshChange"
               :page.sync="page"
               @on-load="onLoad">
      <template slot-scope="scope" slot="menu">
        <el-button type="text"
                   size="small"
                   plain
                   class="none-border"
                   @click.stop="handleStart(scope.row)">发起
        </el-button>
        <el-button type="text"
                   size="small"
                   plain
                   class="none-border"
                   @click.stop="handleImage(scope.row,scope.index)">流程图
        </el-button>
      </template>
    </avue-crud>
    <div style="margin-left: 90%">
       <span slot="footer" class="dialog-footer" >
          <el-button type="primary"  @click="closeFun()">关 闭</el-button>
  </span>
    </div>
    <el-dialog
      title="请核"
      :visible.sync="dialogPleaseCheck"
      width="600px"
      append-to-body
      :close-on-click-modal="false"
      destroy-on-close
    >
      <examine-start
        :processDefinitionId="processDefinitionId"
        :itemId = "itemId"
        @dialogClose="dialogPleaseCheckClose"
      ></examine-start>
    </el-dialog>
    <el-dialog title="流程图"
               append-to-body
               :visible.sync="flowBox"
               :fullscreen="true">
      <iframe
        :src=flowUrl
        width="80%"
        height="700"
        title="流程图"
        frameBorder="no"
        border="0"
        marginWidth="0"
        marginHeight="0"
        scrolling="no"
        allowTransparency="yes">
      </iframe>
      <span slot="footer"
            class="dialog-footer">
        <el-button @click="flowBox = false">关 闭</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
  import option from './config/startDialog.json'
  import {startList} from "@/api/work/work";
  import examineStart from "@/components/examineApprove/start";
  export default {
    name: "index",
    props: {
      itemId: {
        type: String
      },
      closeFun: {
        type: Function
      }
    },
    components:{
      examineStart
    },
    data(){
      return {
        option:option,
        loading:false,
        data:[],
        page: {
          pageSize: 10,
          pagerCount: 5,
          total: 0,
        },
        dialogPleaseCheck:false,
        processDefinitionId:'',
        //流程图
        flowBox: false,
        flowUrl: '',
        itemId:'',
      }
    },
    created() {

    },
    methods:{
      refreshChange(){

      },
      onLoad(page, params = {}){
        params.mode = '1';
        this.loading = true;
        startList(page.currentPage, page.pageSize,params).then(res => {
          const data = res.data.data;
          this.page.total = data.total;
          this.data = data.records;
        })
        .finally(()=>{
          this.loading = false;
        })
      },
      handleStart(row){
        this.dialogPleaseCheck = true;
        this.processDefinitionId = row.id
      },
      handleImage(row) {
        this.flowUrl = `/api/blade-flow/process/resource-view?processDefinitionId=${row.id}`;
        this.flowBox = true;
      },
      dialogPleaseCheckClose() {
        this.dialogPleaseCheck = false;
        this.closeFun()
      }
    }
  }
</script>
<style scoped>

</style>