import { defineStore } from 'pinia'
import { computed, reactive } from 'vue'

export type VisibleState = 'show' | 'auto' | ''
export type TimeUnit = 'date' | 'week' | '12hour' | 'lunal' | 'second'


export const SimpleShowStringType = [{
  label: "侧边栏",
  value: 'showSider',
},
{
  label: "底部栏",
  value: 'showDock',

},
{
  label: "时间",
  value: 'showTime',

}, {
  label: "日期",
  value: 'showDate',

}, {
  label: "AI助手",
  value: 'showPet',
}
]
type SimpleValueType = typeof SimpleShowStringType[number]['value'];

export default defineStore(
  'settings',
  () => {
    const state = reactive({
      // 是否用过
      used: false,
      maskOpacity: 0,
      maskFilter: 0,
      // 显示隐藏
      showSider: 'show' as VisibleState,
      showDock: 'show' as VisibleState,
      showPet: 'show' as VisibleState,
      showTop: 'show' as VisibleState,
      showTime: true,
      timeOptions: ['date', 'week', '12hour', 'lunal', 'second'] as TimeUnit[],
      showAdder: true,
      showHistory: true,
      // 尺寸
      blockSize: 6.7,
      blockPadding: 1,
      mainWidth: 70,
      blockRadius: 0.2,
      showBlockLabel: true,
      // 搜索
      searchWidth: 30,
      searchRadius: 12,
      searchOpacity: 0.75,
      // 侧边栏
      siderDirection: 'left' as 'left' | 'right',
      // 禁用快捷键
      disabledShortcut: false,
      // 极简模式显式
      simpleModeShowString: ['showTime', 'showDate'] as SimpleValueType[]
    })
    return { state, blockInner: computed(() => state.blockSize - 2 * state.blockPadding) }
  },
  {
    persist: true
  }
)