<template>
    <div style="padding:8px 0px;" class="tab-home">
        <div v-bind:style="contentStyle">
            <header class="home_header" ref="headerDom">
                <!-- <van-search v-model="searchValue" placeholder="请输入搜索关键词" shape="round" :show-action="showSearchCancel" @focus="fnSearchFocus" @blur="fnSearchBlur"/> -->
                <aside  class="setting_userinfo">
                    <div class="flx-1 flx">
                        <mu-avatar size="40" class="setting_userinfo_avatar">{{simplename}}</mu-avatar>
                        <div class="setting_userinfo_name">
                            <div class="setting_userinfo_name_id">{{usercode}}</div>
                            <div class="setting_userinfo_name_name">{{username}}</div>
                        </div>
                    </div>
                    <div class="action flx-shrink flx-center">
                        <mu-button icon>
                            <i class="iconfont icon-search disable" style="font-size: 24px;"></i>
                        </mu-button>
                        <van-badge content="">
                            <mu-button icon>
                                <i class="iconfont icon-xiaoxi disable" style="font-size: 24px;"></i>
                            </mu-button>
                        </van-badge>
                    </div>
                </aside>
            </header>
            <section class="home_quick_entry">
                <van-grid :border="false" :column-num="3" square :clickable="true">
                    <van-grid-item :text="item.name" v-for="(item, index) in quickEnterList" :key="index" @click="handleModuleClick(item)">
                        <template #icon>
                            <div class="grid-item-box flx-center">
                                <img :src="item.icon" />
                            </div>
                        </template>
                    </van-grid-item>
                    <!-- <van-grid-item text="其他">
                        <template #icon>
                            <div class="grid-item-box flx-center">
                                <i class="iconfont icon-Category" style="font-size: 48px;"></i>
                            </div>
                        </template>
                    </van-grid-item> -->
                </van-grid>
            </section>
            <section class="home_notice">
                <van-notice-bar
                background="#fff"
                color="#000"
                text="暂无公告"
                >
                <!-- mode="link" -->
                    <template #left-icon>
                        <!-- <i class="iconfont icon-gonggao"></i> -->
                        <span class="title">公告</span>
                    </template>
                </van-notice-bar>
            </section>
            <section class="home_content">
                <header class="home_content-title">
                    <span class="title">价格变更</span>
                </header>
                <main class="home_content-main">
                    <van-empty description="暂无数据" image="search" image-size="64px" />
                </main>
            </section>
            <section class="home_content">
                <header class="home_content-title">
                    <span class="title">禁用物料/产品</span>
                </header>
                <main class="home_content-main">
                    <van-empty description="暂无数据" image="search" image-size="64px" />
                </main>
            </section>
        </div>
    </div>
</template>

<script>
    import moduleTimescape from './module-timescape';
    import moduleChart from './module-chart';
    import ljDialog from 'components/lj-dialog';

    import {
        XDialog
    } from 'vux'

    const DEFAULTIMAMG = require('../../../../assets/image/Common_Business.png');

    export default {
        name: "tab-home",
        components: {
            moduleTimescape,
            XDialog,
            moduleChart,
            ljDialog

        },
        props: {
            enabledFuncids: {
                type: Array,
            }
        },
        created() {

        },
        mounted() {
            this.refresh();
            // this.refreshJuece();
            // this.refreshTimescape();
            this.initStyle();
        },
        activated() {
            let self = this;
            $lj.addEventListener("timespace_refresh", function (ret) {
                if (ret) {
                    self.refreshTimescape();
                }
            });
            if (this.active == 2) {
                let reportAction = $lj.getStorage('reportAction') || {};
                if (reportAction.ifaction) {
                    this.refreshReport();
                    $lj.setStorage('reportAction', {
                        ifaction: false
                    });
                }
            }
        },
        data() {
            return {
                active: 0,
                openReport: false,
                openboard: false,
                reportName: "",
                reportList: [],
                postList: [],
                dialogIconBc: "",
                funcIdsStr: "",
                contentStyle: {
                    //变量名不能改，继承会引用到
                    marginTop: "0px",
                    marginBottom: "0px",
                },
                // enabledModuleGroups: [],
                moduleList: [{
                        title: "产销情况",
                        funcid: 5232,
                        icon: "icon-chart-line-2",
                        component: "module-productsales"
                    },
                    {
                        title: "订单情况",
                        funcid: 5233,
                        icon: "icon-write-text",
                        component: "module-task"
                    },
                    {
                        title: "财务状况",
                        funcid: 5234,
                        icon: "icon-financial-management",
                        component: "module-finance"
                    },
                    {
                        title: "库存情况",
                        funcid: 5235,
                        icon: "icon-chart-bar",
                        component: "module-mtrlware"
                    },
                ],
                selects: [],
                Report: [{
                        name: "销售",
                        funcid: 5459,
                        ReportList: [{
                                funcid: 5460,
                                name: "销售订单统计表",
                                icon: "icon-xiaoshoudingdan",
                                winName: "rp-saletask-new"
                            },
                            {
                                funcid: 5461,
                                name: "业务员销售排名统计表",
                                icon: "icon-xiaozu-",
                                winName: "rp-salerankinglist-outrep",
                            },
                            {
                                funcid: 5462,
                                name: "客户销售排名统计表",
                                icon: "icon-chart-bar",
                                winName: "rp-salerankinglist-cust",
                            },
                            {
                                funcid: 5463,
                                name: "产品型号销售排名统计表",
                                icon: "icon-gongxuguanli2",
                                winName: "rp-salerankinglist-model",
                            },
                            {
                                funcid: 5751,
                                name: "产品系列销售对比统计",
                                icon: "icon-gongxuguanli2",
                                winName: "rp-mtrlband",
                            },
                            {
                                funcid: 5594,
                                name: "销售订单粗产能分析",
                                icon: "icon-yitihuachuxing",
                                winName: "rp-saleability",
                            },
                            {
                                funcid: 6243,
                                name: "订单欠款统计表",
                                icon: "icon-xiaoshoudingdan",
                                winName: "rp-saledebt"
                            },
                            {
                                funcid: 6244,
                                name: "产品毛利统计表",
                                icon: "icon-xiaoshoudingdan",
                                winName: "rp-saleprofit"
                            },
                            {
                                funcid: 6244,
                                name: "订单利润列表",
                                icon: "icon-baojia",
                                winName: "rp-saledebt-mx"
                            },  
                            {
                                funcid: 6244,
                                name: "预算利润统计分析",
                                icon: "icon-baojia",
                                winName: "rp-salerankinglist-profit"                 
                            },  
                            {
                                funcid: 7220,
                                name: "客户&业务员销售排名统计表",
                                icon: "icon-xiaoshoudingdan",
                                winName: "rp-salerankinglist-cust-outrep"
                            },
                        ]
                    },
                    {
                        name: "财务",
                        funcid: 5464,
                        ReportList: [{
                                funcid: 5465,
                                name: "客户收款统计表",
                                icon: "icon-baojia",
                                winName: "rp-saletask-rec"
                            },
                            {
                                funcid: 5466,
                                name: "仓库周转率统计表",
                                icon: "icon-jiaohuan",
                                winName: "rp-warebalc"
                            },
                            {
                                funcid: 5467,
                                name: "产值统计表",
                                icon: "icon-baobiao",
                                winName: "rp-amt"
                            },
                            {
                                funcid: 5468,
                                name: "销售订单利润统计表",
                                icon: "icon-20",
                                winName: "rp-saletaskrealamt"
                            },
                            {
                                funcid: 5775,
                                name: "部门预算报销统计表",
                                icon: "icon-20",
                                winName: "rp-claim"
                            },
                            {
                                funcid: 6488,
                                name: "应付帐龄统计表",
                                icon: "icon-20",
                                winName: "rp-out"
                            },
                            {
                                funcid: 6569,
                                name: "应收帐龄统计表",
                                icon: "icon-20",
                                winName: "rp-in"
                            },
                            {
                                funcid: 6842,
                                name: "客户应收结余表",
                                icon: "icon-baojia",
                                winName: "cusbalc"
                            },
                        ]
                    },
                    {
                        name: "生产",
                        funcid: 5469,
                        ReportList: [{
                                funcid: 5470,
                                name: "在进行订单异常表",
                                icon: "icon-progress-running",
                                winName: "rp-saletask-ea"
                            },
                            {
                                funcid: 5471,
                                name: "销售订单准交率",
                                icon: "icon-write-text",
                                winName: "rp-saletask-ontime"
                            },
                            {
                                funcid: 5593,
                                name: "车间产能分析",
                                icon: "icon-yitihuachuxing",
                                winName: "orderzl-analysis"
                            },
                            {
                                funcid: 5700,
                                name: "质检统计表",
                                icon: "icon-jiance",
                                winName: "rp-quality-check"
                            },
                            {
                                funcid: 5952,
                                name: "车间生产入库计划达成表",
                                icon: "icon-jiance",
                                winName: "rp-order-inware"
                            },
                            {
                                funcid: 5952,
                                name: "仓库备料日计划报表",
                                icon: "icon-jiance",
                                winName: "scllgroup"
                            },
                            {
                                funcid: 6840,
                                name: "派工任务",
                                icon: "icon-xiaoshoudingdan",
                                winName: "sctask-work"
                            },
                        ]
                    },
                    {
                        name: "采购",
                        funcid: 5609,
                        ReportList: [{
                                funcid: 5610,
                                name: "采购收货统计表",
                                icon: "icon-shouhuo",
                                winName: "rp-inwarebuy"
                            },
                            {
                                funcid: 5611,
                                name: "供应商采购统计表",
                                icon: "icon-gongyingshangguanli",
                                winName: "rp-inwarebuy-spt"
                            },
                            {
                                funcid: 5612,
                                name: "物料采购统计表",
                                icon: "icon-baogao",
                                winName: "rp-inwarebuy-mtrl"
                            }
                        ]
                    },
                    {
                        name: "品质",
                        funcid: 5916,
                        ReportList: [
                            {
                                funcid: 5916,
                                name: "综合品质统计表",
                                icon: "icon-baogao",
                                winName: "rp-check-main"
                            },
                            {
                                funcid: 5804,
                                name: "客诉统计表",
                                icon: "icon-xiaoshoudingdan",
                                winName: "rp-oppose-cust"
                            },
                            {
                                funcid: 5803,
                                name: "内部质量异常统计表",
                                icon: "icon-jiance",
                                winName: "rp-quality-wrong"
                            },
                            {
                                funcid: 5802,
                                name: "供应商品质异常统计表",
                                icon: "icon-yitihuachuxing",
                                winName: "rp-spt-error",
                            }
                        ]
                    },


                ],
                loading_timescape: false,
                refreshing_timescape: false,
                loadedAll_timescape: false,
                timescapeGroup: {},
                deadFlagTask: 0,
                boardStyle: {
                    height: 0,
                },
                ifRefresh: false,
                username: "",
                usercode: "",
                simplename: "",
                searchValue: "",
                showSearchCancel: false,
                quickEnterList: [
                    {
                        funcid: 0, 
                        name: "床网报价",
                        icon: DEFAULTIMAMG,
                        winName: "bednet-quote"
                    },
                    {
                        funcid: 0, 
                        name: "床垫报价",
                        icon: DEFAULTIMAMG,
                        winName: "mattress-quote"
                    },
                    // {
                    //     funcid: 0, 
                    //     name: "半成品部件",
                    //     icon: DEFAULTIMAMG,
                    //     winName: "semifinprod-quote"
                    // },
                ]
            }
        },
        methods: {
            handleModuleClick(module) {
                let pageParam = Object.keys(module).includes("pageParam") ? module.pageParam : {};
                $lj.openWin(module.winName, pageParam);
            },
            fnSearchFocus() {
                this.showSearchCancel = true;  
            },
            fnSearchBlur() {
                this.showSearchCancel = false;  
            },
            handleChangeTabs() {
                this.ifRefresh = false
            },
            handleRefreshTabs() {
                if (this.ifRefresh) {
                    if (this.active == 0) {
                        this.refreshJuece();
                    } else if (this.active == 1) {
                        this.refreshTimescape();
                    }
                }
                this.ifRefresh = true;
            },
            refreshTimescape() {
                let self = this;
                let dataList = [];
                this.timescapeGroup = {};
                this.deadFlagTask = 0;
                if(!$lj.getStorage("token")){
                    return;
                }
                $lj.postLJRequest("GetTimescapeList", {
                    token: $lj.getStorage("token")
                }, function (ret) {
                    if (ret) {
                        if (ret.timescapeList) {
                            if (ret.timescapeList.length === 0) {
                                if (self.active === 1){
                                    $lj.toast("没有相关资讯");
                                }
                            } else {
                                let mapGroup = {};
                                var dt = new Date();
                                let curdate = dt.getFullYear() + '-' + (dt.getMonth() + 1) + "-" + dt.getDate();
                                // curdate = $lj.dateformat(curdate, 'M/d');
                                ret.timescapeList.forEach((item) => {
                                    let sdt = $lj.getDateObject(item.stime);
                                    let sdate = sdt.getFullYear() + '-' + (sdt.getMonth() + 1) + "-" +
                                        sdt.getDate();
                                    let sdateStr = sdt.getFullYear() + '-' + (sdt.getMonth() + 1) +
                                        "-" + sdt.getDate() + " " + sdt.getHours() + ":" + sdt
                                        .getMinutes();

                                    if (item.etime) {
                                        let edt = $lj.getDateObject(item.etime);
                                        let edate = edt.getFullYear() + '-' + (edt.getMonth() + 1) +
                                            "-" + edt.getDate();
                                        let edateStr = edt.getFullYear() + '-' + (edt.getMonth() + 1) +
                                            "-" + edt.getDate() + " " + edt.getHours() + ":" + edt
                                            .getMinutes();
                                        edate = $lj.dateformat(edate, 'M/d');

                                        if (sdate == edate) {
                                            item.dateDuration = $lj.dateformat(sdateStr, 'M/d hh:mm') +
                                                '-' + $lj.dateformat(edateStr, 'hh:mm');
                                        } else {
                                            item.dateDuration = $lj.dateformat(sdateStr, 'M/d hh:mm') +
                                                '-' + $lj.dateformat(edateStr, 'M/d hh:mm');
                                        }
                                    } else {
                                        item.dateDuration = $lj.dateformat(sdateStr, 'M/d hh:mm');
                                    }

                                    // 超期
                                    if (sdate < curdate) {
                                        if (item.idType !== 2) {
                                            item.deadFlag = 1;
                                            self.deadFlagTask++;
                                        }
                                    }

                                    let key = "";
                                    key = sdate;
                                    if (!mapGroup[key]) {
                                        self.$set(mapGroup, key, []);
                                    }
                                    mapGroup[key].push(item);
                                })
                                let sortKeys = Object.keys(mapGroup);
                                sortKeys.sort().reverse();
                                for (let i = 0; i < sortKeys.length; i++) {
                                    if (sortKeys[i] == curdate) {
                                        let key = '当天'
                                        self.$set(self.timescapeGroup, key, []);
                                        self.timescapeGroup[key] = mapGroup[sortKeys[i]];
                                    } else {
                                        self.$set(self.timescapeGroup, sortKeys[i], []);
                                        self.timescapeGroup[sortKeys[i]] = mapGroup[sortKeys[i]];
                                    }
                                }

                            }
                            self.initStyle();
                        }
                    }
                })
            },
            loadTimescape(response) {
                //分段加载
            },
            gotoTimescapeDetail(item) {
                //各类型卡片跳转界面
                switch (item.idType) {
                    case 1:
                        //任务查看
                        $lj.openWin('workplan-detail', {
                            mainObject: {
                                planid: item.relid
                            }
                        });
                        break;
                    case 2:
                        //消息
                        $lj.postLJRequest("GetL1MailAll", {
                            token: $lj.getStorage("token"),
                            msgid: item.relid
                        }, function (ret) {
                            if (ret) {
                                if (ret.MailAll.length === 1) {
                                    $lj.openWin('email-detail', {
                                        mainObject: ret.MailAll[0]
                                    })
                                }
                            }
                        });
                        break;
                    case 3:
                        //审批流程
                        $lj.openWin('approval-process', {
                            mainObject: {
                                docid: item.relid
                            }
                        });
                        break;
                    case 4:
                        //设备报修
                        $lj.openWin('equipment-repair-info', {
                            mainObject: {
                                repairtid: item.relid
                            }
                        });
                        break;
                    default:
                        break;
                }
            },
            handleClickWaitTask() {
                //进入超期待办界面
                $lj.toast('该功能未开发')
            },
            refreshReport() {
                if (!$lj.getStorage("token")) return;
                let self = this;
                let dataList = [];
                self.selects = [];
                let userinfo = $lj.getStorage('userInfo');
                if (!userinfo){
                    return;
                }
                let empid = userinfo.empid;
                // $lj.postLJRequest("GetL1APPComReport", {
                //     token: $lj.getStorage("token"),
                //     empid: empid
                // }, function (ret) {
                //     if (ret) {
                //         dataList = ret.comreportList;
                //         for (let i = 0; i < dataList.length; i++) {
                //             self.selects.push(dataList[i].value);
                //         }
                //     }
                // })
            },
            getIconClassReport(report) {
                let result = ['iconfont', report.icon];
                return result;
            },
            handleReportClick(report) {
                if (report.winName) {
                    $lj.openWin(report.winName);
                } else {
                    alert("未定义窗口");
                }
            },
            initStyle() {
                let appBarHeight = 0;
                // 兼容刘海屏
                // $lj.fixStatusBar(this.$refs.headerDom);
                // appBarHeight = 48 + api.safeArea.top;
                appBarHeight = api.safeArea.top;
                // this.$refs.headerDom.style.height = appBarHeight + "px";
                // if (this.$refs.headerDom) {
                //     appBarHeight = this.$refs.headerDom.offsetHeight;
                // }
                let winHeight = 80;
                if (window.api) {
                    winHeight = api.winHeight;
                }
                // let footerHeight = 77 + api.safeArea.top;
                let footerHeight = 56 + 10 + 10 + 1;
                if (api.systemType === "ios") {
                    footerHeight += api.safeArea.bottom
                }
                this.contentStyle.minHeight = (winHeight - appBarHeight - footerHeight) + "px";
                // if (this.active === 0 && this.deadFlagTask > 0) {
                //     this.contentStyle.marginTop = (appBarHeight + 35) + "px";
                // } else {
                    // this.contentStyle.marginTop = (appBarHeight + 5) + "px";
                // }
                this.contentStyle.marginTop = (appBarHeight) + "px";
                this.contentStyle.marginBottom = 0 + "px";
                this.boardStyle.height = winHeight - appBarHeight - footerHeight - 100 + 'px';
            },
            getIconColor(name) {
                let result = "";
                if (name === '销售') {
                    result = "#00aaee"
                } else if (name === '财务') {
                    result = "#ff6f61"
                } else if (name === '生产') {
                    result = "#47cc47"
                } else if (name === '采购') {
                    result = "#FFC125"
                }else if (name === '品质') {
                    result = "#CC33FF"
                }
                return result;
            },
            showMore(reportItem) {
                this.reportName = reportItem.name;
                let reportListTemp = [];
                for (let i = 0; i < reportItem.ReportList.length; i++) {
                    if (this.enabledFuncids.indexOf(reportItem.ReportList[i].funcid) > -1) {
                        reportListTemp.push(reportItem.ReportList[i]);
                    }
                };
                if (reportListTemp.length <= 0) {
                    $lj.toast("暂无 [" + this.reportName + "] 相关表权限", 2000);
                    return;
                }
                // this.openReport = true;
                this.$refs.rpDialog.open();
                this.reportList = reportListTemp;
            },
            handleStar(report) {
                let self = this;
                let empid = $lj.getStorage('user').empid;
                if (report.winName) {
                    if (self.selects.indexOf(report.winName) > -1) { //收藏报表
                        let requestBody = {
                            token: $lj.getStorage("token"),
                            empid: empid,
                            dwname: 'L1AppUserReport',
                            itemname: report.name,
                            itemvalue: report.winName,
                        };
                        $lj.postLJRequest(
                            "SetSysUserFileString", requestBody,
                            function (ret) {
                                if (!ret.ErrMsg) {
                                    $lj.setStorage('reportAction', {
                                        ifaction: true
                                    });
                                    $lj.toast("收藏成功", 2000);
                                }
                            }
                        );
                    } else { //取消收藏
                        let requestBody = {
                            token: $lj.getStorage("token"),
                            empid: empid,
                            itemname: report.name,
                        };
                        $lj.postLJRequest(
                            "DelL1APPComReport", requestBody,
                            function (ret) {
                                if (!ret.ErrMsg) {
                                    $lj.setStorage('reportAction', {
                                        ifaction: true
                                    });
                                    $lj.toast("取消收藏成功", 2000);
                                }
                            }
                        );
                    }
                } else {
                    alert("未定义窗口");
                }

            },
            refresh() {
                // this.refreshTimescape();
                this.refreshReport();


                let user = $lj.getStorage("user");

                console.log('home refresh user :>>>>>>>>>>>>>>>>>>>>>', JSON.stringify(user));
                if (user) {
                    this.username = user.username;
                    this.usercode = user.usercode;
                    // this.simplename = this.username.substring(this.username.length - 1, this.username.length)
                    this.simplename = this.username.substring(0,1)
                }
            },
            refreshJuece() {
                this.$refs.juece.refreshAll();
            },
            handleClickBoard() {
                $lj.openWin('gonggao');
            },
            handleClickNotification() {
                $lj.openWin('push-msg');
            },
        },
        computed: {
            enabledModuleGroups() {
                if (!this.enabledFuncids || this.enabledFuncids.length === 0) {
                    return [];
                }
                let funcIdsStr = ",";
                for (let funcid of this.enabledFuncids) {
                    funcIdsStr += funcid + ",";
                }
                let result = [];
                for (let module of this.moduleList) {
                    if (funcIdsStr.indexOf("," + module.funcid + ",") >= 0) {
                        result.push(module);
                    }
                }
                return result;
            },
            enableModuleReport() {
                if (!this.enabledFuncids || this.enabledFuncids.length === 0) {
                    return [];
                }
                let funcIdsStr = ",";
                for (let funcid of this.enabledFuncids) {
                    funcIdsStr += funcid + ",";
                }
                if (funcIdsStr) {
                    this.funcIdsStr = funcIdsStr;
                }
                let result = [];
                for (let reportItem of this.Report) {
                    if (funcIdsStr.indexOf("," + reportItem.funcid + ",") >= 0) {
                        result.push(reportItem);
                    }
                }
                for (const report of result) {
                    report.showCnt = 0;
                    for (const mx of report.ReportList) {
                        if (this.selects.indexOf(mx.winName) > -1 && this.funcIdsStr.indexOf(mx.funcid) > -1) {
                            mx.show = true;
                            report.showCnt++;
                        } else {
                            mx.show = false;
                        }
                    }
                }
                return result;
            },
        },
        watch: {
            active: function (val, oldval) {
                if (val != oldval) {
                    this.initStyle();
                }
                if (val === 2) {
                    let reportAction = $lj.getStorage('reportAction') || {};
                    if (reportAction.ifaction) {
                        this.refreshReport();
                        $lj.setStorage('reportAction', {
                            ifaction: false
                        });
                    }
                }
            }
        }
    }
</script>

<style scoped lang="less">
    .tab-home {
      background: linear-gradient(0deg, rgba(249, 249, 249, 0.94) 58%, rgba(0, 122, 255, 0.94) 100%);

      .van-search {
          background: unset;
      }
    }
    .home_reload {
        font-size: 16px;
        color: #aaa;
        padding: 10px;
        background-color: white;
        margin: 8px 0px 0px 0px;
        text-align: center;
    }

    .homerp_title {
        font-size: 16px;
        font-weight: bold;
        padding: 0 0 10px 20px;
    }

    .report_list_item {
        display: flex;
        color: #606060;
        font-size: 15px;
        font-weight: bold;
        line-height: 50px;
        align-items: center;
    }

    .report_list_item_icon {
        flex: 0 0 35px;
        font-size: 20px;
        line-height: 35px;

        color: #fff;
        border-radius: 50%;
        text-align: center;
    }

    .report_list_item_text {
        display: flex;
        width: 100%;
        margin: 0 5px 0 10px;
    }

    .report_list_item_name {
        flex: 0 0 90%
    }

    .report_list_item_right {
        color: #9b9b9b;
        font-size: 28px;
    }

    .homerp_more {
        margin: 20px;
        font-size: 14px;
        text-align: center;
        color: #6495ed;
    }

    .throughLineClass {
        position: absolute;
        /*top: 0px;*/
        width: 100%;
        z-index: 0;
        background-color: #ffffff;
    }

    .throughLineClass::before {
        content: '';
        position: absolute;
        top: 0;
        bottom: 20px;
        width: 5px;
        background: #e6e6e6;
        left: 28px;
        margin-left: -5px;
        z-index: 0;
    }

    .task_msg {
        width: 100%;
        background-color: #fdd1cd;
        font-size: 13px;
        color: #ff6f61;
        line-height: 25px;
        padding: 4px 5px 4px 20px;
        margin-top: -10px;
    }

    .task_title {
        margin: 0px 0px 0px 50px;
        font-size: 17px;
        font-weight: bold;
        line-height: 25px;
    }


    .setting_userinfo {
        display: flex;
        padding:0 12px;

        .setting_userinfo_name {
            // padding: 15px 10px;
            padding-left: 4px;
        }
    
        .setting_userinfo_name_id {
            // color: #fff;
            font-size: 12px;
            // line-height: 14px;
            color: @light-label-secondary;
        }
        .setting_userinfo_name_name {
            font-size: 16px;
            font-weight: bold;
            // line-height: 45px;
            color: @light-label-primary;
        }
    
        .setting_userinfo_avatar {
            text-align: center;
            // background-color: rgb(255, 255, 255);
            border: 3px solid @colorPassThr;
            font-size: 24px;
            font-weight: bold;
            // color: #fff;
            overflow: hidden;
            box-shadow: 0 0px 7px rgba(0, 0, 0, 0.3) inset;

            background: @musePrimary;
        }

        .action {
            .disable {
                color: @light-label-tertiary;
            }
        }
    }

    .home_quick_entry {
        .grid-item-box {
            width: 48px;
            height: 48px;
            border-radius: 4px;
            color: @colorStatusText;
        }
    }

    .home_notice {
        margin: 0 12px;
        border-radius: 8px;
        overflow: hidden;

        // .iconfont {
        //     font-size: 12px;
        //     color: @light-label-secondary;
        // }
        .title {
            font-size: 14px;
            font-weight: bold;
            color: @light-label-tertiary;
            // padding-left: 4px;
            padding-right: 4px;
        }
        .van-notice-bar {
            padding-left: 12px;
            padding-right: 12px;
        }
    }

    .home_content {
        margin: 0 12px;
        margin-top: 16px;
        padding: 12px;
        background: @light-barkground-elevated-primary;
        // background: @light-barkground-elevated-secondary;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02);
        border-radius: 8px;

        &-title {
            font-size: 16px;
            font-weight: bold;
        }

        &-main {
            .van-empty {
                padding: 8px 0;
            }
        }
    }

</style>

<style lang="less">
    .tab-home .home_quick_entry .van-grid-item__content {
        background: unset;
    }
    .tab-home .home_quick_entry .van-grid-item__text {
        margin-top: 4px;
        color: @light-label-secondary;
    }
</style>