<template>
  <div class="addPage">
    <div class="formBox">
      <a-form :form="form" @submit="handleSubmit">
        <a-row>
          <a-col :span="24">
            <a-form-item
              :label-col="formItemLayout.labelCol"
              :wrapper-col="formItemLayout.wrapperCol"
              label="版本号"
            >
              <a-input
                v-decorator="[
                  'formData.version',
                  { initialValue: formData.version,
                    rules: [{ required: true, message: '请输入版本号' }]
                  },
                ]"
				id="addEditionSetting-version"
                placeholder="请输入版本号"
              />
            </a-form-item>
          </a-col>
          <a-col :span="24">
            <a-form-item
              :label-col="formItemLayout.labelCol"
              :wrapper-col="formItemLayout.wrapperCol"
              label="请选择更新时间"
            >
              <a-date-picker
                show-time
				id="addEditionSetting-publicDate"
                placeholder="年/月/日 时/分/秒"
                v-decorator="[
                  'formData.publicDate',
                  { initialValue: formData.publicDate,
                    rules: [{required: true, message: '请选择更新时间!' }] },
                ]" />
            </a-form-item>
          </a-col>
          <a-col :span="24">
            <a-form-item
              :label-col="formItemLayout.labelCol"
              :wrapper-col="formItemLayout.wrapperCol"
              label="强制升级"
            >
              <a-radio-group
                name="radioGroup"
				id="addEditionSetting-forceUpgrade"
                @change="onChange"
                v-decorator="[
                  'formData.forceUpgrade',
                  {
                    initialValue: formData.forceUpgrade,
                    rules: [{ required: true, type: 'number', message: '请选择是否强制升级!' }] },
                ]"
              >
                <a-radio :value="1">是</a-radio>
                <a-radio :value="0">否</a-radio>
              </a-radio-group>
            </a-form-item>
          </a-col>
          <a-col :span="24">
            <a-form-item
              :label-col="formItemLayout.labelCol"
              :wrapper-col="formItemLayout.wrapperCol"
              label="下载链接"
            >
              <a-input
                v-decorator="[
                  'formData.downloadUrl',
                  { initialValue: formData.downloadUrl,
                    rules: [{ message: '请输入下载链接' }]
                  },
                ]"
				id="addEditionSetting-downloadUrl"
                placeholder="请输入下载链接"
              />
            </a-form-item>
          </a-col>
          <a-col :span="24">
            <a-form-item
              :label-col="formItemLayout.labelCol"
              :wrapper-col="formItemLayout.wrapperCol"
              label="升级内容"
            >

              <a-textarea
                placeholder="请输入升级内容"
				id="addEditionSetting-upgradeContent"
                auto-size
                v-decorator="[
                  'formData.upgradeContent',
                  { initialValue: formData.upgradeContent,
                    rules: [{ required: true, message: '请输入升级内容' }]
                  },
                ]"
              />
            </a-form-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="24">
            <a-form-item
              label="附件"
              :label-col="formItemLayout.labelCol"
              :wrapper-col="formItemLayout.wrapperCol"
            >
              <div style="display: block;">
                <Upload
                  ref="upfile"
				  id="addEditionSetting-attachment"
                  :maxNums="1"
                  :fileSize="100"
                  v-decorator="[
                    'formData.attachment',
                    { initialValue: formData.attachment,
                      rules: [{ required: true, message: '请上传app安装文件' }]
                    },
                  ]"
                  fileType="application/vnd.android.package-archive"
                  upText="附件上传">
                </Upload>
              </div>
              <div style="line-height: 16px;clear: both;padding-top: 10px;color: #999;">（上传apk格式文件）</div>
            </a-form-item>
          </a-col>
        </a-row>
        <a-form-item :label-col="formTailLayout.labelCol" :wrapper-col="formTailLayout.wrapperCol">
          <a-button htmlType="submit" type="primary" id="addEditionSetting-submit">
            保存
          </a-button>
          <a-button style="margin-left: 20px;" @click="cansel" id="addEditionSetting-cansel">
            返回列表
          </a-button>
        </a-form-item>
      </a-form>
    </div>
  </div>
</template>

<script>
import { Upload } from '@/components'
import { saveItem, editItem } from '@/api/editionSetting.js'
import moment from 'moment'

const formItemLayout = {
  labelCol: { span: 3 },
  wrapperCol: { span: 6 }
}
const formTailLayout = {
  wrapperCol: { offset: 5 }
}
export default {
  name: 'AddeditionSetting',
  components: {
    Upload
  },

  data () {
    return {
      formItemLayout,
      formTailLayout,
      form: this.$form.createForm(this),
      formData: {
        version: '',
        publicDate: null,
        downloadUrl: '',
        forceUpgrade: '0',
        upgradeContent: '',
        attachment: '',

      },
      applyName: 'IT后台',
      applyCode: 'atit',
      mode1: 'time'
    }
  },
  methods: {
    // 保存
    handleSubmit (e) {
      e.preventDefault()
      const _this = this
      this.form.validateFields((err, values) => {
        if (!err) {
          const query = this.$route.query
          const formData = Object.assign({}, this.formData, values.formData, { applyName: 'IT后台' }, { applyCode: 'atit' })
          formData.publicDate = formData.publicDate.format('YYYY-MM-DD HH:mm:ss')
          saveItem(formData).then(res => {
            // console.log(res, 'rrrrrrrrr')
            if (res.status == 200) {
              _this.$message.success(res.message ? res.message : '保存成功')
              _this.$router.push({ name: 'editionSetting_list' })
            } else {
              _this.$message.error(res.message)
            }
          })
        }
      })
    },
    // 返回列表
    cansel () {
      this.$router.push({ name: 'editionSetting_list' })
    },
    // 选择时间
    handleOpenChange1 (open) {
      console.log(open)
      if (open) {
        this.mode1 = 'time'
      }
    },
    // 改变默认选项
    onChange (e) {
      console.log('radio checked', e.target.value)
    }
  },

  beforeRouteEnter (to, from, next) {
    next(vm => {
      console.log(111)
      // vm.loading = false
      const params = vm.$route.query
      console.log(params.id)
      if (params.id) {
        editItem({
          id: params.id
        }).then(res => {
          console.log(res)
          if (res.status == 200) {
            const page = res.data
            vm.formData = Object.assign(vm.formData, page)
            vm.formData.forceUpgrade = Number(vm.formData.forceUpgrade)
            vm.formData.publicDate = moment(vm.formData.publicDate)
            vm.$refs.upfile.setFileList(vm.formData.attachment)
          }
        })
      }
    })
  }
}
</script>

<style lang="less">
  .addPage{
    .formBox{
      padding:34px 0 10px;
      flex-grow: 1;
      background: #fff;
      border-radius: 5px;

    }
  }
</style>
