<template>
  <div>
    <a-row>
      <a-col :span="3" :offset="1" v-for="list in dataSource">
        <a-card :title="list.Name" style="min-width: 220px;height: 200px">
          <div style="display: flex;margin-top: 80px">
            <a-button type="primary" style="width: 60%" @click="flowImg(list.Id)">
              查看流程
            </a-button>
            <!--            <a-button style="width: 60%;margin-left: 10px" @click="startflow(list.Id)">-->
            <!--              发起流程-->
            <!--            </a-button>-->
            <a-popconfirm
              title="确定要发起流程?"
              ok-text="确定"
              cancel-text="取消"
              @confirm="startflow(list.Id,list.Key)"
              @cancel="cancel()"
            >
              <a-button style="width: 60%;margin-left: 10px">
                发起流程
              </a-button>
            </a-popconfirm>
          </div>
        </a-card>
      </a-col>
    </a-row>
    <a-modal
      title="流程图"
      :visible="visible"
      :confirm-loading="confirmLoading"
      @ok="handleOk"
      @cancel="handleCancel"
    >
      <img :src="imgsrc" alt="">
    </a-modal>
    <a-modal
      title="表单详情"
      :visible="visiblejson"
      :confirm-loading="confirmLoading"
      @ok="handleOkjson"
      @cancel="handleCanceljson"
    >
      <template>
        <div>
          <fm-generate-form
            @on-change="changeValue"
            :data="jsonData"
            :value="editData"
            ref="generateForm"
          >
          </fm-generate-form>
        </div>
      </template>
    </a-modal>
    <basic-form ref="BasicForm"></basic-form>
    <basic-form1 ref="BasicForm1"></basic-form1>
  </div>

</template>

<script>
import {getAction, deleteAction, httpActionBlob, banli} from '@/api/manage'
import { mixinDevice } from '@/utils/mixin'
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import ActivitiFileModel from './ActivitiFileModel'
import { getModelList } from '@/api/activiti/activiti'
import BasicForm from "@views/examples/form/BasicForm";
import BasicForm1 from "@views/examples/form/BasicForm1";
export default {
  name: 'ActivitiCommonModel',
  mixins: [JeecgListMixin, mixinDevice],
  components: {
    BasicForm1,
    BasicForm
  },
  data() {
    return {
      comName:'BasicForm',
      url: {
        list: 'service/act/rep/actRepList',//常用流程列表
        getPic: "service/act/showResourceForProc",//查看流程图 72502
        sflow: 'service/act/beforeStartProc',//发起流程
        rs: 'service/act/startProc',
        getjson: 'service/act/beforeStartProc'
      },
      dataSource: [],
      visible: false,
      confirmLoading: false,
      imgsrc: '',
      visiblejson: false,
      jsonData: {},
      editData: {
      },
      currentKey:'',
    }
  },
  created() {
    this.getDataList();
  },
  methods: {
    cancel(){

    },
    startflow(id,key){
      this.currentKey = key;
      this.loading = true;
      let p = {};
      p.pdid = id;
      getModelList(this.url.getjson, p).then(res => {
        //console.log('查询数据;返回的表单路径', res.result);
        this.loading = false;
        if(res.code == "200"){
          this.jsonData = JSON.parse(res.result);
          this.visiblejson= true;
        }
      })
      // getModelList(this.url.sflow, p).then(res => {
      //   console.log('查询数据;返回的表单路径', res.result);
      //   this.loading = false;
      //   if(res.result==="BasicForm"){
      //     this.$refs.BasicForm.visible= true;
      //   }else if(res.result==="BasicForm1"){
      //     this.$refs.BasicForm1.visible= true;
      //   }else{
      //     this.$refs.BasicForm.visible= true;
      //   }
      // })
    },
    flowImg(id){
      this.visible = true;
      this.loading = true;

      let method = "GET";
      let p = {};
      p.pdid = id;
      httpActionBlob(this.url.getPic + "?pdid=" + id,null, method).then((res)=>{
        console.log(res)
        let currentMimeType = "image/png";
        let blob = new Blob([res], {
          type: currentMimeType,
        });
        this.imgsrc = window.URL.createObjectURL(blob)


      }).finally(() => {

      })
    },
    handleOk(e) {
      this.confirmLoading = true;
      setTimeout(() => {
        this.visible = false;
        this.confirmLoading = false;
      }, 2000);
    },
    handleCancel(e) {
      console.log('Clicked cancel button');
      this.visible = false;
    },
    changeValue(field,value,data){
      this.editData = data;
      console.log('----' + JSON.stringify(this.editData))
    },
    handleOkjson(e) {
      this.loading = true;
      let p = {};
      p.procKey = this.currentKey;
      p.businessKey = '1';
      p.formData = JSON.stringify(this.jsonData);
      p.formDataValue = JSON.stringify(this.editData);
      getModelList(this.url.rs, p).then(res => {
        this.$message.success(res.message);
        this.visiblejson = false;
        //console.log('查询数据', res);
        this.loading = false;
      })
    },
    handleCanceljson(e) {
      console.log('Clicked cancel button');
      this.visiblejson = false;
    },
    // 查询
    getDataList() {
      this.loading = true;
      getModelList(this.url.list).then(res => {
        //console.log('查询数据', res);
        this.dataSource = res.result;
        this.loading = false;
      })
    },
  }
}
</script>

<style lang="less" scoped>
/deep/.ant-card-body {
  padding: 12px;
}
/deep/.ant-modal {
  width: 70% !important;
}
</style>
