sony-ble/pages/light/light.wxml

<!--pages/light/light.wxml-->
<view class="lamp" hover-class="none" hover-stop-propagation="false">
    <view class="lamp_header">
        <scanHandle 
            state="{{ble.state}}" 
            dev-name="{{ble.devName}}"
            bindsearchDevice="searchDeviceHandle"
            />
    </view>
    

    <view class="lamp__content" style="background-color:{{lamp.bgc}}">
        <tabList
        wx:if="{{ble.state === connectStateTypes.scaning || ble.state === connectStateTypes.connecting}}"
        ble-devs="{{ bleDevs }}"
        bindconnectDev="connectDevHandle">
        </tabList>
        <!-- 灯光控制 -->

        <view class="lampControl" 
        wx:if="{{ble.state === connectStateTypes.connected}}"
        
        >
            <!-- 占位块 -->
            <view class="lampControl__placeholder"></view>
            <!-- 开关 -->
            <view class="lampControl_chunk lampControl_title lampControl__switch"
            bindtap="switchHandle"
            >
                <!-- icon -->
                <view class="{{lamp.switch?'lampControl__switch switch-open':'lampControl__switch'  }}">
                    <image src="/icons/png/switch.png" />
                </view>
                <!-- 文字 -->
                <view class="lampControl__switch-text">
                    <text>{{lamp.switch ? '关闭' : '打开'}}</text>
                </view>
            </view>

            <!-- 亮度 -->
            <view class="lampControl_chunk lampControl__brightness">
                <!-- 文字 -->
                <view class="lampControl_title">
                    <text>亮度</text>
                    <!-- 值 -->
                    <text class="subTitle">{{lamp.brightness}}%</text>
                </view>
                <!-- 滑块 -->
                <view class="lampControl_slider">
                    <slider 
                    value="{{lamp.brightness}}" 
                    min="0" 
                    max="100" 
                    disabled="{{!lamp.switch}}"
                    bindchange="brightnessChangeHandle"
                    />
                </view>
            </view>

            <!-- 色温 -->
            <view class="lampControl_chunk lampControl__color">
                <!-- 文字 -->
                <view class="lampControl_title">
                    <text>色温</text>
                    <!-- 分隔装饰 -->
                    <!-- 值 -->
                    <text class="subTitle">{{lamp.colorTemperature}}K</text>
                </view>
                <!-- 滑块 -->
                <view class="lampControl_slider">
                    <slider 
                    value="{{lamp.colorTemperature}}" 
                    min="{{lamp.temp_min}}" 
                    max="{{lamp.temp_max}}" 
                    step="{{lamp.temp_step}}" 
                    disabled="{{!lamp.switch || lamp.fullOpen}}"
                    bindchange="colorChangeHandle"
                    />
                </view>
            </view>

            <view class="lampControl_chunk lampControl_title lampControl__color"
            bindtap="fullModeSwitchHandle"
            >
            <!-- icon -->
                <view class="{{lamp.fullOpen?'lampControl__switch switch-open':'lampControl__switch'  }}">
                    <image src="/icons/png/switch.png" />
                </view>
                <!-- 文字 -->
                <view class="lampControl__switch-text">
                    <text>{{lamp.fullOpen ? '关闭' : '全开模式'}}</text>
                </view>
            </view>

            <!-- todo: 更多自定义模式 -->

        </view>

        <!-- 灯光控制 end -->

        <!-- 开始扫描按钮 -->
        <view class="lampControl lampControl__scan"
        wx:if="{{ble.state === connectStateTypes.unConnect}}"
        bindtap="searchDeviceHandle"
        >
            <view class="scanBtn" hover-class="none" hover-stop-propagation="false">
                开始扫描
            </view>
        </view>

    </view>
</view>