duoji-frontend/src/store/modules/styles.js

import Vue from "vue";
const vue = new Vue();
import api from '@/plugins/axios/index'
const { httpNodeApi } = api;
import axios from "axios";
import {changeTheme} from '@/plugins/themePicker'
const store =  {
    state: {
        data:{
            "theme":{
                "primary-color":"rgba(184, 68, 13, 1)"
            },
            "title":{
                "text":"堆垛机智能视觉系统",
                "style":{
                    "color":"rgba(255, 255, 255, 1)",
                    "background-color":"rgba(163, 60, 12, 1)",
                    "font-size":"24px"
                }
            },
            "menu":{
                "default":{
                    "color":"rgba(230, 224, 224, 1)",
                    "background-color":"rgba(163, 60, 12, 1)"
                },
                "select":{
                    "color":"rgba(255, 255, 255, 1)",
                    "background-color":"rgba(184, 68, 13, 1)"
                }
            }
        }
    },
    mutations:{
        UPDATE_STYLES(state, data) {
            // for(let key in data) {
            //     // state[key] = data[key];
            //     vue.$set(state, key, data[key])
            // }
            state.data = data;
            // 改变主题颜色
            changeTheme(data.theme['primary-color']);
            // setItem(data);
        }
    },
    actions: {
        // 更新样式
        async updateStyles({commit}, data) {
            console.log(Vue.prototype.$api);
            // commit('UPDATE_STYLES', data);
            await httpNodeApi.updateStylesAPI({data})
        },
        // 获取样式
        async getStyles({commit}){
            console.log('获取样式');
            const data = await axios.get('/api/node/default_css.json');
            commit('UPDATE_STYLES', data.data);
        }
    }
}
export default store;