<!--
 * @Author: 曹捷
 * @Date: 2021-08-30 17:15:28
 * @LastEditors: 曹捷
 * @LastEditTime: 2021-09-02 15:50:39
 * @Description: fileContent
-->
<template>
  <div class="app-list">
    <a-divider orientation="left"><b>选择应用</b> </a-divider>
    <a-tabs tab-position="left" :style="{ height: '100%' }" @change="changeApp" v-model:activeKey="activeKey">
      <a-tab-pane v-for="item in appList" :key="item.appId" :tab="item.appName"> </a-tab-pane>
    </a-tabs>
  </div>
</template>

<script>
import { inject, onMounted, reactive, toRefs } from 'vue'
export default {
  props: {
    value: {
      type: [String, Number]
    }
  },
  setup (props, context) {
    let http = inject('http')
    let _data = reactive({
      appList: [],
      activeKey: ''
    })
    let methos = {
      initInfo () {
        http.commonPost('system/app/list').then(res => {
          console.log('🚀 ~ file: appList.vue ~ line 25 ~ http.post ~ res', res)
          _data.appList = res
          _data.activeKey = res[0].appId
          context.emit('update:value', _data.activeKey)
          context.emit('change', _data.activeKey)
        })
      }
    }
    let _methods = {
      changeApp (item) {
        context.emit('update:value', _data.activeKey)
        context.emit('change', _data.activeKey)
      }
    }
    onMounted(() => {
      methos.initInfo()
    })
    return {
      ...toRefs(_data),
      ..._methods
    }
  }
}
</script>

<style>
</style>