<template>
  <el-dialog :close-on-click-modal="false" :close-on-press-escape="false" :modal-append-to-body="false" :title="title"
             :visible.sync="open"
             v-bind="$attrs"
             width="700px"
             @close="onClose"
             @open="onOpen"
             v-on="$listeners"
  >
    <el-form ref="form" :model="form" label-width="120px">
      <el-form-item label="Appid">
        {{ form.applyId }}
        <!--        <el-input v-model="form.applyId" placeholder="请输入APPid" readonly/>-->
      </el-form-item>
      <el-form-item label="APP名称">
        {{ form.appName }}
        <!--        <el-input v-model="form.appName" placeholder="请输入APP名称" readonly/>-->
      </el-form-item>
      <el-form-item label="选择系统" prop="grayFlag">
        {{ form.systemType }}
        <!--        <el-radio-group v-model="form.systemType">-->
        <!--          <el-radio-button label="android">android</el-radio-button>-->
        <!--          <el-radio-button label="IOS">IOS</el-radio-button>-->
        <!--          <el-radio-button label="HarmonyOS">HarmonyOS</el-radio-button>-->
        <!--        </el-radio-group>-->

        <!--        <div class="tag-group">-->
        <!--          <el-tag :type="form.systemType=='android'?'':'info'" @click="changeSys('android')">安卓</el-tag>-->
        <!--          <el-tag :type="form.systemType=='IOS'?'':'info'" @click="changeSys('IOS')">IOS</el-tag>-->
        <!--          <el-tag :type="form.systemType=='HarmonyOS'?'':'info'" @click="changeSys('HarmonyOS')">鸿蒙</el-tag>-->
        <!--        </div>-->
      </el-form-item>
      <el-form-item v-if="form.systemType!='IOS'" label="安装包" prop="sysApkName">
        {{ form.sysApkName }}
        <!--        <el-input v-model="form.apkId" class="input-with-select" placeholder="请选择包" readonly>-->
        <!--        </el-input>-->
      </el-form-item>
      <el-form-item v-if="form.systemType=='IOS'" label="app store地址" prop="appStoreAddress">

        {{ form.appStoreAddress }}

      </el-form-item>
      <el-form-item label="版本号" prop="version">
        {{ form.version }}
      </el-form-item>
      <el-form-item label="版本说明" prop="versionDesc">
        {{ form.versionDesc }}
      </el-form-item>
      <el-form-item label="发布环境" prop="publishEnvironment">

        <el-select v-model="form.publishEnvironment" disabled>
          <el-option
            v-for="dict in environmentList"
            :key="dict.id"
            :label="dict.name"
            :value="parseInt(dict.id)"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="发布策略" prop="publishStrategy">

        <el-select v-model="form.publishStrategy" disabled>
          <el-option
            v-for="dict in dict.type.release_strategy"
            :key="dict.value"
            :label="dict.label"
            :value="parseInt(dict.value)"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="结果通知" prop="resultNotify">
        <el-switch
          v-model="form.resultNotify"
          :active-value="1"
          :inactive-value="0"
          disabled
        />
      </el-form-item>
      <el-form-item label="公开版" prop="publicVersion">

        <el-switch
          v-model="form.publicVersion"
          :active-value="1"
          :inactive-value="0"
          disabled
        />
      </el-form-item>
      <el-form-item label="强制更新" prop="forceUpdate">
        <el-switch
          v-model="form.forceUpdate"
          :active-value="1"
          :inactive-value="0"
          disabled
        />
      </el-form-item>
      <el-form-item label="下载验证" prop="downloadVerification">
        <el-switch
          v-model="form.downloadVerification"
          :active-value="1"
          :inactive-value="0"
          disabled
        />
      </el-form-item>
      <!--        <el-form-item label="更新对象(-1: 不限制, 白名单id)" prop="updateObject">-->
      <!--      <el-form-item label="更新对象" prop="updateObject">-->

      <!--        <el-select v-model="form.publishStrategy" disabled>-->
      <!--          <el-option-->
      <!--              v-for="dict in dict.type.release_user_type"-->
      <!--              :key="dict.value"-->
      <!--              :label="dict.label"-->
      <!--              :value="parseInt(dict.value)"-->
      <!--          />-->
      <!--        </el-select>-->
      <!--      </el-form-item>-->


      <el-form-item label="有效期" prop="validityStartTime">
        {{ form.validityStartTime }}至{{ form.validityEndTime }}
      </el-form-item>

      <el-form-item label="备注" prop="remark">
        {{ form.remark }}
      </el-form-item>

      <el-form-item label="下载地址：">
        <el-input v-model="form.apkUrl" class="input-with-select" readonly>
          <el-button slot="append" @click="copyIt(form.apkUrl)">复制</el-button>
        </el-input>
      </el-form-item>
      <el-form-item label="发布状态">
        <dict-tag :options="dict.type.release_status" :value="form.status"/>
      </el-form-item>

      <el-form-item label="创建人" prop="created">
        {{ form.created }}
      </el-form-item>

      <el-form-item label="发布时间" prop="validityStartTime">
        {{ form.updateTime }}
      </el-form-item>


    </el-form>
  </el-dialog>
</template>
<script>

import { getPublish } from '@/api/deployment/publish'
import { listEnvironment } from '@/api/deployment/environment'
import { getINFO } from '@/api/FDS/installList'

export default {
  name: 'AddPack',
  dicts: ['release_environment', 'sys_yes_no', 'release_strategy', 'release_user_type', 'release_status'],
  props: {
    detailId: {
      type: String | Number,
      default: ''
    },
    openDetail: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      // 遮罩层
      title: '添加安装包',
      loading: true,
      configName: undefined,
      form: {
        sysApkName: null
      },
      moduleList: [],
      // 显示搜索条件
      showSearch: true,
      total: 0,
      open: true,
      detailIds: '',
      environmentList: [],
      // 白名单配置表单验证
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        sysApkName: null
      },
      queryParamsEnvironment: {
        pageNum: 1,
        pageSize: 999
      }
    }
  },
  watch: {
    detailId: {
      handler: function(val, oldVal) {
        if (val) {
          this.detailIds = val
          this.getPublishList(val)
          this.getEnvironmentList()
        }
      },
      immediate: true
    }
  },
  mounted() {
  },
  methods: {

    /** 查询参数列表 */
    getPublishList(id) {
      this.loading = true
      getPublish(id).then(response => {
        this.form = response.data
        this.getPackList(this.form.apkId)

      })
    },
    /** 查询参数列表 */
    getPackList(id) {
      getINFO(id).then(response => {
        this.form.sysApkName = response.data.sysApkName
        this.$nextTick(() => {
          this.title = '发布详情'
        })
      })
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1
      this.getList()
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.dateRange = []
      this.resetForm('queryForm')
      this.handleQuery()
    },
    /** 查询环境维护列表 */
    getEnvironmentList() {
      this.loading = true
      listEnvironment(this.queryParamsEnvironment).then(response => {
        this.environmentList = response.rows
      })
    },
    /** 新增当前包的按钮 */
    addPack(id, version, sysType) {
      this.$emit('addPack', {
        apkId: id,
        version: version,
        sysType: sysType
      })
    },

    onOpen() {
      this.active = this.current
      this.key = ''
    },
    onClose() {
      this.$emit('close')
    },
    //   选择系统做一些逻辑判断
    changeSys(sysType) {
      this.form.systemType = sysType
    },
    copyIt(url) {
      navigator.clipboard.writeText(url)
      this.$message.success('复制成功')
    }
  }
}
</script>
<style lang="scss" scoped>
.tag-group {
  .el-tag {
    cursor: pointer;

  }
}

.el-tag + .el-tag {
  margin-left: 10px
}
</style>

