miniProgram/subpages/sleepEvaluation/sleepEvaluation.wxml

<view style="width: 100vw;height: 100vh; background: #CCEDF5;">
  <scroll-view scroll-y="true"
    style="height: 100vh;background: #CCEDF5;min-height: 100vh;overflow-x: hidden;overflow-y: auto;"
    scroll-into-view="{{mInputId}}">

    <view class="container">
      <image src="/subpages/images/testb_banner.png" style="display: block;width: 100vw;" mode="widthFix"></image>
      <wxs module="jstools" src="/subpages/wxs/includes.wxs"></wxs>
      <!-- 基本信息 -->
      <view class="section-top">
        <image src="/subpages/images/testb_bg.png" style="display: block;width: 100%;" mode="widthFix"></image>
        <text
          class="tips">您好！非常感谢您在百忙之中填写这份问卷。为了更好地了解您的入住体验，并根据您的建议进行持续完善。我们特此开展此次调查。请您根据自己的实际情况如实回答，所有数据将严格保密，仅用于研究分析。本问卷大约需要5-10分钟时间，请您耐心完成。您的意见对于我们而言至关重要。</text>
      </view>
      <view class='title_1'>一、基本信息</view>
      <view class="section" id="age">
        <text>1.您的年龄：</text>
        <van-radio-group value="{{ age }}" bind:change="bindAgeChange">
          <van-radio wx:for="{{ageOptions}}" wx:key="index" name="{{item.value}}" checked-color="#0ABCA4"
            custom-class="custom-radio-class" use-icon-slot>
            <view class="radio-view">
              <image class="radio-icon" slot="icon" src="{{ age === item.value ? activeIcon : normalIcon }}" />
              <text class="radio-title"
                style="{{ age === item.value ? activeColor : normalColor }}">{{item.label}}</text>
            </view>

          </van-radio>
        </van-radio-group>



      </view>
      <view class="section" id="career">
        <text>2.您的职业：</text>
        <van-radio-group value="{{ career }}" bind:change="bindCareerChange">
          <van-radio wx:for="{{careerOptions}}" wx:key="index" name="{{item.value}}" checked-color="#0ABCA4"
            custom-class="custom-radio-class" use-icon-slot>
            <view class="radio-view">
              <image class="radio-icon" slot="icon" src="{{ career === item.value ? activeIcon : normalIcon }}" />
              <text class="radio-title"
                style="{{ career === item.value ? activeColor : normalColor }}">{{item.label}}</text>
            </view>
          </van-radio>
        </van-radio-group>

        <input type="text" placeholder="请填写您的职业" bindinput="bindCareerInputInput" />
      </view>
      <view class="section" id="gender">
        <text>3.您的性别：</text>

        <van-radio-group value="{{ gender }}" bind:change="bindGenderChange">
          <van-radio name='0' checked-color="#0ABCA4" custom-class="custom-radio-class" use-icon-slot>
            <view class="radio-view">
              <image class="radio-icon" slot="icon" src="{{ gender === '0' ? activeIcon : normalIcon }}" />
              <text class="radio-title" style="{{ gender === '0' ? activeColor : normalColor }}">男</text>
            </view>
          </van-radio>
          <van-radio name='1' checked-color="#0ABCA4" custom-class="custom-radio-class" use-icon-slot>
            <view class="radio-view">
              <image class="radio-icon" slot="icon" src="{{ gender === '1' ? activeIcon : normalIcon }}" />
              <text class="radio-title" style="{{ gender === '1' ? activeColor : normalColor }}">女</text>
            </view>
          </van-radio>
          <van-radio name='2' checked-color="#0ABCA4" custom-class="custom-radio-class" use-icon-slot>
            <view class="radio-view">
              <image class="radio-icon" slot="icon" src="{{ gender === '2' ? activeIcon : normalIcon }}" />
              <text class="radio-title" style="{{ gender === '2' ? activeColor : normalColor }}">不愿透露</text>
            </view>
          </van-radio>
        </van-radio-group>
      </view>

      <view class="section" id="channel">
        <text>4、您是通过什么渠道预定到的本酒店睡眠房？</text>


        <van-radio-group value="{{ channel }}" bind:change="bindChannelChange">

          <van-radio name='0' checked-color="#0ABCA4" custom-class="custom-radio-class" use-icon-slot>
            <view class="radio-view">
              <image class="radio-icon" slot="icon" src="{{ channel === '0' ? activeIcon : normalIcon }}" />
              <text class="radio-title" style="{{ channel === '0' ? activeColor : normalColor }}">酒店散客</text>
            </view>
          </van-radio>
          <van-radio name='1' checked-color="#0ABCA4" custom-class="custom-radio-class" use-icon-slot>
            <view class="radio-view">
              <image class="radio-icon" slot="icon" src="{{ channel === '1' ? activeIcon : normalIcon }}" />
              <text class="radio-title" style="{{ channel === '1' ? activeColor : normalColor }}">朋友推荐</text>
            </view>
          </van-radio>
          <van-radio name='2' checked-color="#0ABCA4" custom-class="custom-radio-class" use-icon-slot>
            <view class="radio-view">
              <image class="radio-icon" slot="icon" src="{{ channel === '2' ? activeIcon : normalIcon }}" />
              <text class="radio-title"
                style="{{ channel === '2' ? activeColor : normalColor }}">第三方平台（如携程、去哪儿网、飞猪、同程等）</text>
            </view>
          </van-radio>
        </van-radio-group>
        <input type="text" placeholder="请填写第三方平台" bindinput="bindThirdPlatformsInputInput" />
      </view>
      <view class='title_1'>二、用户体验</view>
      <!-- 睡眠环境评价 -->
      <view class="section" id="stayExper">
        <text>5、睡眠房的入住体验怎么样？</text>

        <van-radio-group value="{{ stayExper }}" bind:change="bindStayExperOptions">
          <van-radio wx:for="{{stayExperOptions}}" wx:key="index" name="{{item.value}}" checked-color="#0ABCA4"
            custom-class="custom-radio-class" use-icon-slot>
            <view class="radio-view">
              <image class="radio-icon" slot="icon" src="{{ stayExper === item.value ? activeIcon : normalIcon }}" />
              <text class="radio-title"
                style="{{ stayExper === item.value ? activeColor : normalColor }}">{{item.label}}</text>
            </view>
          </van-radio>
        </van-radio-group>
      </view>

      <view class="section" id="satisfied">
        <text>6、入住之后，您觉得哪些方面让您比较满意？（多选）</text>
        <van-checkbox-group value="{{ satisfied }}" bind:change="bindSatisfied">
          <van-checkbox wx:for="{{satisfiedOptions}}" wx:key="index" shape="square" checked-color="#0ABCA4"
            name="{{item.value}}" custom-class="custom-radio-class" use-icon-slot>
            <view class="radio-view">
              <image class="radio-icon" slot="icon"
                src="{{ jstools.includes(satisfied,item.value) ? activeIcon : normalIcon }}" />
              <text class="radio-title"
                style="{{  jstools.includes(satisfied,item.value) ? activeColor : normalColor }}">{{item.label}}</text>
            </view>
          </van-checkbox>
        </van-checkbox-group>

      </view>

      <view class="section" id="noSatisfied">
        <text>7、让您对本次睡眠房入住体验不满意的原因是？</text>


        <van-radio-group value="{{ noSatisfied }}" bind:change="bindNoSatisfiedChange">
          <van-radio wx:for="{{noSatisfiedOptions}}" wx:key="index" name="{{item.value}}" checked-color="#0ABCA4"
            custom-class="custom-radio-class" use-icon-slot>
            <view class="radio-view">
              <image class="radio-icon" slot="icon" src="{{ noSatisfied === item.value ? activeIcon : normalIcon }}" />
              <text class="radio-title"
                style="{{ noSatisfied === item.value ? activeColor : normalColor }}">{{item.label}}</text>
            </view>
          </van-radio>
        </van-radio-group>

        <input type="text" placeholder="请填写体验不满意的原因" bindinput="bindNoSatisfiedInput" />
      </view>

      <view class="section" id="improvementSleep">
        <text>8、您通常采取什么措施来改善睡眠？（多选）</text>

        <van-checkbox-group value="{{ improvementSleep }}" bind:change="bindImprovementSleep">
          <van-checkbox wx:for="{{improvementSleepOptions}}" wx:key="index" shape="square" checked-color="#0ABCA4"
            name="{{item.value}}" custom-class="custom-radio-class" use-icon-slot>
            <view class="radio-view">
              <image class="radio-icon" slot="icon"
                src="{{ jstools.includes(improvementSleep,item.value) ? activeIcon : normalIcon }}" />
              <text class="radio-title"
                style="{{  jstools.includes(improvementSleep,item.value) ? activeColor : normalColor }}">{{item.label}}</text>
            </view>
          </van-checkbox>
        </van-checkbox-group>
      </view>

      <view class="section" id="wayImprovementSleep">
        <text>9、您倾向于下面哪些方式来帮助改善睡眠？（多选）</text>


        <van-checkbox-group value="{{ wayImprovementSleep }}" bind:change="bindWayImprovementSleep">
          <van-checkbox wx:for="{{wayImprovementSleepOptions}}" wx:key="index" shape="square" checked-color="#0ABCA4"
            name="{{item.value}}" custom-class="custom-radio-class" use-icon-slot>
            <view class="radio-view">
              <image class="radio-icon" slot="icon"
                src="{{ jstools.includes(wayImprovementSleep,item.value) ? activeIcon : normalIcon }}" />
              <text class="radio-title"
                style="{{  jstools.includes(wayImprovementSleep,item.value) ? activeColor : normalColor }}">{{item.label}}</text>
            </view>
          </van-checkbox>
        </van-checkbox-group>
        <input type="text" placeholder="请填写帮助改善睡眠方式" bindinput="bindWayImprovementSleepInput" />
      </view>


      <view class="section" id="getSleepHealth">
        <text>10、您通常从哪里获取关于睡眠健康的信息？（多选）</text>
        <van-checkbox-group value="{{ getSleepHealth }}" bind:change="bindGetSleepHealth">
          <van-checkbox wx:for="{{getSleepHealthOptions}}" wx:key="index" shape="square" checked-color="#0ABCA4"
            name="{{item.value}}" custom-class="custom-radio-class" use-icon-slot>
            <view class="radio-view">
              <image class="radio-icon" slot="icon"
                src="{{ jstools.includes(getSleepHealth,item.value) ? activeIcon : normalIcon }}" />
              <text class="radio-title"
                style="{{  jstools.includes(getSleepHealth,item.value) ? activeColor : normalColor }}">{{item.label}}</text>
            </view>
          </van-checkbox>
        </van-checkbox-group>
        <input type="text" placeholder="请填写从哪里获取关于睡眠健康的信息" bindinput="bindGetSleepHealthInput" />

      </view>
      <view class='title_1'>三、影响睡眠的因素</view>
      <view class="section" id="influenceSleep">
        <text>11、您认为以下哪些因素会影响您的睡眠？（多选）</text>


        <van-checkbox-group value="{{ influenceSleep }}" bind:change="bindInfluenceSleep">
          <van-checkbox wx:for="{{influenceSleepOptions}}" wx:key="index" shape="square" checked-color="#0ABCA4"
            name="{{item.value}}" custom-class="custom-radio-class" use-icon-slot>
            <view class="radio-view">
              <image class="radio-icon" slot="icon"
                src="{{ jstools.includes(influenceSleep,item.value) ? activeIcon : normalIcon }}" />
              <text class="radio-title"
                style="{{  jstools.includes(influenceSleep,item.value) ? activeColor : normalColor }}">{{item.label}}</text>
            </view>
          </van-checkbox>
        </van-checkbox-group>

        <input type="text" placeholder="请填写影响您的睡眠因素" bindinput="bindInfluenceSleepInput" />
      </view>

      <view class="section" id="improvSleepMethods">
        <text>12、您通常使用什么方法来改善睡眠质量？（多选）</text>
        <van-checkbox-group value="{{ improvSleepMethods }}" bind:change="bindImprovSleepMethods">
          <van-checkbox wx:for="{{improvSleepMethodsOptions}}" wx:key="index" shape="square" checked-color="#0ABCA4"
            name="{{item.value}}" custom-class="custom-radio-class" use-icon-slot>
            <view class="radio-view">
              <image class="radio-icon" slot="icon"
                src="{{ jstools.includes(improvSleepMethods,item.value) ? activeIcon : normalIcon }}" />
              <text class="radio-title"
                style="{{  jstools.includes(improvSleepMethods,item.value) ? activeColor : normalColor }}">{{item.label}}</text>
            </view>
          </van-checkbox>
        </van-checkbox-group>

        <input type="text" placeholder="请填写改善睡眠质量方法" bindinput="bindImprovSleepMethodsInput" />

      </view>
      <view class='title_1'>四、其他意见和建议</view>
      <!-- 文本输入问题示例 -->
      <view class="section" id="suggestion">
        <text>13. 关于本次睡眠房的入住体验，您最希望哪些方面可以进行改善优化</text>
        <textarea class="full-width-textarea" type="text" placeholder="请填写您的建议" bindinput="bindSuggestionInput" />
      </view>

      <!-- 提交按钮 -->
      <text class="commit-btn" bindtap="submitSurvey">提交问卷</text>
      <view style="height: 80rpx;"></view>
      <!-- <view class="bottom-view">
      <text style="font-weight:600">感谢您的参与和支持！</text>
      <text
        style="font-size: 28rpx;margin-top: 30rpx;color: #666666;">通过这份问卷，我们可以更好地了解受访者的睡眠状况及其影响因素，从而为他们提供更有效的改善建议。希望您能如实填写，以便我们为您提供更好的服务。</text>
    </view> -->

    </view>
  </scroll-view>

</view>