<template>
  <div :class="$style.listContent">
    <a-card>
      <SdSettingPage ref="setting" global />
      <div :class="$style.button">
        <a-button type="primary" :loading="btnLoading" @click="save">保存</a-button>
      </div>
    </a-card>
  </div>
</template>

<script>
import { Message } from 'ant-design-vue'
import { getUserInfo } from '@/common/store-mixin'
import SdSettingPage from '../components/sd-setting-page.vue'
import EntrustService from '../entrust-service'
import components from './_import-components/sd-my-entrust-list-import'

export default {
  name: 'SdMyEntrustList',
  components: {
    SdSettingPage,
    ...components,
  },

  data() {
    return {
      btnLoading: false,
    }
  },
  computed: {},
  created() {
    this.getEntrustInfo()
  },
  methods: {
    getEntrustInfo() {
      EntrustService.getEntrust(getUserInfo().account).then((res) => {
        if (res) {
          this.$refs.setting.setFieldsValue(res)
        }
      })
    },
    save() {
      this.$refs.setting.validateFields().then(() => {
        this.btnLoading = true
        const formInfo = this.$refs.setting.getBackendValues()
        EntrustService.saveEntrust(formInfo)
          .then((res) => {
            if (res) {
              Message.success('保存成功')
            }
          })
          .catch(() => {
            Message.error('保存失败')
          })
          .finally(() => {
            this.getEntrustInfo()
            this.btnLoading = false
          })
      })
    },
  },
}
</script>

<style module lang="scss">
@use '@/common/design' as *;
.list-content {
  width: 60%;
  margin: 0 auto;
}

.button {
  display: flex;
  justify-content: center;
}
</style>
