0510航天交易所ui仿制,代码使用的jiem
lxf
2025-05-19 45190f969dd8c7d3d2c6e366694f0dadc5ea07e8
src/page/themeModel/index.vue
@@ -1,51 +1,59 @@
<template>
    <div class="lang">
        <assets-head :title="$t('主题设置')" />
        <div v-for="(item, index) in themeList" :key="index"
    <div
      v-for="(item, index) in themeList"
      :key="index"
            class="flex justify-between items-center lang-padding font-35 box-border h-127 px-35 "
            @click="changeModel(item.type)">
      @click="changeModel(item.type)"
    >
            <div class="lang-title flex items-center font-26 textColor">
                {{ $t(item.title) }}
            </div>
            <img class="w-40 h-40 lh-40" v-if="item.type == theme" src="../../assets/image/public/checked.png" />
      <img
        class="w-40 h-40 lh-40"
        v-if="item.type == theme"
        src="../../assets/image/public/checked.png"
      />
        </div>
    </div>
</template>
<script>
import { mapGetters, mapMutations } from "vuex";
import assetsHead from "@/components/assets-head";
import { setStorage, getStorage } from '@/utils/utis'
import { setStorage, getStorage } from "@/utils/utis";
export default {
    data() {
        return {
            type: 'white',
      type: "dark",
      // type: 'white',
            themeList: [
        // {
        //     title: '白天模式',
        //     type: 'light',
        // },
                {
                    title: '白天模式',
                    type: 'light',
          title: "黑夜模式",
          type: "dark",
                },
                {
                    title: '黑夜模式',
                    type: 'dark',
                },
            ]
        }
      ],
    };
    },
    components: {
        assetsHead,
    },
    computed: {
        ...mapGetters('home', ['theme'])
    ...mapGetters("home", ["theme"]),
    },
    methods: {
        ...mapMutations('home', ['SET_THEME']),
    ...mapMutations("home", ["SET_THEME"]),
        changeModel(type) {
            this.type = type;
            this.SET_THEME(type)
        }
    }
}
      this.SET_THEME(type);
    },
  },
};
</script>
<style lang="scss" scoped>
.lang {