<template>
  <div class="container">
    <el-form ref="form" :model="form" label-width="80px">
      <el-form-item label="城市">
        <el-input v-model="form.city" maxlength="10" show-word-limit></el-input>
      </el-form-item>
      <el-form-item label="具体地点">
        <el-input v-model="form.address" maxlength="20" show-word-limit></el-input>
      </el-form-item>
      <el-form-item label="店类型">
        <el-input v-model="form.type" maxlength="10" show-word-limit></el-input>
      </el-form-item>
      <el-form-item label="家乡">
        <el-input v-model="form.home" maxlength="10" show-word-limit></el-input>
      </el-form-item>
      <el-form-item label="姓氏">
        <el-input v-model="form.firstName" maxlength="10" show-word-limit></el-input>
      </el-form-item>
      <el-form-item label="从业年限">
        <el-input v-model="form.years" maxlength="10" show-word-limit></el-input>
      </el-form-item>
      <el-form-item label="行业">
        <el-input v-model="form.hy" maxlength="10" show-word-limit></el-input>
      </el-form-item>
      <el-form-item label="店名">
        <el-input v-model="form.shopName" maxlength="20" show-word-limit></el-input>
      </el-form-item>
      <el-form-item label="店数量">
        <el-input v-model="form.shopCount" maxlength="10" show-word-limit></el-input>
      </el-form-item>
      <el-form-item label="年龄段">
        <el-input v-model="form.age" maxlength="10" show-word-limit></el-input>
      </el-form-item>
      <el-form-item label="姓名">
        <el-input v-model="form.name" maxlength="10" show-word-limit></el-input>
      </el-form-item>
      <el-form-item label="厂房面积">
        <el-input v-model="form.cm" maxlength="10" show-word-limit></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="onSubmit">提交</el-button>
        <el-button @click="reset">取消</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>
<script>
export default {
  name: 'APP',
  data() {
    return {
      form: {
        city: '',
        address: '',
        type: '',
        home: '',
        firstName: "",
        years: '',
        hy: '',
        shopName: '',
        shopCount: '',
        age: '',
        name: '',
        cm: ''
      }
    }
  },
  methods: {
    onSubmit() {
      if (this.form.address !== '' || this.form.age !== '' || this.form.type !== '' || this.form.years !== '' || this.form.city !== '' || this.form.cm !== ''
        || this.form.firstName !== '' || this.form.home !== '' || this.form.hy !== '' || this.form.name !== '' || this.form.shopCount !== '' || this.form.shopName !== '') {
        localStorage.setItem('form', JSON.stringify(this.form))
        this.$message({
          message: '提交成功',
          type: 'success'
        })
        this.form.address = ''
        this.form.age = ''
        this.form.type = ''
        this.form.years = ''
        this.form.city = ''
        this.form.cm = ''
        this.form.firstName = ''
        this.form.home = ''
        this.form.hy = ''
        this.form.name = ''
        this.form.shopCount = ''
        this.form.shopName = ''
        this.$router.push('/result')
      } else {
        this.$message({
          message: '提交信息不能为空',
          type: 'error'
        })
      }
    },
    reset() {
      this.form.address = ''
      this.form.age = ''
      this.form.type = ''
      this.form.years = ''
      this.form.city = ''
      this.form.cm = ''
      this.form.firstName = ''
      this.form.home = ''
      this.form.hy = ''
      this.form.name = ''
      this.form.shopCount = ''
      this.form.shopName = ''
    }
  },
  created() {
  },
  mounted() {
  },
}
</script>
<style  scoped>
</style>
