<!--
  @description:
  @author: zxl
  @routerPath:
  @date: 2022-12-28 15:21
-->
<template>
  <div>
    <el-dialog
      v-dialogDrag
      :visible.sync="dialogData.flag"
      :close-on-click-modal="false"
      title="app版本"
      width="40vw"
      custom-class="el-dialog__body-p0"
      top="10vh"
    >
      <div class="p16">
        <el-form
          ref="form"
          :model="formData"
          :rules="rules"
          :inline-message="true"
        >
          <table class="from_table">
            <tr>
              <td>
                <el-form-item label="版本序号" prop="versionNum" />
              </td>
              <td colspan="3">
                <el-input v-model="formData.versionNum" maxlength="11" show-word-limit />
              </td>
            </tr>
            <tr>
              <td>
                <el-form-item label="版本编号" prop="versionCode" />
              </td>
              <td colspan="3">
                <el-input v-model="formData.versionCode" maxlength="10" show-word-limit />
              </td>
            </tr>
            <tr>
              <td>
                <el-form-item label="包名" prop="packageName" />
              </td>
              <td colspan="3">
                <el-input v-model="formData.packageName" maxlength="50" show-word-limit />
              </td>
            </tr>

            <tr>
              <td>
                <el-form-item label="是否强制" prop="isMust" />
              </td>
              <td colspan="3">
                <el-radio-group v-model="formData.isMust">
                  <el-radio label="00">
                    否
                  </el-radio>
                  <el-radio label="01">
                    是
                  </el-radio>
                </el-radio-group>
              </td>
            </tr>
            <tr>
              <td>
                <el-form-item label="系统类型" prop="systemType" />
              </td>
              <td colspan="3">
                <el-radio-group v-model="formData.systemType">
                  <template v-for="item in app_system_typeList">
                    <el-radio :key="item.typecode" :label="item.typecode">
                      {{ item.typename }}
                    </el-radio>
                  </template>
                </el-radio-group>
              </td>
            </tr>
            <tr>
              <td>
                <el-form-item label="app安装包" prop="packageUrl" />
              </td>
              <td colspan="3">
                <upload
                  ref="upload"
                  :data="fileData"
                  :auto-delete="true"
                  :auto-upload="true"
                  title=""
                  file-ref="fileRef"
                  class="fl"
                  accept=".apk"
                  :on-success="changeFile"
                />
              </td>
            </tr>
            <tr>
              <td>
                <el-form-item label="版本说明" prop="versionDesc" />
              </td>
              <td colspan="3">
                <el-input
                  v-model="formData.versionDesc"
                  :autosize="{ minRows: 2, maxRows: 4 }"
                  type="textarea"
                  placeholder="请输入内容"
                  maxlength="200"
                  show-word-limit
                />
              </td>
            </tr>
          </table>
        </el-form>
      </div>
      <div slot="footer" class="dialog-footer" style="text-align: center">
        <el-button :loading="confirmLoading" type="primary" @click="sure()">
          确认
        </el-button>
        <el-button @click="dialogData.flag=false">
          取消
        </el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>

import { saveAppVersion } from '../../../api/appManagement/appVersion'
import { randomData } from '../../../assets/js/utils'
import upload from '@comp/common/updownload/upload'
import { downLoadFileUrl2 } from '@/api/common/uploadCenter'

export default {
  components: {
    upload
  },
  props: {
    dialogData: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {
      formData: {
        id: '',
        versionNum: '', //  版本序号
        versionCode: '', // 版本编号
        versionDesc: '', // 版本说明
        packageName: '', // 包名
        isMust: '00',
        systemType: '00', // 系统类型
        packageUrl: '' // app下载地址
      },
      rules: {
        versionNum: [{ required: true, message: '不能为空', trigger: 'blur' }],
        versionCode: [{ required: true, message: '不能为空', trigger: 'blur' }],
        packageName: [{ required: true, message: '不能为空', trigger: 'blur' }]
      },
      confirmLoading: false,
      app_system_typeList: [],
      fileData: {
        fileType: 'app_package_file',
        bizId: ''
      }
    }
  },
  created() {
    if (!this.dialogData.row) {
      this.formData.id = randomData()
    } else {
      this.formData = this.dialogData.row
    }
    this.fileData.bizId = this.formData.id
  },
  methods: {
    // 字典请求
    initGroup() {
      this.$store.dispatch('getGroupType', ['app_system_type']).then((data) => {
        // 遍历key存储相应的数据
        for (const key in data.bidTypeData) {
          /* 是否有数据*/
          if (data.bidTypeData[key]) {
            this[key] = data.bidTypeData[key]
          }
        }
      })
    },
    // 附件上传
    changeFile(file, fileList) {
      const f = fileList[0]
      console.log('ffffff', f)
      this.formData.packageUrl = downLoadFileUrl2 + '?fileId=' + file.data.fileId + '&fileType=' + this.fileData.fileType
      if (f?.fileData?.fileId) {
        /* this.formData.fileId = f?.fileData?.fileId*/

      }
    },
    sure() {
      // 校验输入内容
      this.$refs['form'].validate((valid, field) => {
        if (valid) { // 校验通过
          this.confirmLoading = true
          saveAppVersion(this.formData).then(res => {
            this.confirmLoading = false
            this.$message({
              type: 'success',
              message: '操作成功'
            })
            this.$emit('change', true)
            this.dialogData.flag = false
          }).catch(() => {
            this.confirmLoading = false
          })
        }
      })
    }
  }

}
</script>

<style scoped>

</style>
