wjt
2024-06-27 69a74309ed12cc13f0fa9fb90c5bffad17ade360
policy/policyApply/policyApply.vue
@@ -1,6 +1,95 @@
<template>
   <view class="page-box">
      <u-form label-position="top" label-width="120px">
      <view class="content-box">
         <view class="form">
            <view class="form-item">
               <view class="form-label require">
                  执法主题
               </view>
               <input type="text" placeholder="请输入" v-model.trim="form.enforceReason"/>
            </view>
            <view class="form-item">
               <view class="form-label require">
                  执法对象
               </view>
               <view class="input" @click="search">
                  <input type="text" style="width: 80%;" disabled  placeholder="请输入" :value="form.companyName"/>
                  <u-icon name="arrow-right"></u-icon>
                  <!-- <u-text text='搜索' type="primary" style="width: 20%;" @click="search"></u-text> -->
               </view>
            </view>
            <view class="form-item">
               <view class="form-label require">
                  执法时间
               </view>
               <view class="input" @click="showTimeFun">
                  <input type="text" placeholder="请输入" disabled v-model.trim="form.planTimeStr"/>
                  <u-icon name="arrow-right"></u-icon>
               </view>
            </view>
            <view class="form-item" @click="showType = true">
               <view class="form-label require">
                  执法类型
               </view>
               <view class="input">
                  <input type="text" placeholder="请输入" v-model.trim="form.enforceTypeName" disabled/>
                  <u-icon name="arrow-right"></u-icon>
               </view>
            </view>
            <view class="form-item last">
               <view class="form-label require">
                  执法内容
               </view>
               <view class="back">
                  <u--textarea :height="120" v-model.trim="form.enforceContent" placeholder="请输入" count maxlength="500"></u--textarea>
               </view>
            </view>
         </view>
      </view>
      <view class="content-box">
         <view class="form ">
            <view class="form-item">
               <view class="form-label">
                  执法人员
               </view>
               <input type="text" placeholder="请输入" v-model.trim="form.applyUser" disabled/>
            </view>
            <view class="form-item">
               <view class="form-label">
                  执法部门
               </view>
               <!-- <input type="text" placeholder="请输入" v-model.trim="form.applyDeptName" disabled/> -->
               <view style="width: 60%;">{{form.applyDeptName}}</view>
            </view>
            <view class="form-item sui" style="align-items: flex-start;" @click="openPer">
               <view class="form-label require ">
                  随行人员
               </view>
               <view>
                  <view style="color: #a2a2a2;" class="placeholder" v-if="!form.peers.length">请选择</view>
                  <view v-else>
                     <view style="margin-bottom: 20rpx;" v-for="(item,index) in form.peers"  :key="index">
                        {{item.peerUser}}({{item.peerDeptName}})
                     </view>
                  </view>
               </view>
               <!-- <u-textarea  border="none" disabled style="padding: 0;" placeholder="请选择" ></u-textarea> -->
            </view>
            <view class="form-item down-2">
               <view class="form-label">
                  是否通知企业
               </view>
               <u-switch v-model="form.isNoticeCompany" :activeValue="1" :inactiveValue="0"></u-switch>
            </view>
         </view>
      </view>
      <view class="down-options">
         <view class="button record" @click="applyRecord">申请记录</view>
         <view class="button submit" @click="submitApply">提交申请</view>
      </view>
      <!-- <u-form label-position="top" label-width="120px">
         <u-form-item label="执法主题">
            <u-input placeholder="请输入" v-model="form.enforceReason"></u-input>
         </u-form-item>
@@ -32,65 +121,99 @@
         <u-form-item label="是否通知企业">
            <u-switch v-model="form.isNoticeCompany" :activeValue="1" :inactiveValue="0"></u-switch>
         </u-form-item>
      </u-form>
      <u-button @click="submitApply">提交申请</u-button>
      <u-button @click="applyRecord">申请记录</u-button>
      <u-picker :show="show" @close="show = false" @confirm="confirmSearch" @cancel="show = false" :columns="columns" keyName="companyName"></u-picker>
      <u-datetime-picker
               :show="showTime"
               @close="showTime = false"
               @cancel="showTime = false"
               v-model="currentTime"
               @confirm="confirmTime"
               :minDate="minDate"
               mode="dateTime"
               ref="datetimePicker"
               class="hide-clear-button"
         ></u-datetime-picker>
         <u-picker :show="showType" @close="showType = false" @confirm="confirmType" @cancel="showType = false" :columns="columnsType" keyName="dictLabel"></u-picker>
      </u-form> -->
<!--       <u-button @click="submitApply">提交申请</u-button>
      <u-button @click="applyRecord">申请记录</u-button> -->
      <!-- <u-picker :show="show"   @close="show = false" :immediateChange="true" @confirm="confirmSearch" @cancel="show = false" :columns="columns" keyName="companyName">
         
      </u-picker> -->
      <perPicker ref="perPicker" :immediateChange="true" @confirm="confirmSearch" @cancel="show = false" :columns="columns" keyName="companyName"></perPicker>
          <yt-dateTimePicker
               ref="myPicker"
               @submit="confirmTime"
               :time-init="timeInit"
              :start-year="year"
              :startMonth="month"
               :time-hide="[true, true, true, true, false, false]"
             />
         <u-picker :show="showType" @close="showType = false" @confirm="confirmType" @cancel="showType = false" :columns="columnsType" keyName="dictLabel"></u-picker>
         <perPage :list="list" ref="perpage" @selectValue="selectValue"></perPage>
   </view>
</template>
<script>
   import { orderAdd, companyList } from '@/api/policy.js'
   import { orderAdd, companyList, enforceList } from '@/api/policy.js'
   import { getInfo } from '@/api/auth.js'
   import { getDicts } from '@/api/data'
   import perPage from './perPage'
   import perPicker from './perPicker'
   import YtDateTimePicker from "uni_modules/yt-dateTimePicker/components/yt-dateTimePicker/yt-dateTimePicker.vue"
   export default {
      components: {
         YtDateTimePicker,
         perPage,
         perPicker
      },
      data() {
         return {
            currentTime: "",
            form: {
               executeTime: "",
               applyName: '',
               applyUser: '',
               applyDeptName: '',
               enforceType: 1,
               isNoticeCompany: 0
               isNoticeCompany: 0,
               // regionReason: 0,
               planTimeStr: '',
               peers: [],
               orderStatus: 1,
               enforceContent: "",
               companyName: ""
            },
            show: false,
            columns: [],
            showTime: false,
            columnsType: [],
            showType: false,
            minDate: ''
            minDate: '',
            year: '',
            endYear: '',
            timeInit: '',
            list: [],
            startTime: "",
            month: ''
         }
      },
      onLoad() {
         this.currentTime = this.$u.timeFormat(new Date(), 'yyyy-mm-dd hh:MM:ss')
         this.year = new Date().getFullYear()
         this.month = new Date().getMonth() + 1
         this.endYear = this.year + 5
         this.minDate = new Date().valueOf()
         this.timeInit = this.$u.timeFormat(new Date(), 'yyyy-mm-dd hh:MM')
         this.startTime =this.$u.timeFormat(new Date(), 'yyyy-mm-dd hh:MM')
         this.getInfo()
         this.getDicts()
         this.enforceList()
      },
      onShow() {
      },
      methods: {
         enforceList() {
            enforceList().then(val => {
               this.list = val.data.data
            })
         },
         getDicts() {
            getDicts('enforce_type').then(val =>{
               console.log(val.data.data)
               this.columnsType = [val.data.data]
            })
         },
         getInfo() {
            getInfo().then(val => {
               const value = val.data.data
               this.form.applyName = value.nickName
               // this.form.applyName = value.nickName
               this.form.applyUser = value.nickName
               this.form.applyId = value.userId
               this.form.applyDeptName = value.dept.deptName
               this.form.applyDeptId = value.dept.deptId
@@ -111,51 +234,95 @@
            }
            return options;
         },
         authFile() {
            if(!this.form.enforceReason || !this.form.enforceReason.replace(/\s+/g, "")){
               return '请填写主题'
            }
            if(!this.form.companyName || !this.form.companyName.replace(/\s+/g, "")){
               return '请选择执法对象'
            }
            if(!this.form.companyId) {
               return '请点击搜索确认执法对象'
            }
            if(!this.form.planTimeStr) {
               return '请填写执法时间'
            }
            if(!this.form.enforceTypeName){
               return '请选择执法类型'
            }
            console.log(!this.form.enforceContent.replace(/\s+/g, ""))
            if(!this.form.enforceContent || !this.form.enforceContent.replace(/\s+/g, "")) {
               return '请填写执法内容'
            }
            if(!this.form.peers.length){
               return '请选择随行人员'
            }
            return ''
         },
         submitApply(){
            const res =   this.authFile()
            if(res){
               uni.showToast({
                  title: res,
                  icon: 'none'
               })
               return
            }
            orderAdd(this.form).then(val => {
               if(val.data.code == 200) {
                  uni.navigateBack()
                  uni.showToast({
                     title: '提交成功',
                     icon: 'none'
                  })
                  setTimeout(() => {
                     uni.navigateBack()
                  }, 500)
               }
            })
         },
         applyRecord() {
         },
         search() {
            companyList({companyName: this.form.companyName}).then(val => {
               if(val.data.code == 200){
                  if(!val.data.rows.length || !val.data.rows){
                     uni.showToast({
                        title: '没有符合的数据,请检查输入的执法对象',
                        icon: 'none',
                        duration: 3000
                     })
                  } else {
                     this.columns = [val.data.rows]
                     this.show = true
                  }
               }
            uni.navigateTo({
               url:`/policy/applyRecord/applyRecord`
            })
         },
         search() {
            // companyList({companyName: this.form.companyName}).then(val => {
            //    if(val.data.code == 200){
            //       if(!val.data.rows.length || !val.data.rows){
            //          uni.showToast({
            //             title: '没有符合的数据,请检查输入的执法对象',
            //             icon: 'none',
            //             duration: 3000
            //          })
            //       } else {
            //       }
            //    }
            // })
            this.$refs.perPicker.open()
         },
         confirmSearch(e){
            const value =   this.columns[0].find(item => item.companyName == e.value[0].companyName)
            this.form.companyName = e.value[0].companyName
            let value = e
            // const value =   this.columns[0].find(item => item.companyName == e.value[0].companyName)
            this.form.companyName = e.companyName
            this.form.companyCode = value.companyCode
            this.form.companyId    = value.companyId   
            this.form.companyPhone = value.companyPhone
            this.form.companyUser = value.companyUser
            this.form.companyAddress = value.companyAddress
            this.show = false
            console.log(this.form.companyName)
         },
         confirmTime(e) {
            // console.log(e.value)
            this.form.applyTime = e.value
            this.showTime = false
            this.form.planTime = e.year + '-' + e.month+ '-' + + e.day + ' ' + e.hour + ":" + "00:00"
            this.form.planTimeStr = e.year + '-' + e.month+ '-' + + e.day + ' ' + e.hour + ":" + "00"
            this.timeInit = this.$u.timeFormat(new Date(this.form.planTimeStr), 'yyyy-mm-dd hh:MM')
         },
         showTimeFun() {
            this.showTime = true
            // this.showTime = true
                     this.$refs.myPicker.show();
         },
         sheet(){
            
@@ -164,16 +331,130 @@
            this.form.enforceType = e.value[0].dictCode
            this.form.enforceTypeName = e.value[0].dictLabel
            this.showType = false
         },
         changeValue(e, e1) {
            this.currentTime = e.value
         },
         openPer() {
            this.$refs.perpage.open(this.list)
         },
         selectValue(value) {
            this.form.peers = value
         }
      }
   }
</script>
<style>
   page{
      background-color: #F4F4F4;
   }
   .sui  .u-textarea{
      padding: 0 !important;
   }
</style>
<style scoped lang="scss">
.page-box{
   padding:0 30rpx;
   padding-bottom: 140rpx;
   .content-box{
      margin:20rpx 32rpx;
      background-color: white;
      padding: 24rpx;
      border-radius: 10rpx;
   }
   .form{
      .form-item{
         display: flex;
         justify-content: flex-start;
         align-items: center;
         border-bottom: 2rpx solid #F1F1F1;
         padding-bottom: 26rpx;
         margin-bottom: 24rpx;
         .form-label{
            font-size: 30rpx;
            color: #4A4E60;
            width: 40%;
         }
         .input{
            width: 60%;
            display: flex;
            justify-content: space-between;
            align-items: center;
         }
         .require{
            &::after{
               content: '*';
               color: #FF7500;
            }
         }
      }
      .down-2{
         margin-bottom: 0;
         padding-bottom: 0;
         border: none;
      }
      .last{
         margin-bottom: 0;
         padding-bottom: 0;
         border-bottom: none;
         display: block;
         .form-label{
            margin-bottom: 16rpx;
         }
         .back{
            /deep/ .u-textarea{
               background-color: #F4F4F4;
               border: none;
               .u-textarea__count{
                  background: none !important;
               }
            }
         }
      }
   }
}
/deep/ .u-picker__view{
.down-options{
   background-color: white;
   position: fixed;
   bottom: 0;
   padding-bottom: 40rpx;
   width: 100%;
   padding: 22rpx 30rpx 40rpx;
   z-index: 800;
   display: flex;
   justify-content: space-between;
   align-items: center;
   box-sizing: border-box;
   .record{
      box-sizing: border-box;
      border-radius: 20rpx;
      border: 2rpx solid #ABD2FF;
      background: #F0F8FF;
      color: #1171E0;
      font-size: 32rpx;
      padding: 20rpx 30rpx;
      width: 30%;
      text-align: center;
   }
   .submit{
      border-radius: 20rpx;
      border: 2rpx solid #1171E0;
      background-color: #1171E0;
      color: white;
      width: 65%;
      box-sizing: border-box;
      padding: 20rpx 30rpx;
      text-align: center;
   }
}
.sui{
}
/deep/  .u-checkbox-label--right >  text{
      line-height: 54rpx !important;
      margin-right: 15rpx;
}
</style>