<template>
  <div>
    <el-form ref="form" :model="form">
      <el-card class="box-card">
      <div
        class="image_font"
        style="padding-top: 10px; margin-left: 15px; color: #0f2027"
      >
        <h3>Android App</h3>
      </div>
      <el-form-item
        :label="__('当前发布版本')"
        label-width="150px"
        prop="app_android_last_version"
        style="margin-top: 30px; margin-left: 45px"
      >
        <el-input
          v-model="form.app_android_last_version"
          clearable
          :placeholder="__('当前发布版本')"
          :style="{ width: '100%' }"
        />
        <div class="image_font">
          {{ __('必须按照严格版本规范， 例如 - 1.0.1') }}
        </div>
      </el-form-item>
      <el-form-item
        :label="__('安装包地址')"
        label-width="150px"
        prop="app_android_last_url"
        style="margin-top: 30px; margin-left: 45px"
      >
        <el-input
          v-model="form.app_android_last_url"
          clearable
          :style="{ width: '100%' }"
        />
        <div class="image_font">{{ __('APP最新安装包地址') }}</div>
      </el-form-item>
      <el-form-item
        :label="__('最新版本更新说明')"
        label-width="150px"
        prop="app_android_last_note"
        style="margin-top: 30px; margin-left: 45px"
      >
        <el-input
          v-model="form.app_android_last_note"
          clearable
          :placeholder="__('1.修复BUG1;2.修复bug2;')"
          :style="{ width: '100%' }"
        />
        <div class="image_font">"\n"{{ __('为换行符号。') }}</div>
      </el-form-item>
      <el-button
        class="form-sub-btn"
        icon="el-icon-s-tools"
        style="
        "
        type="primary"
        @click="handleEdit"
      >
        {{ __('修改') }}
      </el-button>
      </el-card>
      <el-card class="box-card">
      <div
        class="image_font"
        style="padding-top: 10px; margin-left: 15px; color: #0f2027"
      >
        <h3>iOS App</h3>
      </div>
      <el-form-item
        :label="__('当前发布版本')"
        label-width="150px"
        prop="app_ios_last_version"
        style="margin-top: 30px; margin-left: 45px"
      >
        <el-input
          v-model="form.app_ios_last_version"
          clearable
          :placeholder="__('当前发布版本')"
          :style="{ width: '100%' }"
        />
        <div class="image_font">
          {{ __('必须按照严格版本规范， 例如 - 1.0.1') }}
        </div>
      </el-form-item>
      <el-form-item
        :label="__('安装包地址')"
        label-width="150px"
        prop="app_ios_last_url"
        style="margin-top: 30px; margin-left: 45px"
      >
        <el-input
          v-model="form.app_ios_last_url"
          clearable
          :style="{ width: '100%' }"
        />
        <div class="image_font">{{ __('APP最新安装包地址') }}</div>
      </el-form-item>
      <el-form-item
        :label="__('最新版本更新说明')"
        label-width="150px"
        prop="app_ios_last_note"
        style="margin-top: 30px; margin-left: 45px"
      >
        <el-input
          v-model="form.app_ios_last_note"
          clearable
          :placeholder="__('1.修复BUG1;2.修复bug2;')"
          :style="{ width: '100%' }"
        />
        <div class="image_font">"\n"{{ __('为换行符号。') }}</div>
      </el-form-item>
      <el-button
        class="form-sub-btn"
        icon="el-icon-s-tools"
        style="
        "
        type="primary"
        @click="handleEdit"
      >
        {{ __('修改') }}
      </el-button>
      </el-card>
    </el-form>
  </div>
</template>

<script>
  import { translateTitle as __ } from '@/utils/i18n'
  import { getList, doEdit } from '@/api/base/config'

  export default {
    name: 'Site',
    components: {},
    data() {
      return {
        form: {
          app_android_last_url: undefined,
          app_ios_last_version: undefined,
          app_android_last_version: undefined,
          app_android_last_note: undefined,
          app_ios_last_url: undefined,
          app_ios_last_note: undefined,
        },
      }
    },
    created() {
      this.fetchData()
    },
    methods: {
      __,
      async fetchData() {
        const { data } = await getList()
        this.form = {
          app_android_last_url: data.app_android_last_url,
          app_android_last_version: data.app_android_last_version,
          app_ios_last_version: data.app_ios_last_version,
          app_android_last_note: data.app_android_last_note,
          app_ios_last_url: data.app_ios_last_url,
          app_ios_last_note: data.app_ios_last_note,
        }
      },
      handleEdit() {
        this.$refs['form'].validate(async (valid) => {
          if (valid) {
            const { msg, status } = await doEdit({
              param: JSON.stringify(this.form),
            })
            this.$baseMessage(msg, 'success', false, 'vab-hey-message-success')
          } else {
            return false
          }
        })
      },
    },
  }
</script>
<style>
  .image_font {
    color: #979898;
    font-size: 14px;
  }
</style>
