<template>
  <HeaderNav :title="title" :is-back="true"></HeaderNav>
  <view class="body-background">

  </view>
  <u-row :custom-style="{padding:'16rpx 26rpx',boxSizing:'border-box'}">
    <u-col :span="12" :custom-style="{
      backgroundColor:'#FFFFFF',
      borderRadius:'20rpx',
      padding:'40rpx 32rpx',
      position:'relative'
    }">
      <u-form
          errorType="toast"
          labelWidth="auto"
          labelPosition="left"
          :model="model"
          :rules="rules"
          ref="feedForm"
          border-bottom
      >
        <view>
         <view class="">
           <view class="" style="padding:30rpx 0;border-bottom:1rpx solid #f5f5f5;" @click="changeCollapse('0')">
             <u-text text="萌宠居家情况反馈（原始状态）" size="30" suffix-icon="arrow-right"></u-text>
           </view>
           <view v-if="collapseChecked === '0'" custom-style="padding:0" name="0">

             <u-form-item
                 prop="remark"
                 :custom-style="{padding:'0',marginBottom:'30rpx'}"
             >
               <mz-card>
                 <view class="form-label">
                   <view class="title row" style="position:relative;justify-content: flex-start;width:100%;top:0rpx;left:0;">
                     <view class="value col" style="position: relative;text-align: left;">

                       <!--        <u-text text="协议内容" size="38" color="#191919"></u-text>-->
                       <view class="" style="position: relative;display:inline-block;">
                         <view style="color:#191919;font-size:30rpx;display:inline-block;position: relative;z-index: 2;">门窗、灯、空调、水电等情况</view>
                         <view class="background" style="width:100%;height:50%;position: absolute;bottom:0;left:0;background-color:rgba(227, 191, 119, 0.6);display:inline-block;z-index:1;"></view>
                       </view>
                     </view>
                   </view>
                   <!--                  <u-text size="30" text="门窗、灯、空调、水电等情况"></u-text>-->
                 </view>
                 <view class="radio row" style="padding-bottom:30rpx;">
                   <view class="radio-box row col" v-for="item in ['全部关闭','部分未关闭']" style="width:auto;align-items: center;" @click="applianceChange(item)">
                     <view class="box "
                           style="display:flex;justify-content:center;align-items:center;
                           width:35rpx;height:35rpx;border-radius: 50%;border:2rpx solid;background-color:#4EC2B7;
                            margin-right:15rpx;"
                           :style="{
                             borderColor:(model.appliance.option === item ? 'transparent':'#c8c9cc'),
                             backgroundColor:(model.appliance.option === item ? '#4EC2B7':'transparent')
                           }"
                     >
                       <u-icon name="checkbox-mark" size="25rpx" :color="(model.appliance.option === item ? '#fff' : 'transparent')"></u-icon>
                     </view>
                     <view class="label ">
                       {{item}}
                     </view>
                   </view>
                 </view>
<!--                 <u-radio-group size="40" @change="applianceChange" v-model="model.appliance.option">-->
<!--                   <u-radio name="全部关闭" label="全部关闭" labelSize="28" icon-size="28" active-color="#4EC2B7"-->
<!--                            custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-radio>-->
<!--                   <u-radio name="部分未关闭" label="部分未关闭" labelSize="28" icon-size="28" active-color="#4EC2B7"-->
<!--                            custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-radio>-->
<!--                 </u-radio-group>-->
                 <uv-upload
                     accept="media"
                     width="160rpx"
                     height="160rpx"
                     :fileList="images.appliance"
                     name="1"
                     multiple
                     :maxCount="10"
                     uploadIcon="plus"
                     @delete="(res) => {uploadDel(res,'appliance')}"
                     @afterRead="(res) => {uploadPut(res,'appliance')}"
                 ></uv-upload>
                 <u-textarea
                     v-model="model.appliance.remark"
                     border="none"
                     placeholder="请描述您遇到的问题"
                     height="220"
                     :custom-style="{
                backgroundColor:'#FAFAFA',
                padding:'20rpx 20rpx'
              }"
                 ></u-textarea>
               </mz-card>
             </u-form-item>
             <u-form-item
                 prop="remark"
                 :custom-style="{padding:'0',marginBottom:'30rpx;'}"
             >
               <mz-card>
                 <view class="form-label">
                   <view class="title row" style="position:relative;justify-content: flex-start;width:100%;top:0rpx;left:0;">
                     <view class="value col" style="position: relative;text-align: left;">

                       <!--        <u-text text="协议内容" size="38" color="#191919"></u-text>-->
                       <view class="" style="position: relative;display:inline-block;">
                         <view style="color:#191919;font-size:30rpx;display:inline-block;position: relative;z-index: 2;">入户前萌宠家居情况</view>
                         <view class="background" style="width:100%;height:50%;position: absolute;bottom:0;left:0;background-color:rgba(227, 191, 119, 0.6);display:inline-block;z-index:1;"></view>
                       </view>
                     </view>
                   </view>
                   <!--                  <u-text size="30" text="入户前萌宠家居情况"></u-text>-->
                 </view>
                 <view class="radio row" style="padding-bottom:30rpx;">
                   <view class="radio-box row col" v-for="item in ['未破坏','捣蛋破坏']" style="width:auto;align-items: center;" @click="beforeStatusChange(item)">
                     <view class="box "
                           style="display:flex;justify-content:center;align-items:center;
                           width:35rpx;height:35rpx;border-radius: 50%;border:2rpx solid;background-color:#4EC2B7;
                            margin-right:15rpx;"
                           :style="{
                             borderColor:(model.before_status.option === item ? 'transparent':'#c8c9cc'),
                             backgroundColor:(model.before_status.option === item ? '#4EC2B7':'transparent')
                           }"
                     >
                       <u-icon name="checkbox-mark" size="25rpx" :color="(model.before_status.option === item ? '#fff' : 'transparent')"></u-icon>
                     </view>
                     <view class="label ">
                       {{item}}
                     </view>
                   </view>
                 </view>
<!--                 <u-radio-group v-model="model.before_status.option" size="40" @change="beforeStatusChange">-->
<!--                   <u-radio name="未破坏" label="未破坏" labelSize="28" icon-size="28" active-color="#4EC2B7"-->
<!--                            custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-radio>-->
<!--                   <u-radio name="捣蛋破坏" label="捣蛋破坏" labelSize="28" icon-size="28" active-color="#4EC2B7"-->
<!--                            custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-radio>-->
<!--                 </u-radio-group>-->
                 <uv-upload
                     accept="media"
                     width="160rpx"
                     height="160rpx"
                     :fileList="images.before_status"
                     name="1"
                     multiple
                     :maxCount="10"
                     uploadIcon="plus"
                     @delete="(res) => {uploadDel(res,'before_status')}"
                     @afterRead="(res) => {uploadPut(res,'before_status')}"
                 ></uv-upload>
                 <u-textarea
                     v-model="model.before_status.remark"
                     border="none"
                     placeholder="请描述您遇到的问题"
                     height="220"
                     :custom-style="{
                backgroundColor:'#FAFAFA',
                padding:'20rpx 20rpx'
              }"
                 ></u-textarea>
               </mz-card>
             </u-form-item>
             <u-form-item
                 prop="arriveTime"
                 :custom-style="{padding:'0',paddingBottom:'30rpx;'}"
             >
               <mz-card>
                 <view class="form-label">
                   <view class="title row" style="position:relative;justify-content: flex-start;width:100%;top:0rpx;left:0;">
                     <view class="value col" style="position: relative;text-align: left;">

                       <!--        <u-text text="协议内容" size="38" color="#191919"></u-text>-->
                       <view class="" style="position: relative;display:inline-block;">
                         <view style="color:#191919;font-size:30rpx;display:inline-block;position: relative;z-index: 2;">萌宠生活区情况</view>
                         <view class="background" style="width:100%;height:50%;position: absolute;bottom:0;left:0;background-color:rgba(227, 191, 119, 0.6);display:inline-block;z-index:1;"></view>
                       </view>
                     </view>
                   </view>
                   <!--                  <u-text size="30" text="萌宠生活区情况"></u-text>-->
                 </view>
                 <uv-upload
                     accept="media"
                     width="160rpx"
                     height="160rpx"
                     :fileList="images.pet_status"
                     name="1"
                     multiple
                     :maxCount="10"
                     uploadIcon="plus"
                     @delete="(res) => {uploadDel(res,'pet_status')}"
                     @afterRead="(res) => {uploadPut(res,'pet_status')}"
                 ></uv-upload>
                 <u-textarea
                     v-model="model.pet_status.remark"
                     border="none"
                     placeholder="请描述您遇到的问题"
                     height="220"
                     :custom-style="{
                backgroundColor:'#FAFAFA',
                padding:'20rpx 20rpx'
              }"
                 ></u-textarea>
               </mz-card>
             </u-form-item>
             <u-form-item
                 prop="userInfo.sex"
                 :custom-style="{padding:'0',marginBottom:'30rpx;'}"
             >
               <mz-card>
                 <view class="form-label">
                   <view class="title row" style="position:relative;justify-content: flex-start;width:100%;top:0rpx;left:0;">
                     <view class="value col" style="position: relative;text-align: left;">

                       <!--        <u-text text="协议内容" size="38" color="#191919"></u-text>-->
                       <view class="" style="position: relative;display:inline-block;">
                         <view style="color:#191919;font-size:30rpx;display:inline-block;position: relative;z-index: 2;">萌宠食物剩余情况</view>
                         <view class="background" style="width:100%;height:50%;position: absolute;bottom:0;left:0;background-color:rgba(227, 191, 119, 0.6);display:inline-block;z-index:1;"></view>
                       </view>
                     </view>
                   </view>
                   <!--                  <u-text size="30" text="萌宠食物剩余情况"></u-text>-->
                 </view>
                 <view class="form-label">
                   <u-text size="24" color="#999" text="萌宠粮"></u-text>
                 </view>

                 <view class="radio row" style="padding-bottom:30rpx;">
                   <view class="radio-box row col" v-for="item in ['充足','少量','无']" style="width:auto;align-items: center;" @click="foodChange(item)">
                     <view class="box "
                           style="display:flex;justify-content:center;align-items:center;
                           width:35rpx;height:35rpx;border-radius: 50%;border:2rpx solid;background-color:#4EC2B7;
                            margin-right:15rpx;"
                           :style="{
                             borderColor:(model.food_status.food_option === item ? 'transparent':'#c8c9cc'),
                             backgroundColor:(model.food_status.food_option === item ? '#4EC2B7':'transparent')
                           }"
                     >
                       <u-icon name="checkbox-mark" size="25rpx" :color="(model.food_status.food_option === item ? '#fff' : 'transparent')"></u-icon>
                     </view>
                     <view class="label ">
                       {{item}}
                     </view>
                   </view>
                 </view>

<!--                 <u-radio-group v-model="model.food_status.food_option" @change="foodChange" size="40">-->
<!--                   <u-radio name="充足" label="充足" labelSize="28" icon-size="28" active-color="#4EC2B7"-->
<!--                            custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-radio>-->
<!--                   <u-radio name="少量" label="少量" labelSize="28" icon-size="28" active-color="#4EC2B7"-->
<!--                            custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-radio>-->
<!--                   <u-radio name="无" label="无" labelSize="28" icon-size="28" active-color="#4EC2B7"-->
<!--                            custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-radio>-->
<!--                 </u-radio-group>-->

                 <view class="form-label">
                   <u-text size="24" color="#999" text="萌宠水"></u-text>
                 </view>

                 <view class="radio row" style="padding-bottom:30rpx;">
                   <view class="radio-box row col" v-for="item in ['充足','少量','无']" style="width:auto;align-items: center;" @click="waterChange(item)">
                     <view class="box "
                           style="display:flex;justify-content:center;align-items:center;
                           width:35rpx;height:35rpx;border-radius: 50%;border:2rpx solid;background-color:#4EC2B7;
                            margin-right:15rpx;"
                           :style="{
                             borderColor:(model.food_status.water_option === item ? 'transparent':'#c8c9cc'),
                             backgroundColor:(model.food_status.water_option === item ? '#4EC2B7':'transparent')
                           }"
                     >
                       <u-icon name="checkbox-mark" size="25rpx" :color="(model.food_status.water_option === item ? '#fff' : 'transparent')"></u-icon>
                     </view>
                     <view class="label ">
                       {{item}}
                     </view>
                   </view>
                 </view>
<!--                 <u-radio-group v-model="model.food_status.water_option" @change="waterChange" size="40">-->
<!--                   <u-radio name="充足" label="充足" labelSize="28" icon-size="28" active-color="#4EC2B7"-->
<!--                            custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-radio>-->
<!--                   <u-radio name="少量" label="少量" labelSize="28" icon-size="28" active-color="#4EC2B7"-->
<!--                            custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-radio>-->
<!--                   <u-radio name="无" label="无" labelSize="28" icon-size="28" active-color="#4EC2B7"-->
<!--                            custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-radio>-->
<!--                 </u-radio-group>-->
                 <uv-upload
                     accept="media"
                     width="160rpx"
                     height="160rpx"
                     :fileList="images.food_status"
                     name="1"
                     multiple
                     :maxCount="10"
                     uploadIcon="plus"
                     @delete="(res) => {uploadDel(res,'food_status')}"
                     @afterRead="(res) => {uploadPut(res,'food_status')}"
                 ></uv-upload>
                 <u-textarea
                     v-model="model.food_status.remark"
                     border="none"
                     placeholder="请描述您遇到的问题"
                     height="220"
                     :custom-style="{
                backgroundColor:'#FAFAFA',
                padding:'20rpx 20rpx'
              }"
                 ></u-textarea>
               </mz-card>
             </u-form-item>
             <u-form-item
                 prop="userInfo.sex"
                 :custom-style="{padding:'0',marginBottom:'30rpx;'}"
             >
               <mz-card>
                 <view class="form-label">
                   <view class="title row" style="position:relative;justify-content: flex-start;width:100%;top:0rpx;left:0;">
                     <view class="value col" style="position: relative;text-align: left;">

                       <!--        <u-text text="协议内容" size="38" color="#191919"></u-text>-->
                       <view class="" style="position: relative;display:inline-block;">
                         <view style="color:#191919;font-size:30rpx;display:inline-block;position: relative;z-index: 2;">是否有萌宠呕吐物</view>
                         <view class="background" style="width:100%;height:50%;position: absolute;bottom:0;left:0;background-color:rgba(227, 191, 119, 0.6);display:inline-block;z-index:1;"></view>
                       </view>
                     </view>
                   </view>
                   <!--                  <u-text size="30" text="是否有萌宠呕吐物"></u-text>-->
                 </view>
                 <u-checkbox-group v-model="model.sick.option" size="40">
                   <u-checkbox name="无呕吐物" label="无呕吐物" labelSize="28" icon-size="28" active-color="#4EC2B7"
                               custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                   <u-checkbox name="毛发" label="毛发" labelSize="28" icon-size="28" active-color="#4EC2B7"
                               custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                   <u-checkbox name="胃酸" label="胃酸" labelSize="28" icon-size="28" active-color="#4EC2B7"
                               custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                   <u-checkbox name="食物" label="食物" labelSize="28" icon-size="28" active-color="#4EC2B7"
                               custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                   <u-checkbox name="不明物体" label="不明物体" labelSize="28" icon-size="28" active-color="#4EC2B7"
                               custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                 </u-checkbox-group>
                 <uv-upload
                     accept="media"
                     width="160rpx"
                     height="160rpx"
                     :fileList="images.sick"
                     name="1"
                     multiple
                     :maxCount="10"
                     uploadIcon="plus"
                     @delete="(res) => {uploadDel(res,'sick')}"
                     @afterRead="(res) => {uploadPut(res,'sick')}"
                 ></uv-upload>
                 <u-textarea
                     v-model="model.sick.remark"
                     border="none"
                     placeholder="请描述您遇到的问题"
                     height="220"
                     :custom-style="{
                backgroundColor:'#FAFAFA',
                padding:'20rpx 20rpx'
              }"
                 ></u-textarea>
               </mz-card>
             </u-form-item>
             <u-form-item
                 prop="userInfo.sex"
                 :custom-style="{padding:'0',marginBottom:'30rpx;'}"
             >
               <mz-card>
                 <view class="form-label">
                   <view class="title row" style="position:relative;justify-content: flex-start;width:100%;top:0rpx;left:0;">
                     <view class="value col" style="position: relative;text-align: left;">

                       <!--        <u-text text="协议内容" size="38" color="#191919"></u-text>-->
                       <view class="" style="position: relative;display:inline-block;">
                         <view style="color:#191919;font-size:30rpx;display:inline-block;position: relative;z-index: 2;">萌宠排泄物情况</view>
                         <view class="background" style="width:100%;height:50%;position: absolute;bottom:0;left:0;background-color:rgba(227, 191, 119, 0.6);display:inline-block;z-index:1;"></view>
                       </view>
                     </view>
                   </view>
                   <!--                  <u-text size="30" text="萌宠排泄物情况"></u-text>-->
                 </view>
                 <u-checkbox-group v-model="model.excrement.option" size="40">
                   <u-checkbox name="健康" label="健康" labelSize="28" icon-size="28" active-color="#4EC2B7"
                               custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                   <u-checkbox name="干结" label="干结" labelSize="28" icon-size="28" active-color="#4EC2B7"
                               custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                   <u-checkbox name="偏软" label="偏软" labelSize="28" icon-size="28" active-color="#4EC2B7"
                               custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                   <u-checkbox name="粘稠" label="粘稠" labelSize="28" icon-size="28" active-color="#4EC2B7"
                               custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                   <u-checkbox name="稀便" label="稀便" labelSize="28" icon-size="28" active-color="#4EC2B7"
                               custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                   <u-checkbox name="血便" label="血便" labelSize="28" icon-size="28" active-color="#4EC2B7"
                               custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                 </u-checkbox-group>
                 <uv-upload
                     accept="media"
                     width="160rpx"
                     height="160rpx"
                     :fileList="images.excrement"
                     name="1"
                     multiple
                     :maxCount="10"
                     uploadIcon="plus"
                     @delete="(res) => {uploadDel(res,'excrement')}"
                     @afterRead="(res) => {uploadPut(res,'excrement')}"
                 ></uv-upload>
                 <u-textarea
                     v-model="model.excrement.remark"
                     border="none"
                     placeholder="请描述您遇到的问题"
                     height="220"
                     :custom-style="{
                backgroundColor:'#FAFAFA',
                padding:'20rpx 20rpx'
              }"
                 ></u-textarea>
               </mz-card>
             </u-form-item>
             <u-form-item
                 prop="userInfo.sex"
                 :custom-style="{padding:'0',marginBottom:'30rpx;'}"
             >
               <mz-card>
                 <view class="form-label">
                   <view class="title row" style="position:relative;justify-content: flex-start;width:100%;top:0rpx;left:0;">
                     <view class="value col" style="position: relative;text-align: left;">

                       <!--        <u-text text="协议内容" size="38" color="#191919"></u-text>-->
                       <view class="" style="position: relative;display:inline-block;">
                         <view style="color:#191919;font-size:30rpx;display:inline-block;position: relative;z-index: 2;">其他情况反馈</view>
                         <view class="background" style="width:100%;height:50%;position: absolute;bottom:0;left:0;background-color:rgba(227, 191, 119, 0.6);display:inline-block;z-index:1;"></view>
                       </view>
                     </view>
                   </view>
                   <!--                  <u-text size="30" text="其他情况反馈"></u-text>-->
                 </view>
                 <uv-upload
                     accept="media"
                     width="160rpx"
                     height="160rpx"
                     :fileList="images.other"
                     name="1"
                     multiple
                     :maxCount="10"
                     uploadIcon="plus"
                     @delete="(res) => {uploadDel(res,'other')}"
                     @afterRead="(res) => {uploadPut(res,'other')}"
                 ></uv-upload>
                 <u-textarea
                     v-model="model.other.remark"
                     border="none"
                     placeholder="请描述您遇到的问题"
                     height="220"
                     :custom-style="{
                backgroundColor:'#FAFAFA',
                padding:'20rpx 20rpx'
              }"
                 ></u-textarea>
               </mz-card>
             </u-form-item>
           </view>
         </view>
          <!--        喂养服务-->
          <view>
            <view class="" style="padding:30rpx 0;border-bottom:1rpx solid #f5f5f5;" @click="changeCollapse('1')">
              <u-text text="喂养服务" size="30" suffix-icon="arrow-right"></u-text>
            </view>
            <view v-if="collapseChecked === '1'" custom-style="padding:0" name="1" title="喂养服务">
              <u-form-item
                  prop="userInfo.sex"
                  :custom-style="{padding:'0',marginBottom:'30rpx;'}"
              >
                <mz-card>
                  <view class="form-label">
                    <view class="title row" style="position:relative;justify-content: flex-start;width:100%;top:0rpx;left:0;">
                      <view class="value col" style="position: relative;text-align: left;">

                        <!--        <u-text text="协议内容" size="38" color="#191919"></u-text>-->
                        <view class="" style="position: relative;display:inline-block;">
                          <view style="color:#191919;font-size:30rpx;display:inline-block;position: relative;z-index: 2;">食盆清洗并擦干水渍</view>
                          <view class="background" style="width:100%;height:50%;position: absolute;bottom:0;left:0;background-color:rgba(227, 191, 119, 0.6);display:inline-block;z-index:1;"></view>
                        </view>
                      </view>
                    </view>
                    <!--                  <u-text size="30" text="食盆清洗并擦干水渍"></u-text>-->
                  </view>
                  <view style="margin-bottom: 30rpx;">
                    <uv-number-box min="0" v-model="model.food_bowl.value"></uv-number-box>
                  </view>
                  <uv-upload
                      accept="media"
                      width="160rpx"
                      height="160rpx"
                      :fileList="images.food_bowl"
                      name="1"
                      multiple
                      :maxCount="10"
                      uploadIcon="plus"
                      @delete="(res) => {uploadDel(res,'food_bowl')}"
                      @afterRead="(res) => {uploadPut(res,'food_bowl')}"
                  ></uv-upload>
                  <u-textarea
                      v-model="model.food_bowl.remark"
                      border="none"
                      placeholder="请描述您遇到的问题"
                      height="220"
                      :custom-style="{
                    backgroundColor:'#FAFAFA',
                    padding:'20rpx 20rpx'
                  }"
                  ></u-textarea>
                </mz-card>
              </u-form-item>
              <u-form-item
                  prop="userInfo.sex"
                  :custom-style="{padding:'0',marginBottom:'30rpx;'}"
              >
                <mz-card>
                  <view class="form-label">
                    <view class="title row" style="position:relative;justify-content: flex-start;width:100%;top:0rpx;left:0;">
                      <view class="value col" style="position: relative;text-align: left;">

                        <!--        <u-text text="协议内容" size="38" color="#191919"></u-text>-->
                        <view class="" style="position: relative;display:inline-block;">
                          <view style="color:#191919;font-size:30rpx;display:inline-block;position: relative;z-index: 2;">水盆清理</view>
                          <view class="background" style="width:100%;height:50%;position: absolute;bottom:0;left:0;background-color:rgba(227, 191, 119, 0.6);display:inline-block;z-index:1;"></view>
                        </view>
                      </view>
                    </view>
                    <!--                  <u-text size="30" text="水盆清理"></u-text>-->
                  </view>
                  <view style="margin-bottom: 30rpx;">
                    <uv-number-box min="0" v-model="model.basin.value"></uv-number-box>
                  </view>
                  <uv-upload
                      accept="media"
                      width="160rpx"
                      height="160rpx"
                      :fileList="images.basin"
                      name="1"
                      multiple
                      :maxCount="10"
                      uploadIcon="plus"
                      @delete="(res) => {uploadDel(res,'basin')}"
                      @afterRead="(res) => {uploadPut(res,'basin')}"
                  ></uv-upload>
                  <u-textarea
                      v-model="model.basin.remark"
                      border="none"
                      placeholder="请描述您遇到的问题"
                      height="220"
                      :custom-style="{
                    backgroundColor:'#FAFAFA',
                    padding:'20rpx 20rpx'
                  }"
                  ></u-textarea>
                </mz-card>
              </u-form-item>
              <u-form-item
                  prop="userInfo.sex"
                  :custom-style="{padding:'0',marginBottom:'30rpx;'}"
              >
                <mz-card>
                  <view class="form-label">
                    <view class="title row" style="position:relative;justify-content: flex-start;width:100%;top:0rpx;left:0;">
                      <view class="value col" style="position: relative;text-align: left;">

                        <!--        <u-text text="协议内容" size="38" color="#191919"></u-text>-->
                        <view class="" style="position: relative;display:inline-block;">
                          <view style="color:#191919;font-size:30rpx;display:inline-block;position: relative;z-index: 2;">萌宠主食</view>
                          <view class="background" style="width:100%;height:50%;position: absolute;bottom:0;left:0;background-color:rgba(227, 191, 119, 0.6);display:inline-block;z-index:1;"></view>
                        </view>
                      </view>
                    </view>
                    <!--                  <u-text size="30" text="萌宠主食"></u-text>-->
                  </view>
                  <u-checkbox-group v-model="model.staple_food.option" size="40">
                    <u-checkbox name="添加" label="添加" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="更换" label="更换" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="鲜食制作" label="鲜食制作" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  </u-checkbox-group>
                  <uv-upload
                      accept="media"
                      width="160rpx"
                      height="160rpx"
                      :fileList="images.staple_food"
                      name="1"
                      multiple
                      :maxCount="10"
                      uploadIcon="plus"
                      @delete="(res) => {uploadDel(res,'staple_food')}"
                      @afterRead="(res) => {uploadPut(res,'staple_food')}"
                  ></uv-upload>
                  <u-textarea
                      v-model="model.staple_food.remark"
                      border="none"
                      placeholder="请描述您遇到的问题"
                      height="220"
                      :custom-style="{
                    backgroundColor:'#FAFAFA',
                    padding:'20rpx 20rpx'
                  }"
                  ></u-textarea>
                </mz-card>
              </u-form-item>
              <u-form-item
                  prop="userInfo.sex"
                  :custom-style="{padding:'0',marginBottom:'30rpx;'}"
              >
                <mz-card>
                  <view class="form-label">
                    <view class="title row" style="position:relative;justify-content: flex-start;width:100%;top:0rpx;left:0;">
                      <view class="value col" style="position: relative;text-align: left;">

                        <!--        <u-text text="协议内容" size="38" color="#191919"></u-text>-->
                        <view class="" style="position: relative;display:inline-block;">
                          <view style="color:#191919;font-size:30rpx;display:inline-block;position: relative;z-index: 2;">萌宠饮用水</view>
                          <view class="background" style="width:100%;height:50%;position: absolute;bottom:0;left:0;background-color:rgba(227, 191, 119, 0.6);display:inline-block;z-index:1;"></view>
                        </view>
                      </view>
                    </view>
                    <!--                  <u-text size="30" text="萌宠饮用水"></u-text>-->
                  </view>
                  <view class="form-label">
                    <u-text size="24" color="#999" text="操作"></u-text>
                  </view>
                  <u-checkbox-group v-model="model.water.option" size="40">
                    <u-checkbox name="添加" label="添加" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="更换" label="更换" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  </u-checkbox-group>

                  <view class="form-label">
                    <u-text size="24" color="#999" text="饮用水说明"></u-text>
                  </view>
                  <u-checkbox-group v-model="model.water.type_option" size="40">
                    <u-checkbox name="自来水" label="自来水" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="矿泉水" label="矿泉水" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="凉白开" label="凉白开" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="厨房直饮水" label="厨房直饮水" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  </u-checkbox-group>
                  <uv-upload
                      accept="media"
                      width="160rpx"
                      height="160rpx"
                      :fileList="images.water"
                      name="1"
                      multiple
                      :maxCount="10"
                      uploadIcon="plus"
                      @delete="(res) => {uploadDel(res,'water')}"
                      @afterRead="(res) => {uploadPut(res,'water')}"
                  ></uv-upload>
                  <u-textarea
                      v-model="model.water.remark"
                      border="none"
                      placeholder="请描述您遇到的问题"
                      height="220"
                      :custom-style="{
                    backgroundColor:'#FAFAFA',
                    padding:'20rpx 20rpx'
                  }"
                  ></u-textarea>
                </mz-card>
              </u-form-item>
              <u-form-item
                  prop="userInfo.sex"
                  :custom-style="{padding:'0',marginBottom:'30rpx;'}"
              >
                <mz-card>
                  <view class="form-label">
                    <view class="title row" style="position:relative;justify-content: flex-start;width:100%;top:0rpx;left:0;">
                      <view class="value col" style="position: relative;text-align: left;">

                        <!--        <u-text text="协议内容" size="38" color="#191919"></u-text>-->
                        <view class="" style="position: relative;display:inline-block;">
                          <view style="color:#191919;font-size:30rpx;display:inline-block;position: relative;z-index: 2;">零食、药品及其他</view>
                          <view class="background" style="width:100%;height:50%;position: absolute;bottom:0;left:0;background-color:rgba(227, 191, 119, 0.6);display:inline-block;z-index:1;"></view>
                        </view>
                      </view>
                    </view>
                    <!--                  <u-text size="30" text="零食、药品及其他"></u-text>-->
                  </view>
                  <u-checkbox-group v-model="model.snacks.option" size="40">
                    <u-checkbox name="罐头" label="罐头" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="化毛膏" label="化毛膏/片" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="鱼油" label="鱼油" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="益生菌" label="益生菌" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="猫条" label="猫条" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="磨牙棒" label="磨牙棒" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="其他零食" label="其他零食" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="指定营养品" label="指定营养品" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="指定药品" label="指定药品" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  </u-checkbox-group>
                  <uv-upload
                      accept="media"
                      width="160rpx"
                      height="160rpx"
                      :fileList="images.snacks"
                      name="1"
                      multiple
                      :maxCount="10"
                      uploadIcon="plus"
                      @delete="(res) => {uploadDel(res,'snacks')}"
                      @afterRead="(res) => {uploadPut(res,'snacks')}"
                  ></uv-upload>
                  <u-textarea
                      v-model="model.snacks.remark"
                      border="none"
                      placeholder="请描述您遇到的问题"
                      height="220"
                      :custom-style="{
                    backgroundColor:'#FAFAFA',
                    padding:'20rpx 20rpx'
                  }"
                  ></u-textarea>
                </mz-card>
              </u-form-item>
              <u-form-item
                  prop="userInfo.sex"
                  :custom-style="{padding:'0',marginBottom:'30rpx;'}"
              >
                <mz-card>
                  <view class="form-label">
                    <view class="title row" style="position:relative;justify-content: flex-start;width:100%;top:0rpx;left:0;">
                      <view class="value col" style="position: relative;text-align: left;">

                        <!--        <u-text text="协议内容" size="38" color="#191919"></u-text>-->
                        <view class="" style="position: relative;display:inline-block;">
                          <view style="color:#191919;font-size:30rpx;display:inline-block;position: relative;z-index: 2;">窝窝整理</view>
                          <view class="background" style="width:100%;height:50%;position: absolute;bottom:0;left:0;background-color:rgba(227, 191, 119, 0.6);display:inline-block;z-index:1;"></view>
                        </view>
                      </view>
                    </view>
                    <!--                  <u-text size="30" text="窝窝整理"></u-text>-->
                  </view>
                  <u-checkbox-group v-model="model.wowo.option" size="40">
                    <u-checkbox name="整理" label="整理" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="消毒" label="消毒" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="祛味" label="祛味" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  </u-checkbox-group>
                  <uv-upload
                      accept="media"
                      width="160rpx"
                      height="160rpx"
                      :fileList="images.wowo"
                      name="1"
                      multiple
                      :maxCount="10"
                      uploadIcon="plus"
                      @delete="(res) => {uploadDel(res,'wowo')}"
                      @afterRead="(res) => {uploadPut(res,'wowo')}"
                  ></uv-upload>
                  <u-textarea
                      v-model="model.wowo.remark"
                      border="none"
                      placeholder="请描述您遇到的问题"
                      height="220"
                      :custom-style="{
                    backgroundColor:'#FAFAFA',
                    padding:'20rpx 20rpx'
                  }"
                  ></u-textarea>
                </mz-card>
              </u-form-item>
              <u-form-item
                  prop="userInfo.sex"
                  :custom-style="{padding:'0',marginBottom:'30rpx;'}"
              >
                <mz-card>
                  <view class="form-label">
                    <view class="title row" style="position:relative;justify-content: flex-start;width:100%;top:0rpx;left:0;">
                      <view class="value col" style="position: relative;text-align: left;">

                        <!--        <u-text text="协议内容" size="38" color="#191919"></u-text>-->
                        <view class="" style="position: relative;display:inline-block;">
                          <view style="color:#191919;font-size:30rpx;display:inline-block;position: relative;z-index: 2;">笼笼清理</view>
                          <view class="background" style="width:100%;height:50%;position: absolute;bottom:0;left:0;background-color:rgba(227, 191, 119, 0.6);display:inline-block;z-index:1;"></view>
                        </view>
                      </view>
                    </view>
                    <!--                  <u-text size="30" text="笼笼清理"></u-text>-->
                  </view>
                  <u-checkbox-group v-model="model.cage.option" size="40">
                    <u-checkbox name="整理" label="整理" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="消毒" label="消毒" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="祛味" label="祛味" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  </u-checkbox-group>
                  <uv-upload
                      accept="media"
                      width="160rpx"
                      height="160rpx"
                      :fileList="images.cage"
                      name="1"
                      multiple
                      :maxCount="10"
                      uploadIcon="plus"
                      @delete="(res) => {uploadDel(res,'cage')}"
                      @afterRead="(res) => {uploadPut(res,'cage')}"
                  ></uv-upload>
                  <u-textarea
                      v-model="model.cage.remark"
                      border="none"
                      placeholder="请描述您遇到的问题"
                      height="220"
                      :custom-style="{
                    backgroundColor:'#FAFAFA',
                    padding:'20rpx 20rpx'
                  }"
                  ></u-textarea>
                </mz-card>
              </u-form-item>
              <u-form-item
                  prop="userInfo.sex"
                  :custom-style="{padding:'0',marginBottom:'30rpx;'}"
              >
                <mz-card>
                  <view class="form-label">
                    <view class="title row" style="position:relative;justify-content: flex-start;width:100%;top:0rpx;left:0;">
                      <view class="value col" style="position: relative;text-align: left;">

                        <!--        <u-text text="协议内容" size="38" color="#191919"></u-text>-->
                        <view class="" style="position: relative;display:inline-block;">
                          <view style="color:#191919;font-size:30rpx;display:inline-block;position: relative;z-index: 2;">周边毛发</view>
                          <view class="background" style="width:100%;height:50%;position: absolute;bottom:0;left:0;background-color:rgba(227, 191, 119, 0.6);display:inline-block;z-index:1;"></view>
                        </view>
                      </view>
                    </view>
                    <!--                  <u-text size="30" text="周边毛发"></u-text>-->
                  </view>
                  <u-checkbox-group v-model="model.hair.option" size="40">
                    <u-checkbox name="整理" label="整理" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="消毒" label="消毒" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="祛味" label="祛味" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  </u-checkbox-group>
                  <uv-upload
                      accept="media"
                      width="160rpx"
                      height="160rpx"
                      :fileList="images.hair"
                      name="1"
                      multiple
                      :maxCount="10"
                      uploadIcon="plus"
                      @delete="(res) => {uploadDel(res,'hair')}"
                      @afterRead="(res) => {uploadPut(res,'hair')}"
                  ></uv-upload>
                  <u-textarea
                      v-model="model.hair.remark"
                      border="none"
                      placeholder="请描述您遇到的问题"
                      height="220"
                      :custom-style="{
                    backgroundColor:'#FAFAFA',
                    padding:'20rpx 20rpx'
                  }"
                  ></u-textarea>
                </mz-card>
              </u-form-item>
              <u-form-item
                  prop="userInfo.sex"
                  :custom-style="{padding:'0',marginBottom:'30rpx;'}"
              >
                <mz-card>
                  <view class="form-label">
                    <view class="title row" style="position:relative;justify-content: flex-start;width:100%;top:0rpx;left:0;">
                      <view class="value col" style="position: relative;text-align: left;">

                        <!--        <u-text text="协议内容" size="38" color="#191919"></u-text>-->
                        <view class="" style="position: relative;display:inline-block;">
                          <view style="color:#191919;font-size:30rpx;display:inline-block;position: relative;z-index: 2;">屋内排泄物清理</view>
                          <view class="background" style="width:100%;height:50%;position: absolute;bottom:0;left:0;background-color:rgba(227, 191, 119, 0.6);display:inline-block;z-index:1;"></view>
                        </view>
                      </view>
                    </view>
                    <!--                  <u-text size="30" text="屋内排泄物清理"></u-text>-->
                  </view>
                  <u-checkbox-group v-model="model.pet_sick.option" size="40">
                    <u-checkbox name="整理" label="整理" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="消毒" label="消毒" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="祛味" label="祛味" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  </u-checkbox-group>
                  <uv-upload
                      accept="media"
                      width="160rpx"
                      height="160rpx"
                      :fileList="images.pet_sick"
                      name="1"
                      multiple
                      :maxCount="10"
                      uploadIcon="plus"
                      @delete="(res) => {uploadDel(res,'pet_sick')}"
                      @afterRead="(res) => {uploadPut(res,'pet_sick')}"
                  ></uv-upload>
                  <u-textarea
                      v-model="model.pet_sick.remark"
                      border="none"
                      placeholder="请描述您遇到的问题"
                      height="220"
                      :custom-style="{
                    backgroundColor:'#FAFAFA',
                    padding:'20rpx 20rpx'
                  }"
                  ></u-textarea>
                </mz-card>
              </u-form-item>
              <u-form-item
                  prop="userInfo.sex"
                  :custom-style="{padding:'0',marginBottom:'30rpx;'}"
              >
                <mz-card>
                  <view class="form-label">
                    <view class="title row" style="position:relative;justify-content: flex-start;width:100%;top:0rpx;left:0;">
                      <view class="value col" style="position: relative;text-align: left;">

                        <!--        <u-text text="协议内容" size="38" color="#191919"></u-text>-->
                        <view class="" style="position: relative;display:inline-block;">
                          <view style="color:#191919;font-size:30rpx;display:inline-block;position: relative;z-index: 2;">屋内呕吐物清理</view>
                          <view class="background" style="width:100%;height:50%;position: absolute;bottom:0;left:0;background-color:rgba(227, 191, 119, 0.6);display:inline-block;z-index:1;"></view>
                        </view>
                      </view>
                    </view>
                    <!--                  <u-text size="30" text="屋内呕吐物清理"></u-text>-->
                  </view>
                  <u-checkbox-group v-model="model.pet_excrement.option" size="40">
                    <u-checkbox name="整理" label="整理" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="消毒" label="消毒" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="祛味" label="祛味" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  </u-checkbox-group>
                  <uv-upload
                      accept="media"
                      width="160rpx"
                      height="160rpx"
                      :fileList="images.pet_excrement"
                      name="1"
                      multiple
                      :maxCount="10"
                      uploadIcon="plus"
                      @delete="(res) => {uploadDel(res,'pet_excrement')}"
                      @afterRead="(res) => {uploadPut(res,'pet_excrement')}"
                  ></uv-upload>
                  <u-textarea
                      v-model="model.pet_excrement.remark"
                      border="none"
                      placeholder="请描述您遇到的问题"
                      height="220"
                      :custom-style="{
                    backgroundColor:'#FAFAFA',
                    padding:'20rpx 20rpx'
                  }"
                  ></u-textarea>
                </mz-card>
              </u-form-item>
              <u-form-item
                  prop="userInfo.sex"
                  :custom-style="{padding:'0',marginBottom:'30rpx;'}"
              >
                <mz-card>
                  <view class="form-label">
                    <view class="title row" style="position:relative;justify-content: flex-start;width:100%;top:0rpx;left:0;">
                      <view class="value col" style="position: relative;text-align: left;">

                        <!--        <u-text text="协议内容" size="38" color="#191919"></u-text>-->
                        <view class="" style="position: relative;display:inline-block;">
                          <view style="color:#191919;font-size:30rpx;display:inline-block;position: relative;z-index: 2;">猫砂盆整理及猫砂更换</view>
                          <view class="background" style="width:100%;height:50%;position: absolute;bottom:0;left:0;background-color:rgba(227, 191, 119, 0.6);display:inline-block;z-index:1;"></view>
                        </view>
                      </view>
                    </view>
                    <!--                  <u-text size="30" text="猫砂盆整理及猫砂更换"></u-text>-->
                  </view>
                  <u-checkbox-group v-model="model.cat_litter.option" size="40">
                    <u-checkbox name="清理铲屎" label="清理铲屎" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="猫砂盆擦拭" label="猫砂盆擦拭" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="全部更换" label="全部更换" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="整体清洗" label="整体清洗" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="清洗猫砂铲" label="清洗猫砂铲" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="消毒" label="消毒" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  </u-checkbox-group>
                  <uv-upload
                      accept="media"
                      width="160rpx"
                      height="160rpx"
                      :fileList="images.cat_litter"
                      name="1"
                      multiple
                      :maxCount="10"
                      uploadIcon="plus"
                      @delete="(res) => {uploadDel(res,'cat_litter')}"
                      @afterRead="(res) => {uploadPut(res,'cat_litter')}"
                  ></uv-upload>
                  <u-textarea
                      v-model="model.cat_litter.remark"
                      border="none"
                      placeholder="请描述您遇到的问题"
                      height="220"
                      :custom-style="{
                    backgroundColor:'#FAFAFA',
                    padding:'20rpx 20rpx'
                  }"
                  ></u-textarea>
                </mz-card>
              </u-form-item>
              <u-form-item
                  prop="userInfo.sex"
                  :custom-style="{padding:'0',marginBottom:'30rpx;'}"
              >
                <mz-card>
                  <view class="form-label">
                    <view class="title row" style="position:relative;justify-content: flex-start;width:100%;top:0rpx;left:0;">
                      <view class="value col" style="position: relative;text-align: left;">

                        <!--        <u-text text="协议内容" size="38" color="#191919"></u-text>-->
                        <view class="" style="position: relative;display:inline-block;">
                          <view style="color:#191919;font-size:30rpx;display:inline-block;position: relative;z-index: 2;">其他需求反馈</view>
                          <view class="background" style="width:100%;height:50%;position: absolute;bottom:0;left:0;background-color:rgba(227, 191, 119, 0.6);display:inline-block;z-index:1;"></view>
                        </view>
                      </view>
                    </view>
                    <!--                  <u-text size="30" text="其他需求反馈"></u-text>-->
                  </view>
                  <uv-upload
                      accept="media"
                      width="160rpx"
                      height="160rpx"
                      :fileList="images.other_info"
                      name="1"
                      multiple
                      :maxCount="10"
                      uploadIcon="plus"
                      @delete="(res) => {uploadDel(res,'other_info')}"
                      @afterRead="(res) => {uploadPut(res,'other_info')}"
                  ></uv-upload>
                  <u-textarea
                      v-model="model.other_info.remark"
                      border="none"
                      placeholder="请描述您遇到的问题"
                      height="220"
                      :custom-style="{
                    backgroundColor:'#FAFAFA',
                    padding:'20rpx 20rpx'
                  }"
                  ></u-textarea>
                </mz-card>
              </u-form-item>
            </view>
          </view>

          <!--        健康检查-->
          <view>
            <view class="" style="padding:30rpx 0;border-bottom:1rpx solid #f5f5f5;" @click="changeCollapse('2')">
              <u-text text="健康检查" size="30" suffix-icon="arrow-right"></u-text>
            </view>

            <view v-if="collapseChecked === '2'" custom-style="padding:0" name="2" title="健康检查">
              <u-form-item
                  prop="userInfo.sex"
                  :custom-style="{padding:'0',marginBottom:'30rpx;'}"
              >
                <mz-card>
                  <view class="form-label">
                    <view class="title row" style="position:relative;justify-content: flex-start;width:100%;top:0rpx;left:0;">
                      <view class="value col" style="position: relative;text-align: left;">

                        <!--        <u-text text="协议内容" size="38" color="#191919"></u-text>-->
                        <view class="" style="position: relative;display:inline-block;">
                          <view style="color:#191919;font-size:30rpx;display:inline-block;position: relative;z-index: 2;">基础检查</view>
                          <view class="background" style="width:100%;height:50%;position: absolute;bottom:0;left:0;background-color:rgba(227, 191, 119, 0.6);display:inline-block;z-index:1;"></view>
                        </view>
                      </view>
                    </view>
                    <u-text size="28" color="#999" text="（若小主胆小，部分项目可能无法检查）"></u-text>
                  </view>
                  <u-checkbox-group v-model="model.foundation.option" size="40">
                    <u-checkbox name="精神状态" label="精神状态" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="鼻子" label="鼻子" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="便便" label="便便" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="皮肤状态" label="皮肤状态" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="耳朵检查" label="耳朵检查" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="眼睛" label="眼睛" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="肛周情况" label="肛周情况" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="爪爪" label="爪爪" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="口腔检查" label="口腔检查" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                    <u-checkbox name="食欲状态" label="食欲状态" labelSize="28" icon-size="28" active-color="#4EC2B7"
                                custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  </u-checkbox-group>
                  <uv-upload
                      accept="media"
                      width="160rpx"
                      height="160rpx"
                      :fileList="images.foundation"
                      name="1"
                      multiple
                      :maxCount="10"
                      uploadIcon="plus"
                      @delete="(res) => {uploadDel(res,'foundation')}"
                      @afterRead="(res) => {uploadPut(res,'foundation')}"
                  ></uv-upload>
                  <u-textarea
                      v-model="model.foundation.remark"
                      border="none"
                      placeholder="请描述您遇到的问题"
                      height="220"
                      :custom-style="{
                    backgroundColor:'#FAFAFA',
                    padding:'20rpx 20rpx'
                  }"
                  ></u-textarea>
                </mz-card>
              </u-form-item>
              <u-form-item
                  prop="userInfo.sex"
                  :custom-style="{padding:'0',marginBottom:'30rpx;'}"
              >
                <mz-card>
                  <view class="form-label">
                    <view class="title row" style="position:relative;justify-content: flex-start;width:100%;top:0rpx;left:0;">
                      <view class="value col" style="position: relative;text-align: left;">

                        <!--        <u-text text="协议内容" size="38" color="#191919"></u-text>-->
                        <view class="" style="position: relative;display:inline-block;">
                          <view style="color:#191919;font-size:30rpx;display:inline-block;position: relative;z-index: 2;">健康情况</view>
                          <view class="background" style="width:100%;height:50%;position: absolute;bottom:0;left:0;background-color:rgba(227, 191, 119, 0.6);display:inline-block;z-index:1;"></view>
                        </view>
                      </view>
                    </view>
                    <!--                  <u-text size="30" text="健康情况"></u-text>-->
                  </view>
                  <view class="radio row" style="padding-bottom:30rpx;">
                    <view class="radio-box row col" v-for="item in ['健康活泼','未近距离观察']" style="width:auto;align-items: center;" @click="healthChange(item)">
                      <view class="box "
                            style="display:flex;justify-content:center;align-items:center;
                           width:35rpx;height:35rpx;border-radius: 50%;border:2rpx solid;background-color:#4EC2B7;
                            margin-right:15rpx;"
                            :style="{
                             borderColor:(model.health === item ? 'transparent':'#c8c9cc'),
                             backgroundColor:(model.health === item ? '#4EC2B7':'transparent')
                           }"
                      >
                        <u-icon name="checkbox-mark" size="25rpx" :color="(model.health === item ? '#fff' : 'transparent')"></u-icon>
                      </view>
                      <view class="label ">
                        {{item}}
                      </view>
                    </view>
                  </view>
<!--                  <u-radio-group v-model="model.health" @change="healthChange" size="40">-->
<!--                    <u-radio name="健康活泼" label="健康活泼" labelSize="28" icon-size="28" active-color="#4EC2B7"-->
<!--                             custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-radio>-->
<!--                    <u-radio name="未近距离观察" label="未近距离观察" labelSize="28" icon-size="28" active-color="#4EC2B7"-->
<!--                             custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-radio>-->
<!--                  </u-radio-group>-->
                </mz-card>
              </u-form-item>
              <u-form-item
                  prop="userInfo.sex"
                  :custom-style="{padding:'0',marginBottom:'30rpx;'}"
              >
                <mz-card>
                  <view class="form-label">
                    <view class="title row" style="position:relative;justify-content: flex-start;width:100%;top:0rpx;left:0;">
                      <view class="value col" style="position: relative;text-align: left;">

                        <!--        <u-text text="协议内容" size="38" color="#191919"></u-text>-->
                        <view class="" style="position: relative;display:inline-block;">
                          <view style="color:#191919;font-size:30rpx;display:inline-block;position: relative;z-index: 2;">其他</view>
                          <view class="background" style="width:100%;height:50%;position: absolute;bottom:0;left:0;background-color:rgba(227, 191, 119, 0.6);display:inline-block;z-index:1;"></view>
                        </view>
                      </view>
                    </view>
                    <!--                  <u-text size="30" text="其他"></u-text>-->
                  </view>
                  <uv-upload
                      accept="media"
                      width="160rpx"
                      height="160rpx"
                      :fileList="images.health_other"
                      name="1"
                      multiple
                      :maxCount="10"
                      uploadIcon="plus"
                      @delete="(res) => {uploadDel(res,'health_other')}"
                      @afterRead="(res) => {uploadPut(res,'health_other')}"
                  ></uv-upload>
                  <u-textarea
                      v-model="model.health_other.remark"
                      border="none"
                      placeholder="请描述您遇到的问题"
                      height="220"
                      :custom-style="{
                    backgroundColor:'#FAFAFA',
                    padding:'20rpx 20rpx'
                  }"
                  ></u-textarea>
                </mz-card>
              </u-form-item>
            </view>
          </view>

          <!--       萌宠美容及清理 -->
          <view>
            <view class="" style="padding:30rpx 0;border-bottom:1rpx solid #f5f5f5;" @click="changeCollapse('3')">
              <u-text text="萌宠美容及清理" size="30" suffix-icon="arrow-right"></u-text>
            </view>
          <view v-if="collapseChecked === '3'" custom-style="padding:0" name="3" title="萌宠美容及清理">
            <u-form-item
                prop="userInfo.sex"
                :custom-style="{padding:'0',marginBottom:'30rpx;'}"
            >
              <mz-card>
                <view class="form-label">
                  <view class="title row" style="position:relative;justify-content: flex-start;width:100%;top:0rpx;left:0;">
              <view class="value col" style="position: relative;text-align: left;">

                <!--        <u-text text="协议内容" size="38" color="#191919"></u-text>-->
                <view class="" style="position: relative;display:inline-block;">
                  <view style="color:#191919;font-size:30rpx;display:inline-block;position: relative;z-index: 2;">萌宠清洁</view>
                  <view class="background" style="width:100%;height:50%;position: absolute;bottom:0;left:0;background-color:rgba(227, 191, 119, 0.6);display:inline-block;z-index:1;"></view>
                </view>
              </view>
            </view>
<!--                  <u-text size="30" text="萌宠清洁"></u-text>-->
                </view>
                <u-checkbox-group v-model="model.pet_clean.option" size="40">
                  <u-checkbox name="擦耳朵" label="擦耳朵" labelSize="28" icon-size="28" active-color="#4EC2B7"
                              custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  <u-checkbox name="梳毛毛" label="梳毛毛" labelSize="28" icon-size="28" active-color="#4EC2B7"
                              custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  <u-checkbox name="擦拭眼部周围分泌物" label="擦拭眼部周围分泌物" labelSize="28" icon-size="28"
                              active-color="#4EC2B7"
                              custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  <u-checkbox name="萌宠全身擦拭" label="萌宠全身擦拭" labelSize="28" icon-size="28"
                              active-color="#4EC2B7"
                              custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  <u-checkbox name="清洁牙齿" label="清洁牙齿" labelSize="28" icon-size="28" active-color="#4EC2B7"
                              custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                </u-checkbox-group>
                <uv-upload
                    accept="media"
                    width="160rpx"
                    height="160rpx"
                    :fileList="images.pet_clean"
                    name="1"
                    multiple
                    :maxCount="10"
                    uploadIcon="plus"
                    @delete="(res) => {uploadDel(res,'pet_clean')}"
                    @afterRead="(res) => {uploadPut(res,'pet_clean')}"
                ></uv-upload>
                <u-textarea
                    v-model="model.pet_clean.remark"
                    border="none"
                    placeholder="请描述您遇到的问题"
                    height="220"
                    :custom-style="{
                backgroundColor:'#FAFAFA',
                padding:'20rpx 20rpx'
              }"
                ></u-textarea>
              </mz-card>
            </u-form-item>
            <u-form-item
                prop="userInfo.sex"
                :custom-style="{padding:'0',marginBottom:'30rpx;'}"
            >
              <mz-card>
                <view class="form-label">
                  <view class="title row" style="position:relative;justify-content: flex-start;width:100%;top:0rpx;left:0;">
              <view class="value col" style="position: relative;text-align: left;">

                <!--        <u-text text="协议内容" size="38" color="#191919"></u-text>-->
                <view class="" style="position: relative;display:inline-block;">
                  <view style="color:#191919;font-size:30rpx;display:inline-block;position: relative;z-index: 2;">萌宠美容</view>
                  <view class="background" style="width:100%;height:50%;position: absolute;bottom:0;left:0;background-color:rgba(227, 191, 119, 0.6);display:inline-block;z-index:1;"></view>
                </view>
              </view>
            </view>
<!--                  <u-text size="30" text="萌宠美容"></u-text>-->
                </view>
                <view class="form-label">
                  <u-text size="24" color="#999" text="洗护前原始状态"></u-text>
                </view>

                <u-checkbox-group v-model="model.before_facial.option" size="40">
                  <u-checkbox name="健康预检" label="健康预检" labelSize="28" icon-size="28" active-color="#4EC2B7"
                              custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  <u-checkbox name="祛油脂尾" label="祛油脂尾" labelSize="28" icon-size="28" active-color="#4EC2B7"
                              custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  <u-checkbox name="毛发护理" label="毛发护理" labelSize="28" icon-size="28" active-color="#4EC2B7"
                              custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  <u-checkbox name="耳道护理" label="耳道护理" labelSize="28" icon-size="28" active-color="#4EC2B7"
                              custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  <u-checkbox name="萌爪护理" label="萌爪护理" labelSize="28" icon-size="28" active-color="#4EC2B7"
                              custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  <u-checkbox name="眼部护理" label="眼部护理" labelSize="28" icon-size="28" active-color="#4EC2B7"
                              custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  <u-checkbox name="局部剃毛" label="局部剃毛" labelSize="28" icon-size="28" active-color="#4EC2B7"
                              custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                </u-checkbox-group>
                <uv-upload
                    accept="media"
                    width="160rpx"
                    height="160rpx"
                    :fileList="images.before_facial"
                    name="1"
                    multiple
                    :maxCount="10"
                    uploadIcon="plus"
                    @delete="(res) => {uploadDel(res,'before_facial')}"
                    @afterRead="(res) => {uploadPut(res,'before_facial')}"
                ></uv-upload>
                <u-textarea
                    v-model="model.before_facial.remark"
                    border="none"
                    placeholder="请描述您遇到的问题"
                    height="220"
                    :custom-style="{
                backgroundColor:'#FAFAFA',
                padding:'20rpx 20rpx'
              }"
                ></u-textarea>

                <view class="form-label">
                  <u-text size="24" color="#999" text="使用产品"></u-text>
                </view>

                <u-checkbox-group v-model="model.pet_facial.option" size="40">
                  <u-checkbox name="专业护理产品" label="专业护理产品" labelSize="28" icon-size="28"
                              active-color="#4EC2B7"
                              custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  <u-checkbox name="升级护理产品" label="升级护理产品" labelSize="28" icon-size="28"
                              active-color="#4EC2B7"
                              custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  <u-checkbox name="伊珊娜精致洗护" label="伊珊娜精致洗护" labelSize="28" icon-size="28"
                              active-color="#4EC2B7"
                              custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  <u-checkbox name="药浴" label="药浴" labelSize="28" icon-size="28" active-color="#4EC2B7"
                              custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                </u-checkbox-group>
                <uv-upload
                    accept="media"
                    width="160rpx"
                    height="160rpx"
                    :fileList="images.pet_facial"
                    name="1"
                    multiple
                    :maxCount="10"
                    uploadIcon="plus"
                    @delete="(res) => {uploadDel(res,'pet_facial')}"
                    @afterRead="(res) => {uploadPut(res,'pet_facial')}"
                ></uv-upload>
                <u-textarea
                    v-model="model.pet_facial.remark"
                    border="none"
                    placeholder="请描述您遇到的问题"
                    height="220"
                    :custom-style="{
                backgroundColor:'#FAFAFA',
                padding:'20rpx 20rpx'
              }"
                ></u-textarea>

                <view class="form-label">
                  <u-text size="24" color="#999" text="洗护后状态"></u-text>
                </view>

                <u-checkbox-group v-model="model.end_facial.option" size="40">
                  <u-checkbox name="祛油脂尾" label="祛油脂尾" labelSize="28" icon-size="28" active-color="#4EC2B7"
                              custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  <u-checkbox name="毛发护理" label="毛发护理" labelSize="28" icon-size="28" active-color="#4EC2B7"
                              custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  <u-checkbox name="萌爪护理" label="萌爪护理" labelSize="28" icon-size="28" active-color="#4EC2B7"
                              custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  <u-checkbox name="肛门腺护理" label="肛门腺护理" labelSize="28" icon-size="28" active-color="#4EC2B7"
                              custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  <u-checkbox name="眼部护理" label="眼部护理" labelSize="28" icon-size="28" active-color="#4EC2B7"
                              custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                </u-checkbox-group>
                <uv-upload
                    accept="media"
                    width="160rpx"
                    height="160rpx"
                    :fileList="images.end_facial"
                    name="1"
                    multiple
                    :maxCount="10"
                    uploadIcon="plus"
                    @delete="(res) => {uploadDel(res,'end_facial')}"
                    @afterRead="(res) => {uploadPut(res,'end_facial')}"
                ></uv-upload>
                <u-textarea
                    v-model="model.end_facial.remark"
                    border="none"
                    placeholder="请描述您遇到的问题"
                    height="220"
                    :custom-style="{
                backgroundColor:'#FAFAFA',
                padding:'20rpx 20rpx'
              }"
                ></u-textarea>
              </mz-card>
            </u-form-item>
          </view>
         </view>
          <!--        遛弯互动/陪玩-->
          <view>
            <view class="" style="padding:30rpx 0;border-bottom:1rpx solid #f5f5f5;" @click="changeCollapse('4')">
              <u-text text="遛弯互动/陪玩" size="30" suffix-icon="arrow-right"></u-text>
            </view>
          <view v-if="collapseChecked === '4'" custom-style="padding:0" name="4" title="遛弯互动/陪玩">
            <u-form-item
                prop="userInfo.sex"
                :custom-style="{padding:'0',marginBottom:'30rpx;'}"
            >
              <mz-card>
                <view class="form-label">
                  <view class="title row" style="position:relative;justify-content: flex-start;width:100%;top:0rpx;left:0;">
              <view class="value col" style="position: relative;text-align: left;">

                <!--        <u-text text="协议内容" size="38" color="#191919"></u-text>-->
                <view class="" style="position: relative;display:inline-block;">
                  <view style="color:#191919;font-size:30rpx;display:inline-block;position: relative;z-index: 2;">在家互动</view>
                  <view class="background" style="width:100%;height:50%;position: absolute;bottom:0;left:0;background-color:rgba(227, 191, 119, 0.6);display:inline-block;z-index:1;"></view>
                </view>
              </view>
            </view>
<!--                  <u-text size="30" text="在家互动"></u-text>-->
                </view>

                <uv-upload
                    accept="media"
                    width="160rpx"
                    height="160rpx"
                    :fileList="images.home_play"
                    name="1"
                    multiple
                    :maxCount="20"
                    uploadIcon="plus"
                    @delete="(res) => {uploadDel(res,'home_play')}"
                    @afterRead="(res) => {uploadPut(res,'home_play')}"
                ></uv-upload>
                <u-textarea
                    v-model="model.home_play.remark"
                    border="none"
                    placeholder="请描述您遇到的问题"
                    height="220"
                    :custom-style="{
                backgroundColor:'#FAFAFA',
                padding:'20rpx 20rpx'
              }"
                ></u-textarea>

                <view class="form-label" style="margin-top:30rpx;">
                      <view class="title row" style="position:relative;justify-content: flex-start;width:100%;top:0rpx;left:0;">
              <view class="value col" style="position: relative;text-align: left;">

                <!--        <u-text text="协议内容" size="38" color="#191919"></u-text>-->
                <view class="" style="position: relative;display:inline-block;">
                  <view style="color:#191919;font-size:30rpx;display:inline-block;position: relative;z-index: 2;">外出遛弯</view>
                  <view class="background" style="width:100%;height:50%;position: absolute;bottom:0;left:0;background-color:rgba(227, 191, 119, 0.6);display:inline-block;z-index:1;"></view>
                </view>
              </view>
            </view>
<!--                  <u-text size="30" text="外出遛弯"></u-text>-->
                </view>

                <view class="form-label">
                  <u-text size="24" color="#999" text="排便情况"></u-text>
                </view>
                <u-checkbox-group v-model="model.out_play.number_option" size="40">
                  <u-checkbox name="无" label="无" labelSize="28" icon-size="28" active-color="#4EC2B7"
                              custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  <u-checkbox name="1次" label="1次" labelSize="28" icon-size="28" active-color="#4EC2B7"
                              custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  <u-checkbox name="2次" label="2次" labelSize="28" icon-size="28" active-color="#4EC2B7"
                              custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  <u-checkbox name="其他" label="其他" labelSize="28" icon-size="28" active-color="#4EC2B7"
                              custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                </u-checkbox-group>
                <view class="form-label">
                  <u-text size="24" color="#999" text="便便情况"></u-text>
                </view>
                <u-checkbox-group v-model="model.out_play.feces_option" size="40">
                  <u-checkbox name="健康" label="健康" labelSize="28" icon-size="28" active-color="#4EC2B7"
                              custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  <u-checkbox name="干结" label="干结" labelSize="28" icon-size="28" active-color="#4EC2B7"
                              custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  <u-checkbox name="偏软" label="偏软" labelSize="28" icon-size="28" active-color="#4EC2B7"
                              custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  <u-checkbox name="粘稠" label="粘稠" labelSize="28" icon-size="28" active-color="#4EC2B7"
                              custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  <u-checkbox name="稀便" label="稀便" labelSize="28" icon-size="28" active-color="#4EC2B7"
                              custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  <u-checkbox name="血便" label="血便" labelSize="28" icon-size="28" active-color="#4EC2B7"
                              custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                </u-checkbox-group>
                <view class="form-label">
                  <u-text size="24" color="#999" text="入门前清洁"></u-text>
                </view>
                <u-checkbox-group v-model="model.out_play.in_home_option" size="40">
                  <u-checkbox name="擦脚脚" label="擦脚脚" labelSize="28" icon-size="28" active-color="#4EC2B7"
                              custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                  <u-checkbox name="擦屁屁" label="擦屁屁" labelSize="28" icon-size="28" active-color="#4EC2B7"
                              custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-checkbox>
                </u-checkbox-group>
                <uv-upload
                    accept="media"
                    width="160rpx"
                    height="160rpx"
                    :fileList="images.out_play"
                    name="1"
                    multiple
                    :maxCount="20"
                    uploadIcon="plus"
                    @delete="(res) => {uploadDel(res,'out_play')}"
                    @afterRead="(res) => {uploadPut(res,'out_play')}"
                ></uv-upload>
                <u-textarea
                    v-model="model.out_play.remark"
                    border="none"
                    placeholder="请描述您遇到的问题"
                    height="220"
                    :custom-style="{
                backgroundColor:'#FAFAFA',
                padding:'20rpx 20rpx'
              }"
                ></u-textarea>
              </mz-card>
            </u-form-item>
          </view>
        </view>

          <!--        安全离开-->
          <view>
            <view class="" style="padding:30rpx 0;border-bottom:1rpx solid #f5f5f5;" @click="changeCollapse('5')">
              <u-text text="安全离开" size="30" suffix-icon="arrow-right"></u-text>
            </view>
            <view v-if="collapseChecked === '5'" custom-style="padding:0" name="5" title="安全离开">
            <u-form-item
                prop="userInfo.sex"
                :custom-style="{padding:'0',marginBottom:'30rpx;'}"
            >
              <mz-card>
                <view class="form-label">
                  <view class="title row" style="position:relative;justify-content: flex-start;width:100%;top:0rpx;left:0;">
              <view class="value col" style="position: relative;text-align: left;">

                <!--        <u-text text="协议内容" size="38" color="#191919"></u-text>-->
                <view class="" style="position: relative;display:inline-block;">
                  <view style="color:#191919;font-size:30rpx;display:inline-block;position: relative;z-index: 2;">垃圾携带</view>
                  <view class="background" style="width:100%;height:50%;position: absolute;bottom:0;left:0;background-color:rgba(227, 191, 119, 0.6);display:inline-block;z-index:1;"></view>
                </view>
              </view>
            </view>
<!--                  <u-text size="30" text="垃圾携带"></u-text>-->
                </view>
                <uv-upload
                    accept="media"
                    width="160rpx"
                    height="160rpx"
                    :fileList="images.trash"
                    name="1"
                    multiple
                    :maxCount="10"
                    uploadIcon="plus"
                    @delete="(res) => {uploadDel(res,'trash')}"
                    @afterRead="(res) => {uploadPut(res,'trash')}"
                ></uv-upload>
                <u-textarea
                    v-model="model.trash.remark"
                    border="none"
                    placeholder="请描述您遇到的问题"
                    height="220"
                    :custom-style="{
                backgroundColor:'#FAFAFA',
                padding:'20rpx 20rpx'
              }"
                ></u-textarea>
              </mz-card>
            </u-form-item>
            <u-form-item
                prop="userInfo.sex"
                :custom-style="{padding:'0',marginBottom:'30rpx;'}"
            >
              <mz-card>
                <view class="form-label">
                  <view class="title row" style="position:relative;justify-content: flex-start;width:100%;top:0rpx;left:0;">
              <view class="value col" style="position: relative;text-align: left;">

                <!--        <u-text text="协议内容" size="38" color="#191919"></u-text>-->
                <view class="" style="position: relative;display:inline-block;">
                  <view style="color:#191919;font-size:30rpx;display:inline-block;position: relative;z-index: 2;">门窗、灯、空调、水电等状态</view>
                  <view class="background" style="width:100%;height:50%;position: absolute;bottom:0;left:0;background-color:rgba(227, 191, 119, 0.6);display:inline-block;z-index:1;"></view>
                </view>
              </view>
            </view>
<!--                  <u-text size="30" text="门窗、灯、空调、水电等状态"></u-text>-->
                </view>

                <view class="radio row" style="padding-bottom:30rpx;">
                  <view class="radio-box row col" v-for="item in ['保持原始状态','更改原始状态']" style="width:auto;align-items: center;" @click="applianceInfoChange(item)">
                    <view class="box "
                          style="display:flex;justify-content:center;align-items:center;
                           width:35rpx;height:35rpx;border-radius: 50%;border:2rpx solid;background-color:#4EC2B7;
                            margin-right:15rpx;"
                          :style="{
                             borderColor:(model.appliance_info.option === item ? 'transparent':'#c8c9cc'),
                             backgroundColor:(model.appliance_info.option === item ? '#4EC2B7':'transparent')
                           }"
                    >
                      <u-icon name="checkbox-mark" size="25rpx" :color="(model.appliance_info.option === item ? '#fff' : 'transparent')"></u-icon>
                    </view>
                    <view class="label " style="font-size:26rpx;">
                      {{item}}
                    </view>
                  </view>
                </view>
<!--                <u-radio-group v-model="model.appliance_info.option" @change="applianceInfoChange" size="40">-->
<!--                  <u-radio name="保持原始状态" label="保持原始状态" labelSize="28" icon-size="28" active-color="#4EC2B7"-->
<!--                           custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-radio>-->
<!--                  <u-radio name="更改原始状态" label="更改原始状态" labelSize="28" icon-size="28" active-color="#4EC2B7"-->
<!--                           custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-radio>-->
<!--                </u-radio-group>-->
                <uv-upload
                    accept="media"
                    width="160rpx"
                    height="160rpx"
                    :fileList="images.appliance_info"
                    name="1"
                    multiple
                    :maxCount="10"
                    uploadIcon="plus"
                    @delete="(res) => {uploadDel(res,'appliance_info')}"
                    @afterRead="(res) => {uploadPut(res,'appliance_info')}"
                ></uv-upload>
                <u-textarea
                    v-model="model.appliance_info.remark"
                    border="none"
                    placeholder="请描述您遇到的问题"
                    height="220"
                    :custom-style="{
                backgroundColor:'#FAFAFA',
                padding:'20rpx 20rpx'
              }"
                ></u-textarea>
              </mz-card>
            </u-form-item>
            <u-form-item
                prop="userInfo.sex"
                :custom-style="{padding:'0',marginBottom:'30rpx;'}"
            >
              <mz-card>
                <view class="form-label">
                  <view class="title row" style="position:relative;justify-content: flex-start;width:100%;top:0rpx;left:0;">
              <view class="value col" style="position: relative;text-align: left;">

                <!--        <u-text text="协议内容" size="38" color="#191919"></u-text>-->
                <view class="" style="position: relative;display:inline-block;">
                  <view style="color:#191919;font-size:30rpx;display:inline-block;position: relative;z-index: 2;">离开时萌宠安全确认</view>
                  <view class="background" style="width:100%;height:50%;position: absolute;bottom:0;left:0;background-color:rgba(227, 191, 119, 0.6);display:inline-block;z-index:1;"></view>
                </view>
              </view>
            </view>
<!--                  <u-text size="30" text="离开时萌宠安全确认"></u-text>-->
                </view>
                <uv-upload
                    accept="media"
                    width="160rpx"
                    height="160rpx"
                    :fileList="images.pet_secure"
                    name="1"
                    multiple
                    :maxCount="10"
                    uploadIcon="plus"
                    @delete="(res) => {uploadDel(res,'pet_secure')}"
                    @afterRead="(res) => {uploadPut(res,'pet_secure')}"
                ></uv-upload>
                <u-textarea
                    v-model="model.pet_secure.remark"
                    border="none"
                    placeholder="请描述您遇到的问题"
                    height="220"
                    :custom-style="{
                backgroundColor:'#FAFAFA',
                padding:'20rpx 20rpx'
              }"
                ></u-textarea>
              </mz-card>
            </u-form-item>
            <u-form-item
                prop="userInfo.sex"
                :custom-style="{padding:'0',marginBottom:'30rpx;'}"
            >
              <mz-card>
                <view class="form-label">
                  <view class="title row" style="position:relative;justify-content: flex-start;width:100%;top:0rpx;left:0;">
              <view class="value col" style="position: relative;text-align: left;">

                <!--        <u-text text="协议内容" size="38" color="#191919"></u-text>-->
                <view class="" style="position: relative;display:inline-block;">
                  <view style="color:#191919;font-size:30rpx;display:inline-block;position: relative;z-index: 2;">关闭房门安全离开</view>
                  <view class="background" style="width:100%;height:50%;position: absolute;bottom:0;left:0;background-color:rgba(227, 191, 119, 0.6);display:inline-block;z-index:1;"></view>
                </view>
              </view>
            </view>
<!--                  <u-text size="30" text="关闭房门安全离开"></u-text>-->
                </view>
                <view class="form-label">
                  <u-text size="24" color="#999" text="普通锁"></u-text>
                </view>
                <view class="radio row" style="padding-bottom:30rpx;">
                  <view class="radio-box row col" v-for="item in ['已反锁','已关门未反锁']" style="width:auto;align-items: center;" @click="closeChange(item)">
                    <view class="box "
                          style="display:flex;justify-content:center;align-items:center;
                           width:35rpx;height:35rpx;border-radius: 50%;border:2rpx solid;background-color:#4EC2B7;
                            margin-right:15rpx;"
                          :style="{
                             borderColor:(model.close.option === item ? 'transparent':'#c8c9cc'),
                             backgroundColor:(model.close.option === item ? '#4EC2B7':'transparent')
                           }"
                    >
                      <u-icon name="checkbox-mark" size="25rpx" :color="(model.close.option === item ? '#fff' : 'transparent')"></u-icon>
                    </view>
                    <view class="label " style="font-size:26rpx;">
                      {{item}}
                    </view>
                  </view>
                </view>
<!--                <u-radio-group v-model="model.close.option" @change="closeChange" size="40">-->
<!--                  <u-radio name="已反锁" label="已反锁" labelSize="28" icon-size="28" active-color="#4EC2B7"-->
<!--                           custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-radio>-->
<!--                  <u-radio name="已关门未反锁" label="已关门未反锁" labelSize="28" icon-size="28" active-color="#4EC2B7"-->
<!--                           custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-radio>-->
<!--                </u-radio-group>-->
                <uv-upload
                    accept="media"
                    width="160rpx"
                    height="160rpx"
                    :fileList="images.close"
                    name="1"
                    multiple
                    :maxCount="10"
                    uploadIcon="plus"
                    @delete="(res) => {uploadDel(res,'close')}"
                    @afterRead="(res) => {uploadPut(res,'close')}"
                ></uv-upload>
                <u-textarea
                    v-model="model.close.remark"
                    border="none"
                    placeholder="请描述您遇到的问题"
                    height="220"
                    :custom-style="{
                backgroundColor:'#FAFAFA',
                padding:'20rpx 20rpx'
              }"
                ></u-textarea>
                <view class="form-label">
                  <u-text size="24" color="#999" text="密码锁"></u-text>
                </view>
                <view class="radio row" style="padding-bottom:30rpx;">
                  <view class="radio-box row col" v-for="item in ['已反锁','已关门未反锁']" style="width:auto;align-items: center;" @click="closeMimaChange(item)">
                    <view class="box "
                          style="display:flex;justify-content:center;align-items:center;
                           width:35rpx;height:35rpx;border-radius: 50%;border:2rpx solid;background-color:#4EC2B7;
                            margin-right:15rpx;"
                          :style="{
                             borderColor:(model.close_mima.option === item ? 'transparent':'#c8c9cc'),
                             backgroundColor:(model.close_mima.option === item ? '#4EC2B7':'transparent')
                           }"
                    >
                      <u-icon name="checkbox-mark" size="25rpx" :color="(model.close_mima.option === item ? '#fff' : 'transparent')"></u-icon>
                    </view>
                    <view class="label " style="font-size:26rpx;">
                      {{item}}
                    </view>
                  </view>
                </view>
<!--                <u-radio-group v-model="model.close_mima.option" @change="closeMimaChange" size="40">-->
<!--                  <u-radio name="已反锁" label="已反锁" labelSize="28" icon-size="28" active-color="#4EC2B7"-->
<!--                           custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-radio>-->
<!--                  <u-radio name="已关门未反锁" label="已关门未反锁" labelSize="28" icon-size="28" active-color="#4EC2B7"-->
<!--                           custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-radio>-->
<!--                </u-radio-group>-->
                <uv-upload
                    accept="media"
                    width="160rpx"
                    height="160rpx"
                    :fileList="images.close_mima"
                    name="1"
                    multiple
                    :maxCount="10"
                    uploadIcon="plus"
                    @delete="(res) => {uploadDel(res,'close_mima')}"
                    @afterRead="(res) => {uploadPut(res,'close_mima')}"
                ></uv-upload>
                <u-textarea
                    v-model="model.close_mima.remark"
                    border="none"
                    placeholder="请描述您遇到的问题"
                    height="220"
                    :custom-style="{
                backgroundColor:'#FAFAFA',
                padding:'20rpx 20rpx'
              }"
                ></u-textarea>
              </mz-card>
            </u-form-item>
            <u-form-item
                prop="userInfo.sex"
                :custom-style="{padding:'0',marginBottom:'30rpx;'}"
            >
              <mz-card>
                <view class="form-label">
                  <view class="title row" style="position:relative;justify-content: flex-start;width:100%;top:0rpx;left:0;">
              <view class="value col" style="position: relative;text-align: left;">

                <!--        <u-text text="协议内容" size="38" color="#191919"></u-text>-->
                <view class="" style="position: relative;display:inline-block;">
                  <view style="color:#191919;font-size:30rpx;display:inline-block;position: relative;z-index: 2;">房门钥匙</view>
                  <view class="background" style="width:100%;height:50%;position: absolute;bottom:0;left:0;background-color:rgba(227, 191, 119, 0.6);display:inline-block;z-index:1;"></view>
                </view>
              </view>
            </view>
<!--                  <u-text size="30" text="房门钥匙"></u-text>-->
                </view>

                <view class="radio row" style="padding-bottom:30rpx;">
                  <view class="radio-box row col" v-for="item in ['钥匙已密封带走保管','放在宠主指定位置']" style="width:auto;align-items: center;" @click="keyChange(item)">
                    <view class="box "
                          style="display:flex;justify-content:center;align-items:center;
                           width:35rpx;height:35rpx;border-radius: 50%;border:2rpx solid;background-color:#4EC2B7;
                            margin-right:15rpx;"
                          :style="{
                             borderColor:(model.key.option === item ? 'transparent':'#c8c9cc'),
                             backgroundColor:(model.key.option === item ? '#4EC2B7':'transparent')
                           }"
                    >
                      <u-icon name="checkbox-mark" size="25rpx" :color="(model.key.option === item ? '#fff' : 'transparent')"></u-icon>
                    </view>
                    <view class="label " style="font-size:26rpx;">
                      {{item}}
                    </view>
                  </view>
                </view>
<!--                <u-radio-group v-model="model.key.option" @change="keyChange" size="40">-->
<!--                  <u-radio name="钥匙已密封带走保管" label="钥匙已密封带走保管" labelSize="28" icon-size="28"-->
<!--                           active-color="#4EC2B7"-->
<!--                           custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-radio>-->
<!--                  <u-radio name="放在宠主指定位置" label="放在宠主指定位置" labelSize="28" icon-size="28"-->
<!--                           active-color="#4EC2B7"-->
<!--                           custom-style="margin-right:30rpx;margin-bottom:30rpx;"></u-radio>-->
<!--                </u-radio-group>-->
                <uv-upload
                    accept="media"
                    width="160rpx"
                    height="160rpx"
                    :fileList="images.key"
                    name="1"
                    multiple
                    :maxCount="10"
                    uploadIcon="plus"
                    @delete="(res) => {uploadDel(res,'key')}"
                    @afterRead="(res) => {uploadPut(res,'key')}"
                ></uv-upload>
                <u-textarea
                    v-model="model.key.remark"
                    border="none"
                    placeholder="请描述您遇到的问题"
                    height="220"
                    :custom-style="{
                backgroundColor:'#FAFAFA',
                padding:'20rpx 20rpx'
              }"
                ></u-textarea>
              </mz-card>
            </u-form-item>
            <u-form-item
                prop="userInfo.sex"
                :custom-style="{padding:'0',marginBottom:'30rpx;'}"
            >
              <mz-card>
                <view class="form-label">
                  <view class="title row" style="position:relative;justify-content: flex-start;width:100%;top:0rpx;left:0;">
              <view class="value col" style="position: relative;text-align: left;">

                <!--        <u-text text="协议内容" size="38" color="#191919"></u-text>-->
                <view class="" style="position: relative;display:inline-block;">
                  <view style="color:#191919;font-size:30rpx;display:inline-block;position: relative;z-index: 2;">离开时间</view>
                  <view class="background" style="width:100%;height:50%;position: absolute;bottom:0;left:0;background-color:rgba(227, 191, 119, 0.6);display:inline-block;z-index:1;"></view>
                </view>
              </view>
            </view>
<!--                  <u-text size="30" text="离开时间"></u-text>-->
                </view>
                <u-cell
                    :title="model.leave || '请选择离开时间 '"
                    is-link
                    @click="$refs.goOutTime.open();"
                    custom-style="padding:0"
                >

                </u-cell>
                <!--          <u-text size="30" :text="model.arriveTime" @click="$refs.arriveTime.open();"></u-text>-->
                <uv-datetime-picker ref="goOutTime" :value="model.leave" mode="datetime"
                                    @confirm="timeConfirm"></uv-datetime-picker>
              </mz-card>
            </u-form-item>
          </view>
          </view>
        </view>
      </u-form>
      <view class="bottom-btn border-box" style="box-sizing: border-box;">
        <MzButton title="保存" button-color="#4EC2B7" button-width="100%" font-color="#fff" @click="submit"></MzButton>
      </view>
    </u-col>
  </u-row>
</template>

<script>
import {
  imghost
} from '@/config/host.js'
import api from '@/utils/functions.js';
import HeaderNav from "@/components/HeaderNav/Index.vue";
import MzButton from "@/components/MzButton/Index.vue";
import {orderDone, orderEnd} from "@/api/order";
import {orderServiceInfo} from "../../api/order";

export default {
  components: {
    MzButton,
    HeaderNav,
  },
  data() {
    return {
      value: 1,
      title: '结束服务',
      loading: true,
      staticImage: {
        bg: imghost + '/BG.png',
        newIcon: imghost + '/new-icon.png',
      },
      isTop: false,
      fileList: [],
      model: {
        order_service_id: '',
        appliance: {option: '全部关闭', remark: '', upload: []},
        before_status: {option: '未破坏', remark: '', upload: []},
        pet_status: {option: '', remark: '', upload: []},
        food_status: {food_option: '充足', water_option: '充足', remark: '', upload: []},
        sick: {option: '', remark: '', upload: []},
        excrement: {option: '', remark: '', upload: []},
        other: {option: '', remark: '', upload: []},
        food_bowl: {value: 0, remark: '', upload: []},
        basin: {value: 0, remark: '', upload: []},
        staple_food: {option: '', type_option: '', remark: '', upload: []},
        water: {option: '', remark: '', upload: []},
        snacks: {option: '', remark: '', upload: []},
        wowo: {option: '', remark: '', upload: []},
        cage: {option: '', remark: '', upload: []},
        hair: {option: '', remark: '', upload: []},
        pet_sick: {option: '', remark: '', upload: []},
        pet_excrement: {option: '', remark: '', upload: []},
        cat_litter: {option: '', remark: '', upload: []},
        other_info: {option: '', remark: '', upload: []},
        foundation: {option: '', remark: '', upload: []},
        health: '',
        health_other: {option: '', remark: '', upload: []},
        pet_clean: {option: '', remark: '', upload: []},
        before_facial: {option: '', remark: '', upload: []},
        pet_facial: {option: '', remark: '', upload: []},
        end_facial: {option: '', remark: '', upload: []},
        home_play: {option: '', remark: '', upload: []},
        out_play: {option: '', number_option: '', feces_option: '', in_home_option: '', remark: '', upload: []},
        trash: {option: '', remark: '', upload: []},
        appliance_info: {option: '保持原始状态', remark: '', upload: []},
        pet_secure: {option: '', remark: '', upload: []},
        close: {option: '已反锁', remark: '', upload: []},
        close_mima: {option: '已反锁', remark: '', upload: []},
        key: {option: '钥匙已密封带走保管', remark: '', upload: []},
        leave: '',
        goOutTime: ''
      },
      images: {
        appliance: [],
        before_status: [],
        pet_status: [],
        food_status: [],
        sick: [],
        excrement: [],
        other: [],
        food_bowl: [],
        basin: [],
        staple_food: [],
        water: [],
        snacks: [],
        wowo: [],
        cage: [],
        hair: [],
        pet_sick: [],
        pet_excrement: [],
        cat_litter: [],
        other_info: [],
        foundation: [],
        health: [],
        health_other: [],
        pet_clean: [],
        before_facial: [],
        pet_facial: [],
        end_facial: [],
        home_play: [],
        out_play: [],
        trash: [],
        appliance_info: [],
        pet_secure: [],
        close: [],
        close_mima: [],
        key: [],
      },
      rules: {
        'connect': {
          type: 'string',
          required: true,
          message: '请填写联系方式',
          trigger: ['blur', 'change']
        },
        'remark': {
          type: 'string',
          required: true,
          message: '请填写内容',
          trigger: ['blur', 'change']
        },
      },
      collapseChecked:'0',
    }
  },
  onLoad(option) {
    this.model.order_service_id = option.id;
    this.model.leave = uni.$u.timeFormat(null, 'yyyy-mm-dd hh:MM');
    if(option.type === 'edit'){
      this.getServiceTable(option.id);
    }
  },
  computed: {
    api() {
      return api
    },
  },
  methods: {
    beforeStatusChange(e){
      if(this.model.before_status.option === e){
        this.model.before_status.option = '';
      }else{
        this.model.before_status.option = e;
      }
    },
    foodChange(e){
      if(this.model.food_status.food_option === e){
          this.model.food_status.food_option = '';
      }else{
        this.model.food_status.food_option = e;
      }
    },
    waterChange(e){
      if(this.model.food_status.water_option === e){
        this.model.food_status.water_option = '';
      }else{
        this.model.food_status.water_option = e;
      }
    },
    applianceChange(e){
      if(this.model.appliance.option === e){
        this.model.appliance.option = '';
      }else{
        this.model.appliance.option = e;
      }
    },
    healthChange(e){
      if(this.model.health.option === e){
        this.model.health = '';
      }else{
        this.model.health = e;
      }
    },
    applianceInfoChange(e){
      if(this.model.appliance_info.option === e){
        this.model.appliance_info.option = '';
      }else{
        this.model.appliance_info.option = e;
      }
    },
    closeChange(e){
      if(this.model.close.option === e){
        this.model.close.option = '';
      }else{
        this.model.close.option = e;
      }
    },
    closeMimaChange(e){
      if(this.model.close_mima.option === e){
        this.model.close_mima.option = '';
      }else{
        this.model.close_mima.option = e;
      }
    },
    keyChange(e){
      if(this.model.key.option === e){
        this.model.key.option = '';
      }else{
        this.model.key.option = e;
      }
    },
    changeCollapse(name){
      if(this.collapseChecked === name){
        this.collapseChecked = '';
      }else{
        this.collapseChecked = name;
      }
      this.goTop();
    },
    getServiceTable(id){
      let that = this;
      let images = [
        'appliance',
        'before_status',
        'pet_status',
        'food_status',
        'sick',
        'excrement',
        'other',
        'food_bowl',
        'basin',
        'staple_food',
        'water',
        'snacks',
        'wowo',
        'cage',
        'hair',
        'pet_sick',
        'pet_excrement',
        'cat_litter',
        'other_info',
        'foundation',
        // 'health',
        'health_other',
        'pet_clean',
        'before_facial',
        'pet_facial',
        'end_facial',
        'home_play',
        'out_play',
        'trash',
        'appliance_info',
        'pet_secure',
        'close',
        'close_mima',
        'key',
      ];
      orderServiceInfo(id).then(data => {
        let id = this.model.order_service_id;
        this.model = data.data.endservice;
        this.model.order_service_id = id;
        images.forEach((item) => {
          that.uploadShow(data.data.endservice[item].upload,item);
        });
      })
    },
    timeConfirm(e) {
      this.model.leave = uni.$u.timeFormat(e.value, 'yyyy-mm-dd hh:MM');
    },
    uploadSubmit(data, fileName = '') {
      this.model[fileName].upload = data.map(item => {
        return {url: item.url, type: item.type};
      })
    },
    uploadShow(data, fileName = '') {
      let result = [];
      try {
        data.forEach(item => {
          result.push({url: item.url, type: item.type})
        })
      } catch (e) {
        this.images[fileName] = [];
      }
      this.images[fileName] = result;
    },
    uploadPut(event, fileName = '') {
      let lists = [].concat(event.file);
      let fileListLen = this.images[fileName].length;
      lists.map((item) => {
        this.images[fileName].push({
          ...item,
          status: 'uploading',
          message: '上传中',
        });
      });
      for (let i = 0; i < lists.length; i++) {
        const fileType = api.getFileType(lists[i].url);
        console.log(fileType)
        api.uploadOssFile(lists[i].url).then(res => {
          let item = this.images[fileName][fileListLen];
          this.images[fileName].splice(fileListLen, 1, {
            ...item,
            status: 'success',
            message: '',
            url: res.show_path,
            thumb: res.show_path,
            type: fileType
          });
          fileListLen++;
        })
      }
    },
    uploadDel(fileIndex, fileName = '') {
      this.images[fileName].splice(fileIndex.index, 1);
    },
    submit() {
      let that = this;
      let data = [
        'appliance',
        'before_status',
        'pet_status',
        'food_status',
        'sick',
        'excrement',
        'other',
        'food_bowl',
        'basin',
        'staple_food',
        'water',
        'snacks',
        'wowo',
        'cage',
        'hair',
        'pet_sick',
        'pet_excrement',
        'cat_litter',
        'other_info',
        'foundation',
        // 'health',
        'health_other',
        'pet_clean',
        'before_facial',
        'pet_facial',
        'end_facial',
        'home_play',
        'out_play',
        'trash',
        'appliance_info',
        'pet_secure',
        'close',
        'close_mima',
        'key',
      ];
      new Promise((resolve, reject) => {
        data.forEach((item, index) => {
          that.uploadSubmit(this.images[item], item);
          if (index === data.length - 1) {
            resolve()
          }
        });
      }).then(() => {
        orderEnd(this.model).then((res) => {
          if (res.code === 200) {
            api.success('保存成功').then(() => {
              uni.navigateBack();
            })
          } else {
            uni.$u.toast(res.msg)
          }
        })
      });
      // }).catch(errors => {
      //   uni.$u.toast(errors[0].message)
      // })

    },
    //上传文件
    async afterFileRead(event) {
      let lists = [].concat(event.file);

      let fileListLen = this.fileList.length;
      lists.map((item) => {
        this.fileList.push({
          ...item,
          status: 'uploading',
          message: '上传中',
        });
      });
      for (let i = 0; i < lists.length; i++) {

        api.uploadOssFile(lists[i].url).then(res => {
          let item = this.fileList[fileListLen];
          this.fileList.splice(fileListLen, 1, {
            ...item,
            status: 'success',
            message: '',
            url: res.show_path,
            thumb: res.show_path,
          });
          fileListLen++;
        })
        // const result = await uploadFilePromise(lists[i].url);

      }
    },
    //删除上传图片
    deleteFile(event) {
      this.fileList.splice(event.index, 1);
    },
    copyContent() {
      uni.setClipboardData({
        data: '',
        success: function () {
          //调用方法成功
        }
      })
    },
    goTop(){
        uni.pageScrollTo({
          scrollTop: 0,
          success:(res)=>{
            console.log('res',res)
          },
          fail:(err) => {
            console.log('err',err)
          }
        });
    }
  },
  onPageScroll(res) {
    if (res.scrollTop <= 20) {
      uni.$emit('isTop', true);
    } else {
      uni.$emit('isTop', false);
    }
  },
  created() {

  }
}
</script>

<style lang="scss">
@import './components/end.scss';
::v-deep .u-collapse-item__content__text{
  padding:20rpx !important;
}
</style>