修改首页草药名称过长UI错乱问题

朱桂飞

2023-04-11 e86013cd8d4b88ca916067b01eeb452401b38c7b

修改首页草药名称过长UI错乱问题

本地图片上传云

 App.vue

@@ -2,7 +2,7 @@
    import Vue from 'vue'
    export default {

        globalData: {

            token: "aaa"

            token: ""

        },

        onLaunch: function() {

            uni.getSystemInfo({

@@ -40,24 +40,8 @@
        },
        methods:{
         
			
        },

        mounted() {

            var i = 0;

            // setInterval(function() {

            //     i++

            //     if (i % 2 == 0) {

            //         uni.showTabBarRedDot({

            //             index: 1

            //         })

            //     } else {

            //         uni.hideTabBarRedDot({

            //             index: 1

            //         })

            //     }

            // }, 3000)







        }

    }


 pages.json

@@ -102,7 +102,7 @@
    ],

    "globalStyle": {

        "navigationBarTextStyle": "white",

        "navigationBarTitleText": "uni-app",

        "navigationBarTitleText": "兰宝智能",

        "navigationBarBackgroundColor": "#F8F8F8",

        "backgroundColor": "#F8F8F8"

    },


 pages/tabBar/general.vue

@@ -14,7 +14,7 @@
        <cu-custom bgColor="bg-gradual-blue" :isBack="false">

            <block slot="content">干燥设备监控系统</block>

        </cu-custom>



        <u-toast ref="uToast"></u-toast>

        <!--         <view class="card-box dynamic shadow cu-list menu">

            <view class="title-box">

                <view class="left">

@@ -177,7 +177,7 @@
                    <view class="flex">

                        <text>中草药</text>

                        <text>丨</text>

                        <text>{{showValue(item.herbName)}}</text>

                        <text @click="showLongName(showValue(item.herbName))" class="text-cut flex-twice">{{showValue(item.herbName)}}</text>

                        <!-- <view class="margin-lr-sm">

                            <u-tag text="报警一次" plain size="mini" type="warning"></u-tag>

                        </view> -->

@@ -364,6 +364,13 @@


        },

        methods: {

            showLongName(longName){
                    this.$refs.uToast.show({
                        type: 'default',
                        message: longName
                    })
				
            },

            dayChange(dayInfo) { // 点击日期

                this.model.date = dayInfo.date

                console.log("点击日期", JSON.parse(JSON.stringify(dayInfo)));


 pages/tabBar/main.vue

@@ -37,7 +37,6 @@
            return {
                current:0,
                list: [
                    '../../static/image/equ1.png',
                    'https://cdn.zebraui.com/zebra-ui/images/swipe-demo/swipe2.jpg',
                    'https://cdn.zebraui.com/zebra-ui/images/swipe-demo/swipe3.jpg',
                    'https://cdn.zebraui.com/zebra-ui/images/swipe-demo/swipe4.jpg',

 pages/tabBar/monitor.vue

@@ -5,7 +5,24 @@
            <block slot="content">机台监控</block>

        </cu-custom>

        <!-- <u-notice-bar :text="notice" mode="closable"  ></u-notice-bar> -->

        <!--  -->

	 
        <!--  <view class="nav uni-padding-wrap margin-bottom-xs">

            <u--image v-if="runStatu" :showLoading="true" :fade="true" duration="450"

                src="https://dev.shlanbao.cn:9999/fileTransfer/preview?userFileId=1645312976277106688&isMin=false&shareBatchNum=&extractionCode="

                width="100%" height="200px" mode="aspectFit">

                <template v-slot:loading>

                    <u-loading-icon></u-loading-icon>

                </template>

            </u--image>



            <u--image v-else :showLoading="true" :fade="true" duration="450"

                src="https://dev.shlanbao.cn:9999/fileTransfer/preview?userFileId=1645312976381964288&isMin=false&shareBatchNum=&extractionCode="

                width="100%" height="200px" mode="aspectFit">

                <template v-slot:loading>

                    <u-loading-icon></u-loading-icon>

                </template>

            </u--image>

        </view> -->

        <view class="uni-padding-wrap">

            <view class="page-section swiper">

                <view class="page-section-spacing">

@@ -45,14 +62,17 @@
            </view>
            <view class="text-gray  margin-top-xs">
                <text class="margin-right-xs">重量:</text>
                <text class="text-cyan margin-right-xs">{{$lget(model,'trendVo.weight')}}<text class="text-gray margin-left-xs">/</text></text>
                <text>  <text class="text-line-through">{{$lget(model,'originWeight')}}</text>  <text class="text-gray margin-left-xs">kg</text></text>
                <text class="text-cyan margin-right-xs">{{$lget(model,'trendVo.weight')}}<text

                        class="text-gray margin-left-xs">/</text></text>

                <text> <text class="text-line-through">{{$lget(model,'originWeight')}}</text> <text

                        class="text-gray margin-left-xs">kg</text></text>

             
            </view>
            
            <view class="text-gray  margin-top-xs">
                <text class="margin-right-xs">用时:</text>
                <text class="text-cyan">{{$lget(model,'trendVo.totalTime')}}<text class="text-gray margin-left-xs">min</text></text>
                <text class="text-cyan">{{$lget(model,'trendVo.totalTime')}}<text

                        class="text-gray margin-left-xs">min</text></text>

             
            </view>



@@ -66,8 +86,10 @@




                <view class="scoreBox">

                    <text class="text-gray text-sm">目标: <text class="text-green text-xl text-bold">{{$lget(model,'target')}}% </text> </text>

                    <text class="text-gray text-sm">初始: <text class="text-gray text-xl text-bold">{{$lget(model,'initial')}}% </text></text>

                    <text class="text-gray text-sm">目标: <text

                            class="text-green text-xl text-bold">{{$lget(model,'target')}}% </text> </text>

                    <text class="text-gray text-sm">初始: <text

                            class="text-gray text-xl text-bold">{{$lget(model,'initial')}}% </text></text>

                    

                    <!-- <view class="text-yellow text-xs flex justify-around">

                        <uni-text class="text-yellow cuIcon-favorfill"></uni-text>

@@ -329,7 +351,8 @@
            </view>

        </view>

        <view class="chartsMain">

            <qiun-data-charts type="area" :opts="opts" :animation="false" :canvas2d="true" :ontouch="true" :chartData="chartData" />

            <qiun-data-charts type="area" :opts="opts" :animation="false" :canvas2d="true" :ontouch="true"

                :chartData="chartData" />

        </view>





@@ -407,6 +430,7 @@




        },

	
        onLoad(e) {



        },

@@ -452,7 +476,9 @@
                }, 500);

            },





            /**
             * 组件数据
             */

            createData() {

                //温度数据 10s一次

                let bellowsTemp = this.$lget(this.model, 'bellowsTemp');

@@ -494,7 +520,7 @@
                        mList.push(mmap[key] || null)

                        xList.push(key)

                }
                //填充虚拟数据 TODO 删除
                //填充测试数据 TODO 删除

                // for(let i = 1 ; i <= 10 ; i++){
                //     tList.push(i*2)
                //     wList.push(i*100)
@@ -502,7 +528,7 @@
                //     xList.push(i)
                // }
                
                //d第一个数据为空 设置为第一次称重数据（没有称重数据则设置为0）
                //第一个数据为空 设置为第一次称重数据（没有称重数据则设置为0）

                if (!wList[0]) {
                    wList[0] = minW||0 
                }
@@ -540,19 +566,21 @@
                    color: '#1890ff'

                }]



                console.error(wmap)

                console.error(mmap)

                console.error("============")

                console.error(wList)

                console.error(mList)

                console.error(tList)

                // console.error(wmap)

                // console.error(mmap)

                // console.error("============")

                // console.error(wList)

                // console.error(mList)

                // console.error(tList)

                let res = {

                    categories: xList,

                    series: series

                }

                this.chartData = JSON.parse(JSON.stringify(res));

            },



            /**
             * 获取实时数据
             */

            getRealData() {

                this.$api.getRealTimeData(this.queryParam).then((res) => {

                    if (res.success) {

@@ -574,7 +602,7 @@
        computed: {

            //运行状态

            runStatu() {

                let stop = this.$lget(this.model, 'result.stop');

                let stop = this.$lget(this.model, 'stop');

                return !stop



            },

@@ -607,9 +635,10 @@
            },

            //干燥开始时间

            startTime() {

                if (this.model && this.model.detailList) {

                    if (this.model.detailList.length > 0) {

                        return this.model.detailList[0].tim

                let detailList = this.$lget(this.model, 'detailList')

                if (detailList) {

                    if (detailList.length > 0) {

                        return detailList[0].tim

                    }

                }

                return ""

@@ -706,4 +735,15 @@
        width: 100%;

        height: 300px;

    }



    .nav {

        background-color: white;

        width: 100%;

        height: 200px;



        image {

            width: 100%;

            height: 100%;

        }

    }

</style>

 static/image/equ1.png

Binary files differ