获取验证码功能

yaolonglong

3 天以前 b5f084460e9e639358fbf91056a86be8d0a5c4b2

 qiye/record/details.vue

@@ -1,310 +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">

            已评价

         </view>

         <view class="wbox">

            <view class="item">

               <view class="k">

                  执法类型

               </view>

               <view class="v">

                  司法检查

               </view>

            </view>

            <view class="item">

               <view class="k">

                  执法人

               </view>

               <view class="v">

                  刘欢欢

               </view>

            </view>

            <view class="item">

               <view class="k">

                  执法部门

               </view>

               <view class="v">

                  农业局

               </view>

            </view>

            <view class="item">

  <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">

               <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">

                  汉庭酒店司法检查233号文件

               </view>

            </view>

            <view class="item">

               <view class="k">

                  执法过程

               </view>

            </view>

            <view class="imgbox">

               <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;">

                  停业整顿

               </view>

            </view>

            <view class="item">

               <view class="k">

                  执法时间

               </view>

               <view class="v">

                  2024-10-10 16:24

               </view>

            </view>

         </view>

         <view style="height: 20rpx;"></view>

         <view class="wbox2">

            <view class="t">

               执法评价

            </view>

            <view class="sbox">

               <view class="t2">

                  本次执法还满意程度

               </view>

               <view class="xbox">

                  <view @click="daxing(1)">

                     <img src="/static/qiye/xing1.png" alt="" />

                     <view>

                        很糟糕

                     </view>

                  </view>

                  <view @click="daxing(2)">

                     <img v-if="xing>=2" src="/static/qiye/xing1.png" alt="" />

                     <img v-else src="/static/qiye/xing2.png" alt="" />

                     <view :class="xing==2?'hei':''">

                        不满意

                     </view>

                  </view>

                  <view @click="daxing(3)">

                     <img v-if="xing>=3" src="/static/qiye/xing1.png" alt="" />

                     <img v-else src="/static/qiye/xing2.png" alt="" />

                     <view :class="xing==3?'hei':''">

                        一般般

                     </view>

                  </view>

                  <view @click="daxing(4)">

                     <img v-if="xing>=4" src="/static/qiye/xing1.png" alt="" />

                     <img v-else src="/static/qiye/xing2.png" alt="" />

                     <view :class="xing==4?'hei':''">

                        满意

                     </view>

                  </view>

                  <view @click="daxing(5)">

                     <img v-if="xing>=5" src="/static/qiye/xing1.png" alt="" />

                     <img v-else src="/static/qiye/xing2.png" alt="" />

                     <view :class="xing==5?'hei':''">

                        非常满意

                     </view>

                  </view>

               </view>

               <view class="line"></view>

            </view>

            <view class="sbox">

               <view class="t2">

                  这是一个单选题的题干？

               </view>

               <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>

            <view class="sbox">

               <view class="t2">

                  对我们的评价

               </view>
               <view class="pjbox">
                  这次执法非常好，非常好，这次执法非常好，非常好这次执法非常好，非常好
               </view>

            </view>

         </view>

      </view>
      <view class="bottom">
			
      </view>

   </view>

               <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 || 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== 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>

   export default {

      data() {

         return {

            xing: 5,
            value: 'orange',
            type:1

         }

      },

      methods: {

         daxing(a) {

            this.xing = a

         },

         imgclick(url) {

            uni.previewImage({

               urls: [url]

            })

         }

      }

   }

  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: 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;

      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;
		
   }

   /deep/ .u-radio-group{
      margin-top: 20rpx;
      .u-radio{
         margin-right: 20rpx;
      }
   }

   .hei {

      color: #202D44;

   }

  .pjbox {

    background: #F4F4F4;

    border-radius: 5px;

    margin: 10rpx 0;

    padding: 24rpx;

    color: #202d44;

    font-size: 32rpx;



  }



  ::v-deep .u-radio-group {

    margin-top: 20rpx;

    flex-wrap: wrap;



    .u-radio {

      margin-right: 20rpx;

      margin-bottom: 20rpx;

    }

  }



  .hei {

    color: #202D44;

  }



  .bottom {

    position: fixed;

    bottom: 0;

    width: 100%;

    left: 0;

    height: 132rpx;

    background: #fff;



    .one {

      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;

      }

    }



    .two {

      display: flex;

      justify-content: center;

      align-items: center;

      height: 100%;



      .b2 {

        width: 146rpx;

        height: 88rpx;

        border-radius: 10px;

        background: #F7F7F7;

        line-height: 88rpx;

        text-align: center;

        margin-right: 18rpx;

      }



      .b3 {

        width: 524rpx;

        height: 88rpx;

        border-radius: 10px;

        background: #1171E0;

        line-height: 88rpx;

        text-align: center;

        color: #fff;

      }

    }

  }



  .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;

    }



    .padding {

      padding: 0 24rpx;

    }



    .margin-top {

      margin-top: 20rpx;

    }



    .down {

      padding: 34rpx 30rpx 30rpx;

      display: flex;

      justify-content: space-between;



      >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>