import { Component, Vue } from 'vue-property-decorator'
import { mapState } from 'vuex'
import store from "./index"

// 尝试将用户在根目录中的store/index.js的vuex的state变量，全部加载到全局变量中
let $uStoreKey: string[] = [];
try{
  $uStoreKey = store.state ? Object.keys(store.state) : [];
}catch(e){ }

@Component({
  computed: {
    ...mapState($uStoreKey)
  }
})
export class VuexMixin extends Vue {
  private created() {
    // 此处的types声明在src/models/uview/index.ts定义
		// 将vuex方法挂在到$u中
		// 使用方法为：如果要修改vuex的state中的user.name变量为"史诗" => this.$u.vuex('user.name', '史诗')
		// 如果要修改vuex的state的version变量为1.0.1 => this.$u.vuex('version', '1.0.1')
		this.$u.vuex = (name: string, value: any) => {
			this.$store.commit('$uStore', {
				name, value
			})
		}

    // 以下是一些挂载到$u的自定义工具方法
    // rpx转换为px
    this.$u.rpx2px = (rpx: number) => {
      return uni.upx2px(rpx)
    }
    // px转换为rpx
    this.$u.px2rpx = (px: number) => {
      return px / (uni.upx2px(100) / 100)
    }
	}
}