<template>
  <div>
    <el-card class="chain-detail-cart" style="width: 100%">
      <h2>{{ __('门店设置') }}</h2>
      <span>{{ __('门店设置-网站门店内容基本选项设置') }}</span>
    </el-card>
    <el-card class="my-box-card" style="width: 100%">
      <el-form ref="form" :model="form">
        <el-form-item
          :label="__('服务项目')"
          label-width="150px"
          prop="chain_services"
        >
          <el-input
            v-model="form.chain_services"
            oninput="form.chain_services.replace(/[^0-9.]/g,'')"
            :placeholder="__('服务项目')"
            :style="{ width: '100%' }"
            type="number"
          />
        </el-form-item>
        <el-divider />

        <el-form-item
          :label="__('员工人数')"
          label-width="150px"
          prop="chain_staff_num"
        >
          <el-input
            v-model="form.chain_staff_num"
            oninput="form.chain_staff_num.replace(/[^0-9.]/g,'')"
            :placeholder="__('员工人数')"
            :style="{ width: '100%' }"
            type="number"
          />
        </el-form-item>
        <el-divider />
        <el-form-item
          :label="__('金牌技师数')"
          label-width="150px"
          prop="chain_good_staff_num"
        >
          <el-input
            v-model="form.chain_good_staff_num"
            oninput="form.chain_good_staff_num.replace(/[^0-9.]/g,'')"
            :placeholder="__('金牌技师数')"
            :style="{ width: '100%' }"
            type="number"
          />
        </el-form-item>
        <el-divider />
        <el-form-item
          :label="__('服务数量')"
          label-width="150px"
          prop="chain_service_num"
        >
          <el-input
            v-model="form.chain_service_num"
            oninput="form.chain_service_num.replace(/[^0-9.]/g,'')"
            :placeholder="__('服务数量')"
            :style="{ width: '100%' }"
            type="number"
          />
        </el-form-item>

        <el-divider />
        <el-form-item
          :label="__('好评率')"
          label-width="150px"
          prop="chain_praise_rate"
        >
          <el-input
            v-model="form.chain_praise_rate"
            clearable
            :placeholder="__('好评率')"
            :style="{ width: '100%' }"
          />
        </el-form-item>
        <el-divider />
        <el-form-item>
          <el-button
            icon="el-icon-s-tools"
            style="width: 100%"
            type="info"
            @click="handleEdit()"
          >
            {{ __('修改') }}
          </el-button>
        </el-form-item>
      </el-form>
    </el-card>
  </div>
</template>

<script>
  import { translateTitle as __ } from '@/utils/i18n'
  import { get, doEdit } from '@/api/chain/detail/base'

  export default {
    name: 'SetUpChain',
    components: {},
    data() {
      return {
        form: {},
      }
    },
    created() {
      this.fetchData()
    },
    methods: {
      __,
      async handleEdit() {
        this.$baseConfirm(
          this.__('修改立马生效,是否继续？'),
          null,
          async () => {
            const { msg, status } = await doEdit(this.form)
            this.$baseMessage(msg, 'success', false, 'vab-hey-message-success')

            await this.fetchData()
          }
        )
      },
      async fetchData() {
        const { data } = await get()
        if (data != null) {
          this.form = data
        }
      },
    },
  }
</script>
<style>
  .my-box-card {
    width: 1200px;
  }
</style>
