王恒
2025-09-04 616e6be49d3f64f2397cb1b1c05d2c06df3db9a3
qiye/record/details.vue
@@ -1,582 +1,626 @@
<template>
   <view>
      <u-navbar placeholder bgColor="#1171E0FF" leftIconColor="white" :autoBack="true">
         <template slot="center">
            <view style="color: white;">执法信息</view>
         </template>
      </u-navbar>
      <view class="donw-box"></view>
      <view class="page-main">
         <view class="title">
            <template v-if="msg.isEva==0">未评价</template>
  <view>
    <u-navbar placeholder bgColor="#1171E0FF" leftIconColor="white" :autoBack="true">
      <template slot="center">
        <view style="color: white;">执法信息</view>
      </template>
    </u-navbar>
    <view class="donw-box"></view>
    <view class="page-main">
      <view class="title">
        执法详情
        <!--    <template v-if="msg.isEva==0">未评价</template>
            <template v-if="msg.isEva==1">已评价</template>
            <template v-if="msg.orderStatus==2">待执法</template>
         </view>
         <view class="wbox">
            <view class="item">
               <view class="k">
                  执法类型
               </view>
               <view class="v">
                  {{type}}
               </view>
            </view>
            <view class="item">
               <view class="k">
                  执法人
               </view>
               <view class="v">
                  {{msg.executeUser || msg.applyUser}}
               </view>
            </view>
            <view class="item">
               <view class="k">
                  执法部门
               </view>
               <view class="v">
                  {{msg.executeDeptName || msg.applyDeptName}}
               </view>
            </view>
            <view class="item">
            <template v-if="msg.orderStatus==2">待执法</template> -->
      </view>
      <view class="wbox">
        <view class="item">
          <view class="k">
            检查方式
          </view>
          <view class="v">
            {{type}}
          </view>
        </view>
        <view class="item">
          <view class="k">
            执法人
          </view>
          <view class="v">
            {{msg.executeUser || msg.applyUser}}
          </view>
        </view>
        <view class="item">
          <view class="k">
            执法部门
          </view>
          <view class="v">
            {{msg.executeDeptName || msg.applyDeptName}}
          </view>
        </view>
        <!-- <view class="item">
               <view class="k">
                  企业
               </view>
               <view class="v">
                  {{msg.companyName}}
               </view>
            </view>
         </view>
         <view style="height: 20rpx;"></view>
         <view class="wbox">
            <view class="item">
               <view class="k">
                  执法主题
               </view>
               <view class="v">
                  {{msg.enforceReason}}
               </view>
            </view>
            <view class="item">
               <view class="k">
                  执法过程
               </view>
               <view class="v" v-if="!img.length">
                  {{msg.regionReason || '执法过程待上报'}}
               </view>
            </view>
            <view class="imgbox"  v-if="img.length">
               <template >
                  <img v-for="(item,index) in img" :key="index" :src="item" class="more" alt="" @click="imgclick(item)" />
               </template>
               <!-- <img src="/static/i01.png" class="more" @click="imgclick('/static/i01.png')" alt="" />
            </view> -->
      </view>
      <view style="height: 20rpx;"></view>
      <view class="wbox">
        <view class="item">
          <view class="k">
            执法主题
          </view>
          <view class="v">
            {{msg.enforceReason}}
          </view>
        </view>
        <view class="item">
          <view class="k">
            执法内容
          </view>
          <view class="v" v-if="!img.length">
            {{ msg.enforceContent}}
          </view>
        </view>
        <view class="imgbox" v-if="img.length">
          <template>
            <img v-for="(item,index) in img" :key="index" :src="item" class="more" alt="" @click="imgclick(item)" />
          </template>
          <!-- <img src="/static/i01.png" class="more" @click="imgclick('/static/i01.png')" alt="" />
               <img src="/static/i02.png" class="more" alt="" />
               <img src="/static/i03.png" class="more" alt="" />
               <img src="/static/i04.png" class="more" alt="" /> -->
            </view>
            <view class="item">
               <view class="k">
                  执法结果
               </view>
               <view class="v" style="color: #EB4746;">
                  {{msg.regionReason || '执法结果待上报'}}
               </view>
            </view>
            <view class="item">
               <view class="k">
                  执法时间
               </view>
               <view class="v">
                  {{msg.inTime || "待执法"}}
               </view>
            </view>
         </view>
         <view style="height: 20rpx;"></view>
         <view class="wbox2" v-if="msg.isEva==1">
            <view class="t">
               执法评价
            </view>
            <template v-for="(item,index) in qlist">
               <view class="sbox" v-if="item.questionType==2">
                  <view class="t2">
                     {{item.questionName}}
                  </view>
                  <view class="xbox">
                     <view>
                        <img src="/static/qiye/xing1.png" alt="" />
                        <view>
                           很糟糕
                        </view>
                     </view>
                     <view>
                        <img v-if="item.getScore>=2" src="/static/qiye/xing1.png" alt="" />
                        <img v-else src="/static/qiye/xing2.png" alt="" />
                        <view :class="item.getScore==2?'hei':''">
                           不满意
                        </view>
                     </view>
                     <view>
                        <img v-if="item.getScore>=3" src="/static/qiye/xing1.png" alt="" />
                        <img v-else src="/static/qiye/xing2.png" alt="" />
                        <view :class="item.getScore==3?'hei':''">
                           一般般
                        </view>
                     </view>
                     <view>
                        <img v-if="item.getScore>=4" src="/static/qiye/xing1.png" alt="" />
                        <img v-else src="/static/qiye/xing2.png" alt="" />
                        <view :class="item.getScore==4?'hei':''">
                           满意
                        </view>
                     </view>
                     <view>
                        <img v-if="item.getScore>=5" src="/static/qiye/xing1.png" alt="" />
                        <img v-else src="/static/qiye/xing2.png" alt="" />
                        <view :class="item.getScore==5?'hei':''">
                           非常满意
                        </view>
                     </view>
                  </view>
                  <view class="line"></view>
               </view>
               <view class="sbox" v-if="item.questionType==1">
                  <view class="t2">
                     {{item.questionName}}
                  </view>
                  <u-radio-group v-model="item.remark">
                     <u-radio v-for="(aa, ii) in item.answerList" :key="ii" :name="aa.answerId"
                     :disabled="item.remark!=aa.answerId">
                        {{aa.answerName}}
                     </u-radio>
                  </u-radio-group>
                  <!-- <u-radio-group v-model="value">
        </view>
        <view class="item">
          <view class="k">
            执法结果
          </view>
          <view class="v" style="color: #EB4746;">
            {{msg.regionReason || '--'}}
          </view>
        </view>
        <view class="item">
          <view class="k">
            执法时间
          </view>
          <view class="v">
            {{msg.inTime || msg.planTime}}
          </view>
        </view>
      </view>
      <view style="height: 20rpx;"></view>
      <view class="wbox2" v-if="msg.isEva==1">
        <view class="t">
          执法评价
        </view>
        <template v-for="(item,index) in qlist">
          <view class="sbox" v-if="item.questionType==2">
            <view class="t2">
              {{item.questionName}}
            </view>
            <view class="xbox">
              <view>
                <img src="/static/qiye/xing1.png" alt="" />
                <view>
                  很糟糕
                </view>
              </view>
              <view>
                <img v-if="item.getScore>=2" src="/static/qiye/xing1.png" alt="" />
                <img v-else src="/static/qiye/xing2.png" alt="" />
                <view :class="item.getScore==2?'hei':''">
                  不满意
                </view>
              </view>
              <view>
                <img v-if="item.getScore>=3" src="/static/qiye/xing1.png" alt="" />
                <img v-else src="/static/qiye/xing2.png" alt="" />
                <view :class="item.getScore==3?'hei':''">
                  一般般
                </view>
              </view>
              <view>
                <img v-if="item.getScore>=4" src="/static/qiye/xing1.png" alt="" />
                <img v-else src="/static/qiye/xing2.png" alt="" />
                <view :class="item.getScore==4?'hei':''">
                  满意
                </view>
              </view>
              <view>
                <img v-if="item.getScore>=5" src="/static/qiye/xing1.png" alt="" />
                <img v-else src="/static/qiye/xing2.png" alt="" />
                <view :class="item.getScore==5?'hei':''">
                  非常满意
                </view>
              </view>
            </view>
            <view class="line"></view>
          </view>
          <view class="sbox" v-if="item.questionType==1">
            <view class="t2">
              {{item.questionName}}
            </view>
            <u-radio-group v-model="item.remark">
              <u-radio v-for="(aa, ii) in item.answerList" :key="ii" :name="aa.answerId"
                :disabled="item.remark!=aa.answerId">
                {{aa.answerName}}
              </u-radio>
            </u-radio-group>
            <!-- <u-radio-group v-model="value">
                     <u-radio name="orange">选中</u-radio>
                     <u-radio name="1" :disabled="true">未选中</u-radio>
                  </u-radio-group> -->
                  <view class="line"></view>
               </view>
            </template>
            <view class="sbox" v-if="msg.evaluateVo.questionRemark">
               <view class="t2">
                  对我们的评价
               </view>
               <view class="pjbox">
                  {{msg.evaluateVo.questionRemark}}
               </view>
            </view>
         </view>
      </view>
      <view class="bottom" v-if="msg.orderStatus==3 || msg.orderStatus== 4">
         <view class="one" v-if="msg.isComplaint != 1 && msg.isEva == 1">
            <view class="b1" @click="open()">
               投诉
            </view>
         </view>
         <view class="two" v-if="msg.isComplaint != 1 && msg.isEva != 1">
            <view class="b2" @click="open()" >
               投诉
            </view>
            <view class="b3" @click="pingjia()">
               我要评价
            </view>
         </view>
         <view class="one" v-if="msg.isComplaint == 1 && msg.isEva != 1">
            <view class="b1" @click="pingjia()">
               我要评价
            </view>
         </view>
      </view>
      <u-popup :show="show" @close="close" mode="bottom" round="10" closeable>
         <view class="page-box">
            <view class="title1">
               企业投诉
            </view>
            <view class="border"></view>
            <view class="padding">
               <view class="font">
                  投诉主题
               </view>
               <view>
                  <u-radio-group v-model="complaintType">
                                       <u-radio v-for="(aa, ii) in list" :key="ii" :name="aa.dictCode">
                                          {{aa.dictLabel}}
                                       </u-radio>
                                    </u-radio-group>
               </view>
               <view class="font">
                  投诉内容
               </view>
               <view class="margin-top">
                  <u-textarea :cursorSpacing="70" v-model="complaintReason" placeholder="请输入..."></u-textarea>
               </view>
            </view>
            <view class="down">
               <view class="enter" @click="entery()">提交</view>
            </view>
         </view>
      </u-popup>
   </view>
            <view class="line"></view>
          </view>
        </template>
        <view class="sbox" v-if="msg.evaluateVo.questionRemark">
          <view class="t2">
            对我们的评价
          </view>
          <view class="pjbox">
            {{msg.evaluateVo.questionRemark}}
          </view>
        </view>
      </view>
    </view>
    <view class="bottom" v-if="msg.orderStatus== 5 && from != 1">
      <view class="one" v-if="msg.isComplaint != 1 && msg.isEva == 1">
        <view class="b1" @click="open()">
          投诉
        </view>
      </view>
      <view class="two" v-if="msg.isComplaint != 1 && msg.isEva != 1">
        <view class="b2" @click="open()">
          投诉
        </view>
        <view class="b3" @click="pingjia()">
          我要评价
        </view>
      </view>
      <view class="one" v-if="msg.isComplaint == 1 && msg.isEva != 1">
        <view class="b1" @click="pingjia()">
          我要评价
        </view>
      </view>
    </view>
    <view class="bottom" v-if="msg.orderStatus == 4 && from != 1">
      <view class="one">
        <view class="b1" style="background-color: #1171E0;color: white;" @click="enterOrder()">
          确认
        </view>
      </view>
    </view>
    <u-popup :show="show" @close="close" mode="bottom" round="10" closeable>
      <view class="page-box">
        <view class="title1">
          企业投诉
        </view>
        <view class="border"></view>
        <view class="padding">
          <view class="font">
            投诉主题
          </view>
          <view>
            <u-radio-group v-model="complaintType">
              <u-radio v-for="(aa, ii) in list" :key="ii" :name="aa.dictCode">
                {{aa.dictLabel}}
              </u-radio>
            </u-radio-group>
          </view>
          <view class="font">
            投诉内容
          </view>
          <view class="margin-top">
            <u-textarea :cursorSpacing="70" v-model="complaintReason" placeholder="请输入..."></u-textarea>
          </view>
        </view>
        <view class="down">
          <view class="enter" @click="entery()">提交</view>
        </view>
      </view>
    </u-popup>
  </view>
</template>
<script>
   import { order } from '@/api/index.js'
   import { getDicts } from '@/api/data.js'
   import { config } from '@/common/config'
   import { orderComplaint } from '@/api/qiye.js'
   export default {
      data() {
         return {
            complaintType:'',
            complaintReason:'',
            id:'',
            msg:{},
            type:'',
            img:[],
            baseUrl: config.baseUrl,
            xing: 5,
            value: 'orange',
            //type: 2,
            show: false,
            list: [
            ],
            qlist:[]
         }
      },
      onLoad(options) {
         this.id = options.id
         //this.getdata(options.id)
         getDicts('complaint_type').then(val => {
            this.list = val.data.data
            console.log(this.list)
             // const value = val.data.data.find(item => item.dictCode == this.msg.enforceType)
             // this.type = value.dictLabel
         })
         // this.getdata()
      },
      onShow(options) {
         this.getdata()
      },
      methods: {
         getdata(){
            order(this.id).then(val => {
               this.msg = val.data.data
               getDicts('enforce_type').then(val => {
                   const value = val.data.data.find(item => item.dictCode == this.msg.enforceType)
                   this.type = value.dictLabel
               })
               let arr = this.msg.regionImgs.split(",");
               for(let i = 0;i<arr.length;i++){
                  this.img.push(this.baseUrl+arr[i])
               }
               this.qlist = this.msg.evaluateVo.questionList
               for(let i = 0;i<this.qlist.length;i++){
                  if(this.qlist[i].questionType==1&&this.qlist[i].remark){
                     this.qlist[i].remark = Number(this.qlist[i].remark)
                  }
               }
            })
         },
         daxing(a) {
            this.xing = a
         },
         imgclick(url) {
            uni.previewImage({
               urls: [url]
            })
         },
         pingjia(){
            uni.navigateTo({
               url: `/qiye/record/evaluate?id=${this.msg.orderId}`
            })
         },
         open() {
            this.show = true
         },
         close() {
            this.show = false
            this.$emit('cancel')
         },
         entery() {
            this.$emit('entery')
            if(this.complaintType==''){
               uni.showToast({
                  title: '请选择投诉主题',
                  icon: 'none'
               })
               return
            }
            if(this.complaintReason==''){
               uni.showToast({
                  title: '请输入投诉内容',
                  icon: 'none'
               })
               return
            }
            let data = {
               orderId:Number(this.id),
               complaintType:this.complaintType,
               complaintReason:this.complaintReason
            }
            console.log(data)
            //return;
            orderComplaint(data).then(val => {
               uni.showToast({
                  title: '提交成功',
                  icon: 'none'
               })
               this.show = false
            })
         },
  import {
    order
  } from '@/api/index.js'
  import {
    getDicts
  } from '@/api/data.js'
  import {
    config
  } from '@/common/config'
  import {
    orderComplaint,
    confirmOrderId
  } from '@/api/qiye.js'
  export default {
    data() {
      return {
        complaintType: '',
        complaintReason: '',
        id: '',
        msg: {},
        type: '',
        img: [],
        baseUrl: config.baseUrl,
        xing: 5,
        value: 'orange',
        //type: 2,
        show: false,
        list: [],
        qlist: [],
        from: '', // 1 综合查一次
      }
    },
    onLoad(options) {
      this.id = options.id
      this.from = options.type || ''
      //this.getdata(options.id)
      getDicts('complaint_type').then(val => {
        this.list = val.data.data
        console.log(this.list)
        // const value = val.data.data.find(item => item.dictCode == this.msg.enforceType)
        // this.type = value.dictLabel
      })
      // this.getdata()
    },
    onShow(options) {
      this.getdata()
    },
    methods: {
      enterOrder() {
        uni.showModal({
          title: '提示',
          content: '是否确认该检查内容?',
          success: val => {
            if (val.confirm) {
              confirmOrderId({
                orderId: this.msg.orderId
              }).then(val => {
                if (val.data.code == 200) {
                  uni.showToast({
                    title: '确认成功',
                    icon: 'none'
                  })
                  this.getdata()
                }
              })
            }
          }
      }
   }
        })
      },
      getdata() {
        order(this.id).then(val => {
          this.msg = val.data.data
          getDicts('enforce_type').then(val => {
            const value = val.data.data.find(item => item.dictCode == this.msg.enforceType)
            this.type = value.dictLabel
          })
          let arr = this.msg.regionImgs.split(",");
          for (let i = 0; i < arr.length; i++) {
            this.img.push(this.baseUrl + arr[i])
          }
          this.qlist = this.msg.evaluateVo.questionList
          for (let i = 0; i < this.qlist.length; i++) {
            if (this.qlist[i].questionType == 1 && this.qlist[i].remark) {
              this.qlist[i].remark = Number(this.qlist[i].remark)
            }
          }
        })
      },
      daxing(a) {
        this.xing = a
      },
      imgclick(url) {
        uni.previewImage({
          urls: [url]
        })
      },
      pingjia() {
        uni.navigateTo({
          url: `/qiye/record/evaluate?id=${this.msg.orderId}`
        })
      },
      open() {
        this.show = true
      },
      close() {
        this.show = false
        this.$emit('cancel')
      },
      entery() {
        this.$emit('entery')
        if (this.complaintType == '') {
          uni.showToast({
            title: '请选择投诉主题',
            icon: 'none'
          })
          return
        }
        if (this.complaintReason == '') {
          uni.showToast({
            title: '请输入投诉内容',
            icon: 'none'
          })
          return
        }
        let data = {
          orderId: Number(this.id),
          complaintType: this.complaintType,
          complaintReason: this.complaintReason
        }
        console.log(data)
        //return;
        orderComplaint(data).then(val => {
          uni.showToast({
            title: '提交成功',
            icon: 'none'
          })
          this.show = false
        })
      },
    }
  }
</script>
<style>
   page {
      background: #F4F4F4;
   }
  page {
    background: #F4F4F4;
  }
</style>
<style lang="scss" scoped>
   .page-main {
      position: relative;
      top: -380rpx;
   }
  .page-main {
    position: relative;
    top: -380rpx;
  }
   .donw-box {
      width: 100%;
      height: 380rpx;
      flex-shrink: 0;
      background: linear-gradient(180deg, #1171E0 42.5%, #F4F4F4 100%);
   }
  .donw-box {
    width: 100%;
    height: 380rpx;
    flex-shrink: 0;
    background: linear-gradient(180deg, #1171E0 42.5%, #F4F4F4 100%);
  }
   .wbox {
      background: #fff;
      border-radius: 5px;
      padding: 24rpx;
      box-sizing: border-box;
      margin: 0 32rpx;
  .wbox {
    background: #fff;
    border-radius: 5px;
    padding: 24rpx;
    box-sizing: border-box;
    margin: 0 32rpx;
      .item {
         display: flex;
         margin-bottom: 20rpx;
         font-size: 30rpx;
    .item {
      display: flex;
      margin-bottom: 20rpx;
      font-size: 30rpx;
         .k {
            color: #7E8596;
            width: 30%;
      .k {
        color: #7E8596;
        width: 30%;
         }
      }
         .v {
            color: #202D44;
            width: 70%;
      .v {
        color: #202D44;
        width: 70%;
         }
      }
      }
    }
      .item:last-child {
         margin-bottom: 0;
      }
    .item:last-child {
      margin-bottom: 0;
    }
      .imgbox {
         display: grid;
         grid-template-columns: 1fr 1fr 1fr;
         grid-gap: 10rpx;
         // display: flex;
         // flex-wrap: wrap;
         // justify-content: space-between;
         border-radius: 10rpx;
    .imgbox {
      display: grid;
      grid-template-columns: 1fr 1fr 1fr;
      grid-gap: 10rpx;
      // display: flex;
      // flex-wrap: wrap;
      // justify-content: space-between;
      border-radius: 10rpx;
         img {
            width: 198rpx;
            height: 198rpx;
            margin-bottom: 20rpx;
            border-radius: 10rpx;
         }
      }
   }
      img {
        width: 198rpx;
        height: 198rpx;
        margin-bottom: 20rpx;
        border-radius: 10rpx;
      }
    }
  }
   .title {
      color: #ffffff;
      font-size: 44rpx;
      font-weight: bold;
      padding-left: 32rpx;
      margin-top: 24rpx;
      margin-bottom: 24rpx;
  .title {
    color: #ffffff;
    font-size: 44rpx;
    font-weight: bold;
    padding-left: 32rpx;
    margin-top: 24rpx;
    margin-bottom: 24rpx;
   }
  }
   .wbox2 {
      background: #fff;
      border-radius: 5px;
      box-sizing: border-box;
      margin: 0 32rpx;
  .wbox2 {
    background: #fff;
    border-radius: 5px;
    box-sizing: border-box;
    margin: 0 32rpx;
      .t {
         padding: 24rpx;
         border-bottom: 1px solid #EEEEEE;
         color: #202d44;
         font-size: 36rpx;
         font-weight: bold;
      }
    .t {
      padding: 24rpx;
      border-bottom: 1px solid #EEEEEE;
      color: #202d44;
      font-size: 36rpx;
      font-weight: bold;
    }
      .sbox {
         padding: 24rpx;
    .sbox {
      padding: 24rpx;
         .line {
            border-bottom: 1px dashed #f1f1f1;
            margin-top: 32rpx;
         }
      .line {
        border-bottom: 1px dashed #f1f1f1;
        margin-top: 32rpx;
      }
         .xbox {
            display: flex;
            margin-top: 36rpx;
            justify-content: space-between;
      .xbox {
        display: flex;
        margin-top: 36rpx;
        justify-content: space-between;
            img {
               width: 74rpx;
               height: 74rpx;
            }
        img {
          width: 74rpx;
          height: 74rpx;
        }
            >view {
               text-align: center;
               font-size: 28rpx;
               color: #C3C6CD;
            }
         }
      }
   }
        >view {
          text-align: center;
          font-size: 28rpx;
          color: #C3C6CD;
        }
      }
    }
  }
   .pjbox {
      background: #F4F4F4;
      border-radius: 5px;
      margin: 10rpx 0;
      padding: 24rpx;
      color: #202d44;
      font-size: 32rpx;
  .pjbox {
    background: #F4F4F4;
    border-radius: 5px;
    margin: 10rpx 0;
    padding: 24rpx;
    color: #202d44;
    font-size: 32rpx;
   }
  }
   /deep/ .u-radio-group {
      margin-top: 20rpx;
      flex-wrap: wrap;
      .u-radio {
         margin-right: 20rpx;
         margin-bottom: 20rpx;
      }
   }
  ::v-deep .u-radio-group {
    margin-top: 20rpx;
    flex-wrap: wrap;
   .hei {
      color: #202D44;
   }
    .u-radio {
      margin-right: 20rpx;
      margin-bottom: 20rpx;
    }
  }
   .bottom {
      position: fixed;
      bottom: 0;
      width: 100%;
      left: 0;
      height: 132rpx;
      background: #fff;
  .hei {
    color: #202D44;
  }
      .one {
         display: flex;
         justify-content: center;
         align-items: center;
         height: 100%;
  .bottom {
    position: fixed;
    bottom: 0;
    width: 100%;
    left: 0;
    height: 132rpx;
    background: #fff;
         .b1 {
            width: 686rpx;
            height: 88rpx;
            border-radius: 10px;
            background: #F7F7F7;
            line-height: 88rpx;
            text-align: center;
         }
      }
    .one {
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100%;
      .two {
         display: flex;
         justify-content: center;
         align-items: center;
         height: 100%;
      .b1 {
        width: 686rpx;
        height: 88rpx;
        border-radius: 10px;
        background: #F7F7F7;
        line-height: 88rpx;
        text-align: center;
      }
    }
         .b2 {
            width: 146rpx;
            height: 88rpx;
            border-radius: 10px;
            background: #F7F7F7;
            line-height: 88rpx;
            text-align: center;
            margin-right: 18rpx;
         }
    .two {
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100%;
         .b3 {
            width: 524rpx;
            height: 88rpx;
            border-radius: 10px;
            background: #1171E0;
            line-height: 88rpx;
            text-align: center;
            color: #fff;
         }
      }
   }
      .b2 {
        width: 146rpx;
        height: 88rpx;
        border-radius: 10px;
        background: #F7F7F7;
        line-height: 88rpx;
        text-align: center;
        margin-right: 18rpx;
      }
   .page-box {
      padding: 24rpx 0;
      .font{
         color: #4a4e60;
         font-size: 32rpx;
         margin-top: 20rpx;
      }
      .title1 {
         font-size: 36rpx;
         font-weight: 700;
         padding: 0 32rpx;
         border-bottom: 2rpx solid #F4F4F4;
         padding-bottom: 24rpx;
      }
      .b3 {
        width: 524rpx;
        height: 88rpx;
        border-radius: 10px;
        background: #1171E0;
        line-height: 88rpx;
        text-align: center;
        color: #fff;
      }
    }
  }
      .padding {
         padding: 0 24rpx;
      }
  .page-box {
    padding: 24rpx 0;
      .margin-top {
         margin-top: 20rpx;
      }
    .font {
      color: #4a4e60;
      font-size: 32rpx;
      margin-top: 20rpx;
    }
      .down {
         padding: 34rpx 30rpx 30rpx;
         display: flex;
         justify-content: space-between;
    .title1 {
      font-size: 36rpx;
      font-weight: 700;
      padding: 0 32rpx;
      border-bottom: 2rpx solid #F4F4F4;
      padding-bottom: 24rpx;
    }
         >view {
            display: inline-block;
         }
    .padding {
      padding: 0 24rpx;
    }
         .button {
            padding: 20rpx 40rpx;
            background: #F7F7F7;
            border-radius: 20rpx;
         }
    .margin-top {
      margin-top: 20rpx;
    }
         .enter {
            width: 100%;
            background: #1171E0;
            color: white;
            border-radius: 20rpx;
            padding: 20rpx 40rpx;
            text-align: center;
         }
      }
   }
    .down {
      padding: 34rpx 30rpx 30rpx;
      display: flex;
      justify-content: space-between;
   /deep/ .u-textarea {
      background-color: #F4F4F4;
   }
      >view {
        display: inline-block;
      }
      .button {
        padding: 20rpx 40rpx;
        background: #F7F7F7;
        border-radius: 20rpx;
      }
      .enter {
        width: 100%;
        background: #1171E0;
        color: white;
        border-radius: 20rpx;
        padding: 20rpx 40rpx;
        text-align: center;
      }
    }
  }
  ::v-deep .u-textarea {
    background-color: #F4F4F4;
  }
</style>