手机 适配

xufenglei

2018-08-03 ba26f3f66151ee19b0230c38fdbb989886e84c8c

手机 适配

 src/app/routes/forecasting-warning/forecasting-warning.component.html

@@ -12,24 +12,24 @@
</nz-card>



<div nz-row [ngStyle]="{'display':isShow ? 'block' : 'none'}">

    <div nz-col [nzSpan]="12"><div id="warning_PM25" style="height: 300px; width: 100%"></div></div>

    <div nz-col [nzSpan]="12"><div id="warning_PM10" style="height: 300px; width: 100%"></div></div>

    <div nz-col [nzSpan]="12"><div id="warning_CO" style="height: 300px; width: 100%"></div></div>

    <div nz-col [nzSpan]="12"><div id="warning_NO2" style="height: 300px; width: 100%"></div></div>

    <div nz-col [nzSpan]="12"><div id="warning_O3" style="height: 300px; width: 100%"></div></div>

    <div nz-col [nzSpan]="12"><div id="warning_SO2" style="height: 300px; width: 100%"></div></div>

    <div nz-col nzXs="24" nzSm="12" nzMd="12"><div id="warning_PM25" style="height: 300px; width: 100%"></div></div>

    <div nz-col nzXs="24" nzSm="12" nzMd="12"><div id="warning_PM10" style="height: 300px; width: 100%"></div></div>

    <div nz-col nzXs="24" nzSm="12" nzMd="12"><div id="warning_CO" style="height: 300px; width: 100%"></div></div>

    <div nz-col nzXs="24" nzSm="12" nzMd="12"><div id="warning_NO2" style="height: 300px; width: 100%"></div></div>

    <div nz-col nzXs="24" nzSm="12" nzMd="12"><div id="warning_O3" style="height: 300px; width: 100%"></div></div>

    <div nz-col nzXs="24" nzSm="12" nzMd="12"><div id="warning_SO2" style="height: 300px; width: 100%"></div></div>

</div>



<div nz-row [ngStyle]="{'display':isShow ? 'none' : 'block'}">

    <!-- 24小时 -->

    <div nz-col [nzSpan]="12"><div id="forecasting_temp" style="height: 300px; width: 100%"></div></div>

    <div nz-col [nzSpan]="12"><div id="forecasting_humidity" style="height: 300px; width: 100%"></div></div>

    <div nz-col [nzSpan]="12"><div id="forecasting_pressure" style="height: 300px; width: 100%"></div></div>

    <div nz-col [nzSpan]="12"><div id="forecasting_uvi" style="height: 300px; width: 100%"></div></div>

    <div nz-col [nzSpan]="12"><div id="forecasting_wind" style="height: 300px; width: 100%"></div></div>

    <div nz-col nzXs="24" nzSm="12" nzMd="12"><div id="forecasting_temp" style="height: 300px; width: 100%"></div></div>

    <div nz-col nzXs="24" nzSm="12" nzMd="12"><div id="forecasting_humidity" style="height: 300px; width: 100%"></div></div>

    <div nz-col nzXs="24" nzSm="12" nzMd="12"><div id="forecasting_pressure" style="height: 300px; width: 100%"></div></div>

    <div nz-col nzXs="24" nzSm="12" nzMd="12"><div id="forecasting_uvi" style="height: 300px; width: 100%"></div></div>

    <div nz-col nzXs="24" nzSm="12" nzMd="12"><div id="forecasting_wind" style="height: 300px; width: 100%"></div></div>



    <!-- 15天 -->

    <div nz-col [nzSpan]="12"><div id="forecasting_temp_day" style="height: 300px; width: 100%"></div></div>

    <div nz-col nzXs="24" nzSm="12" nzMd="12"><div id="forecasting_temp_day" style="height: 300px; width: 100%"></div></div>

    <!-- <div nz-col [nzSpan]="12"><div id="forecasting_uvi" style="height: 300px; width: 100%"></div></div> -->



</div>


 src/app/routes/raise-dust/image-grabbing/image-grabbing.component.html

@@ -5,7 +5,7 @@
<nz-card [nzBordered]="false">

    <form nz-form [nzLayout]="'inline'">

        <div nz-row [nzGutter]="24" >

            <div nz-col [nzSpan]="5" class="mb-md">

            <div nz-col nzXs="24" nzSm="12" nzMd="6"  class="mb-md">

                <div nz-form-item class="d-flex">

                    <div nz-form-label class="label-width-70">

                        <label>监测站点</label>

@@ -18,7 +18,7 @@
                    </div>

                </div>

            </div>

            <div nz-col [nzSpan]="5" class="mb-md">

            <div nz-col nzXs="24" nzSm="12" nzMd="6"  class="mb-md">

                <div nz-form-item class="d-flex">

                    <div nz-form-label class="label-width-70">

                        <label>设备</label>


 src/app/routes/raise-dust/real-time/real-time.component.html

@@ -4,7 +4,7 @@


<form nz-form [nzLayout]="'inline'">

    <div nz-row [nzGutter]="24">

        <div nz-col [nzSpan]="6" class="mb-md">

        <div nz-col nzXs="24" nzSm="12" nzMd="6" class="mb-md">

            <div nz-form-item class="d-flex">

                <div nz-form-label>

                    <label>监测站点</label>

@@ -55,7 +55,7 @@
</div>



<div nz-row [nzGutter]="24" class="pt-lg" *ngIf="!!avgs.e1">

    <div nz-col [nzSpan]="12" nzType="flex" nzAlign="middle">

    <div nz-col nzXs="24" nzSm="12" nzMd="6" nzType="flex" nzAlign="middle">

        <h2>

            <span style="color:#666666;">污染级别：</span> 

            <span style="color:#FF0000;">{{avgs.e1 > levels[0] ? (avgs.e1 &lt; levels[1] ? '轻度' : (avgs.e1 &lt; levels[2]? '中度':'严重' )) : '无'}}污染</span> 


 src/app/routes/raise-dust/statistical-query/statistical-query.component.html

@@ -5,7 +5,7 @@
<nz-card [nzBordered]="false">

    <form nz-form  (ngSubmit)="reportQuery()" [nzLayout]="'inline'">

        <div nz-row [nzGutter]="24" >

            <div nz-col [nzSpan]="5" class="mb-md">

            <div nz-col nzXs="24" nzSm="12" nzMd="6" class="mb-md">

                <div nz-form-item class="d-flex">

                    <div nz-form-label class="label-width-70">

                        <label>项目</label>

@@ -17,7 +17,7 @@
                    </div>

                </div>

            </div>

            <div nz-col [nzSpan]="5" class="mb-md">

            <div nz-col nzXs="24" nzSm="12" nzMd="6"  class="mb-md">

                <div nz-form-item class="d-flex">

                    <div nz-form-label class="label-width-70">

                        <label>监测站点</label>

@@ -30,7 +30,7 @@
                    </div>

                </div>

            </div>

            <div nz-col [nzSpan]="5" class="mb-md">

            <div nz-col nzXs="24" nzSm="12" nzMd="6"  class="mb-md">

                <div nz-form-item class="d-flex">

                    <div nz-form-label class="label-width-70">

                        <label>类型</label>

@@ -42,7 +42,7 @@
                    </div>

                </div>

            </div>

            <div nz-col [nzSpan]="5" class="mb-md">

            <div nz-col nzXs="24" nzSm="12" nzMd="6"  class="mb-md">

                <div nz-form-item class="d-flex">

                    <div nz-form-label class="label-width-70">

                        <label>时间</label>

@@ -56,7 +56,7 @@
        </div>



        <div nz-row [nzGutter]="24">

            <div nz-col [nzSpan]="6" class="mb-md">

            <div nz-col nzXs="24" nzSm="12" nzMd="6"  class="mb-md">

                <button nz-button type="submit" [nzType]="'primary'" [nzSize]="'large'">

                    查询

                </button>