<template>
  <el-container>
    <div id="repositoryInfoVersion" style="height: 500px;width: 100%;">
      <el-table
              v-if="tableData.length > 0"
              id="table"
              :data="tableData"
              header-cell-class-name="header-cell-row"
              height="500px"
              style="width: 100%">
        <el-table-column
                prop="versionNo"
                label="版本号"
                align="center"
                width="70">
        </el-table-column>
        <el-table-column
                prop="name"
                label="文件名称"
                min-width="180">
        </el-table-column>
        <el-table-column
                prop="address"
                align="center"
                label="创建信息"
                min-width="160">
          <template slot-scope="scope">
            {{scope.row.createUser}}/{{scope.row.createDate}}
          </template>
        </el-table-column>
        <template v-if="!isCorrelatebpms">
          <el-table-column
                  prop="state"
                  label="状态"
                  align="center"
                  width="80">
        <span slot-scope="scope" :style="{'color': scope.row.stateColor}">
          {{scope.row.state}}
        </span>
          </el-table-column>
        </template>
        <template v-else>
          <el-table-column
                  prop="state"
                  label="PAL状态"
                  align="center"
                  width="80">
        <span slot-scope="scope" :style="{'color': scope.row.stateColor}">
          {{scope.row.state}}
        </span>
          </el-table-column>
          <template v-if="isPalManage">
            <el-table-column
                    prop="state"
                    label="在BPM运行"
                    align="center"
                    width="100">
        <span slot-scope="scope">
          {{(scope.row.isCorrelate ? "是" : "否")}}
        </span>
            </el-table-column>
          </template>
          <template v-else>
            <el-table-column
                    prop="state"
                    label="BPM状态"
                    align="center"
                    width="80">
        <span slot-scope="scope" :style="{'color': scope.row.bpmStateColor}">
          {{scope.row.bpmState}}
        </span>
            </el-table-column>
          </template>
        </template>
        <el-table-column
                v-if="havingVersionManagePerm && tableData.length > 1"
                prop="name"
                label="使用"
                align="center"
                width="80">
          <template slot-scope="scope">
            <el-switch
                    style="display: block"
                    v-model="scope.row.isUse"
                    active-color="#4E7FF9"
                    inactive-color="#E2E2E2"
                    @change="changeRepositoryUseStatus(scope.row.id, scope.row.isUse)">
            </el-switch>
          </template>
        </el-table-column>
        <el-table-column
                prop="address"
                align="center"
                label="操作">
          <template slot-scope="scope">
<!--            <el-tooltip content="以当前版本为模版创建新版本文件" placement="bottom" hide-after="3000">-->
              <i v-if="havingWritePerm" class="iconfont icon-fuzhi operate-icon-display" style="cursor: pointer;" @click="createNewVersion(scope.row.id, scope.row.versionNo)"></i>
<!--            </el-tooltip>-->
            <i v-if="havingRemovePerm && !isCorrelatebpms && !scope.row.isUse && !scope.row.isPublish && !scope.row.isApproval" class="iconfont icon-lajitong1 operate-icon-display" style="cursor: pointer;padding-left: 5px;" @click="deleteRepository(scope.row.id, scope.row.versionNo)"></i>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <el-dialog
        id="addNewVersionDialog"
        title="提示"
        width="500px"
        :visible.sync="addNewVersionVisible"
        top="45vh"
        :modal-append-to-body=true
        :close-on-click-modal=false
        :append-to-body=true
        destroy-on-close
    >
      <span>请选择以{{ currentVersion }}版本为模板创建的新文件版本号:</span></br>
      <el-radio-group style="margin-top: 10px" v-model="isLargeIteration">
        <el-radio :label=true>大版本</el-radio></br>
        <el-radio style="margin-top: 5px" :label=false>小版本</el-radio>
      </el-radio-group>
      <span slot="footer">
          <awsui-button class="button-general-color" type="primary" @click="confirmAddVersion">确定</awsui-button>
          <awsui-button @click="cancelAddVersion">取消</awsui-button>
       </span>
    </el-dialog>
  </el-container>
</template>

<script>
    import awsuiAxios from "../../awsuiAxios";

    export default {
      name: "RepositoryInfoVersion",
      props: {
        id: {
          type: String,
          default: ''
        },
        versionId: {
          type: String,
          default: ''
        },
        repositoryRefresh: {
          type: Function,
          default: null
        }
      },
      data() {
        return {
          userId: '',// 使用版本的id
          tableData: [],
          isCorrelatebpms: false,
          processDefId: '',
          isPalManage: false, // 以PAL为管理中心管控BPM流程，
          havingWritePerm: false,
          havingRemovePerm: false,
          havingVersionManagePerm: false,
          addNewVersionVisible: false,
          currentVersion: '',
          currentId: '',
          isLargeIteration: true
        }
      },
      created() {
        this.userId = this.id;
        this.initData();
      },
      methods: {
        initData() {
          const that = this;
          const data = {
            url:'jd',
            data:{
              cmd: 'com.actionsoft.apps.coe.pal_pl_repository_designer_version_manager_data',
              id: that.userId,
              wsId: that.$store.getters.getWsIdFn,
              teamId: that.$store.getters.getTeamIdFn
            }
          };
          // 查询数据
          awsuiAxios.post(data).then(function (ro) {
            if(ro.result == 'ok') {
              that.isCorrelatebpms = ro.data.isCorrelatebpms;
              that.processDefId = ro.data.processDefId;
              that.isPalManage = ro.data.isPalManage;
              that.havingWritePerm = ro.data.havingWritePerm;
              that.havingRemovePerm = ro.data.havingRemovePerm;
              that.havingVersionManagePerm = ro.data.havingVersionManagePerm;
              for (let i = 0; i < ro.data.tableData.length; i++) {
                if (ro.data.tableData[i].isApproval) {
                  ro.data.tableData[i].stateColor = '#1AA477';
                  ro.data.tableData[i].state = '审批中';
                  ro.data.tableData[i].stateCode = 'approval';
                } else if (ro.data.tableData[i].isStop) {
                  ro.data.tableData[i].stateColor = '#D9001B';
                  ro.data.tableData[i].state = '已停用';
                  ro.data.tableData[i].stateCode = 'stop';
                } else if (ro.data.tableData[i].isPublish) {
                  ro.data.tableData[i].stateColor = '#1AA477';
                  ro.data.tableData[i].state = '已发布';
                  ro.data.tableData[i].stateCode = 'publish';
                } else if (ro.data.tableData[i].isUse) {
                  ro.data.tableData[i].stateColor = '#4E7FF9';
                  ro.data.tableData[i].state = '设计中';
                  ro.data.tableData[i].stateCode = 'use';
                } else {
                  ro.data.tableData[i].stateColor = '';
                  ro.data.tableData[i].state = '设计';
                  ro.data.tableData[i].stateCode = 'designer';
                }
              }
              that.tableData = ro.data.tableData;
            } else {
              that.$message.error(ro.msg);
            }
          }).catch(error=>{
            console.log(error);
          })
        },
        changeRepositoryUseStatus(id, isUse) {// 使用中状态变更
          const that = this;
          if (isUse) {// 由未使用变更为使用中，重新刷新数据即可
            // 变更使用状态axiox请求，成功后刷新父页面树和右侧
            let oldId;
            for (var currRowData in that.tableData) {
              if (that.tableData[currRowData].isUse && that.tableData[currRowData].id != id) {
                oldId = that.tableData[currRowData].id;
                break;
              }
            }
            // 全局遮罩
            const loading = that.$loading({
              lock: true,
              text: '正在切换更新版本...',
              spinner: 'el-icon-loading',
              background: 'hsla(0,0%,100%,.9)'
            });
            const data = {
              url:'jd',
              data:{
                cmd: 'com.actionsoft.apps.coe.pal_pl_repository_designer_version_manager_use',
                id: id,
                wsId: that.$store.getters.getWsIdFn,
                teamId: that.$store.getters.getTeamIdFn
              }
            };
            // 查询数据
            awsuiAxios.post(data).then(function (ro) {
              if(ro.result == 'ok') {
                that.$message({
                  message: '切换成功',
                  type: 'success'
                });
                that.userId = ro.data.id;
                that.initData();
                loading.close();
                // 更新父页面的当前使用模型文件
                if (that.repositoryRefresh && oldId) {
                  that.repositoryRefresh(oldId);
                }
              } else {
                loading.close();
                that.$message(ro.msg);
              }
            }).catch(error=>{
              console.log(error);
            })
          } else {// 由使用中变更为非使用中，必须有一个为使用中
            for (var currRowData in that.tableData) {
              if (that.tableData[currRowData].id == id) {
                that.tableData[currRowData].isUse = true;
              }
            }
          }
        },
        createNewVersion(id, versionNo) {// 复制/创建新版本
          this.addNewVersionVisible = true
          this.currentVersion = versionNo
          this.currentId = id
        },
        confirmAddVersion() {
          // 全局遮罩
          const loading = this.$loading({
            lock: true,
            text: '正在创建新版本...',
            spinner: 'el-icon-loading',
            background: 'hsla(0,0%,100%,.9)'
          });
          const data = {
            url:'jd',
            data:{
              cmd: 'com.actionsoft.apps.coe.pal_pl_repository_designer_version_manager_create',
              id: this.currentId,
              wsId: this.$store.getters.getWsIdFn,
              teamId: this.$store.getters.getTeamIdFn,
              isLargeIteration: this.isLargeIteration
            }
          };
          // 查询数据
          awsuiAxios.post(data).then(ro => {
            if(ro.result == 'ok') {
              this.$message({
                message: '创建成功',
                type: 'success'
              });
              this.initData();
              loading.close();
              this.isLargeIteration = true
              this.addNewVersionVisible = false
            } else {
              loading.close();
              this.$message(ro.msg);
            }
          }).catch(error=>{
            console.log(error);
          })
        },
        cancelAddVersion() {
          this.isLargeIteration = true
          this.addNewVersionVisible = false
        },
        deleteRepository(id, versionNo) {// 删除
          const that = this;
          that.$confirm('确定要删除吗？', '提示', {
            confirmButtonText: '确定',
            confirmButtonClass: 'button-general-color',
            cancelButtonText: '取消',
            type: 'warning'
          }).then(() => {
            // 全局遮罩
            const loading = that.$loading({
              lock: true,
              text: '正在放入回收站...',
              spinner: 'el-icon-loading',
              background: 'hsla(0,0%,100%,.9)'
            });
            const data = {
              url:'jd',
              data:{
                cmd: 'com.actionsoft.apps.coe.pal_pl_repository_designer_version_manager_delete',
                id: id,
                wsId: that.$store.getters.getWsIdFn,
                teamId: that.$store.getters.getTeamIdFn
              }
            };
            // 查询数据
            awsuiAxios.post(data).then(function (ro) {
              if(ro.result == 'ok') {
                that.$message({
                  message: '已放入回收站',
                  type: 'success'
                });
                that.initData();
                loading.close();
              } else {
                loading.close();
                that.$message(ro.msg);
              }
            }).catch(error=>{
              console.log(error);
            })
          }).catch(() => {
          });
        }
      }
    }
</script>

<style scoped>
  #table >>> .header-cell-row {
    background-color: #F2F2F2 !important;
  }
  #table >>> .el-table__row .operate-icon-display{
    display: none;
  }
  #table >>> .el-table__row:hover .operate-icon-display{
    display: inline-block;
  }
  #addNewVersionDialog  >>> .el-dialog__body {
    padding: 10px 20px;
    color: #606266;
    font-size: 14px;
    word-break: break-all;
    cursor: pointer;
  }
</style>
