Opinion
This commit is contained in:
		
							
								
								
									
										388
									
								
								src/apps/AppWorkonline/Opinion.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										388
									
								
								src/apps/AppWorkonline/Opinion.vue
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,388 @@
 | 
			
		||||
<template>
 | 
			
		||||
  <div class="approvalopinion">
 | 
			
		||||
    <div class="nobtn">
 | 
			
		||||
      <div class="approvalopinion_text">
 | 
			
		||||
        <!-- 拒绝时写固定的意见 -->
 | 
			
		||||
        <div class="list" v-if="type == 0">
 | 
			
		||||
          <div class="textarea_msgfont">
 | 
			
		||||
            <span class="msgfont">
 | 
			
		||||
              <span class="icon">*</span>
 | 
			
		||||
              <span> 审批意见:</span>
 | 
			
		||||
            </span>
 | 
			
		||||
            <textarea :maxlength="150" placeholder="请输入审批意见" v-model="opinion" class="textarea" clearable="false"> </textarea>
 | 
			
		||||
            <div class="clearns" @click="clearn">清空内容</div>
 | 
			
		||||
            <div class="msg_length">
 | 
			
		||||
              <span class="font">{{ opinion.length }}</span>
 | 
			
		||||
              <span>/150</span>
 | 
			
		||||
            </div>
 | 
			
		||||
          </div>
 | 
			
		||||
        </div>
 | 
			
		||||
 | 
			
		||||
        <!-- 同意意见 -->
 | 
			
		||||
        <div v-if="type == 1">
 | 
			
		||||
          <div class="list" v-for="(item, index) in list" :key="index">
 | 
			
		||||
            <div class="textarea_msgfont" v-if="item.fieldDataType == 1">
 | 
			
		||||
              <span class="msgfont">
 | 
			
		||||
                <span class="icon" v-if="item.mustFill == 1">*</span>
 | 
			
		||||
                <span> {{ item.fieldName }}:</span>
 | 
			
		||||
              </span>
 | 
			
		||||
              <textarea :maxlength="150" placeholder="请输入审批意见" v-model="item.fieldValue" class="textarea" clearable="false"> </textarea>
 | 
			
		||||
              <div class="clearns" @click="clearn">清空内容</div>
 | 
			
		||||
              <div class="msg_length">
 | 
			
		||||
                <span class="font">{{ item.fieldValue.length }}</span>
 | 
			
		||||
                <span>/{{ item.fieldLength }}</span>
 | 
			
		||||
              </div>
 | 
			
		||||
            </div>
 | 
			
		||||
 | 
			
		||||
            <!-- 入户调查时间 -->
 | 
			
		||||
            <!-- v-if="item.fieldType == 3 && item.fieldDataType == 8" .-->
 | 
			
		||||
            <div class="calendar" v-if="item.fieldDataType == 8">
 | 
			
		||||
              <div class="left">
 | 
			
		||||
                <span class="icon" v-if="item.mustFill == 1">*</span>
 | 
			
		||||
                <span> {{ item.fieldName }}:</span>
 | 
			
		||||
              </div>
 | 
			
		||||
              <div class="left">
 | 
			
		||||
                <u-input type="text" @click="timeSelect(index)" class="right" placeholder="请选择" disabled v-model="item.fieldValue"></u-input>
 | 
			
		||||
              </div>
 | 
			
		||||
            </div>
 | 
			
		||||
          </div>
 | 
			
		||||
        </div>
 | 
			
		||||
      </div>
 | 
			
		||||
 | 
			
		||||
      <!-- 附件资料 -->
 | 
			
		||||
      <div class="reply_files">
 | 
			
		||||
        <text class="img">附件资料</text>
 | 
			
		||||
        <text class="img_text">(最多支持9个附件)</text>
 | 
			
		||||
        <!-- 单个文件最大10MB.zip、.rar、.doc、.docx、.xls、.xlsx、.ppt、.pptx、.pdf、.txt、.jpg、.png格式 -->
 | 
			
		||||
        <div class="upload">
 | 
			
		||||
          <div class="info">
 | 
			
		||||
            <ai-uploader multiple @list="(v) => (annex = v)" :limit="9" action="/admin/file/add2" type="file" placeholder="添加文件" preview />
 | 
			
		||||
          </div>
 | 
			
		||||
        </div>
 | 
			
		||||
      </div>
 | 
			
		||||
 | 
			
		||||
      <!-- 图片资料 -->
 | 
			
		||||
      <div class="reply_img">
 | 
			
		||||
        <text class="img">图片资料</text>
 | 
			
		||||
        <text class="img_text">(最多9张)</text>
 | 
			
		||||
        <div class="upload">
 | 
			
		||||
          <div class="info">
 | 
			
		||||
            <ai-uploader multiple @list="(v) => (picture = v)" :limit="9" :size="2097152" preview />
 | 
			
		||||
          </div>
 | 
			
		||||
        </div>
 | 
			
		||||
      </div>
 | 
			
		||||
    </div>
 | 
			
		||||
 | 
			
		||||
    <div class="btn" @click="btn">确定</div>
 | 
			
		||||
 | 
			
		||||
    <!-- 日期选择器 -->
 | 
			
		||||
    <u-calendar v-model="show" :mode="mode" @change="calendar" />
 | 
			
		||||
    <AiBack />
 | 
			
		||||
  </div>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
import AiBack from '../../components/AiBack'
 | 
			
		||||
import AiUploader from '../../components/AiUploader.vue'
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
  name: 'Opinion',
 | 
			
		||||
  components: {
 | 
			
		||||
    AiBack,
 | 
			
		||||
    AiUploader,
 | 
			
		||||
  },
 | 
			
		||||
  props: {},
 | 
			
		||||
  data() {
 | 
			
		||||
    return {
 | 
			
		||||
      mode: 'date',
 | 
			
		||||
      show: false,
 | 
			
		||||
      list: [],
 | 
			
		||||
      type: '',
 | 
			
		||||
      picture: [],
 | 
			
		||||
      pass: false,
 | 
			
		||||
      annex: [],
 | 
			
		||||
      stepList: '',
 | 
			
		||||
      filedIndex: 0,
 | 
			
		||||
      fileNameList: [],
 | 
			
		||||
      opinion: '',
 | 
			
		||||
    }
 | 
			
		||||
  },
 | 
			
		||||
  onLoad(options) {
 | 
			
		||||
    this.objid = options.id
 | 
			
		||||
    this.type = options.type
 | 
			
		||||
 | 
			
		||||
    this.getList()
 | 
			
		||||
  },
 | 
			
		||||
  computed: {},
 | 
			
		||||
  watch: {},
 | 
			
		||||
  onShow() {},
 | 
			
		||||
  mounted() {},
 | 
			
		||||
  methods: {
 | 
			
		||||
    getList() {
 | 
			
		||||
      this.$http
 | 
			
		||||
        .post(`/app/approv-alapply-info/approval-popup?type=${this.type}&id=${this.objid}`)
 | 
			
		||||
        .then((res) => {
 | 
			
		||||
          if (res.code == 0) {
 | 
			
		||||
            res.data.fieldInfos.map((item) => {
 | 
			
		||||
              if (item.fieldDataType == 1) {
 | 
			
		||||
                item.fieldValue = ''
 | 
			
		||||
              }
 | 
			
		||||
 | 
			
		||||
              if (item.fieldType == 3) {
 | 
			
		||||
                this.list.push(item)
 | 
			
		||||
              }
 | 
			
		||||
            })
 | 
			
		||||
          }
 | 
			
		||||
        })
 | 
			
		||||
        .catch(() => {
 | 
			
		||||
          // this.$u.toast(err)
 | 
			
		||||
        })
 | 
			
		||||
    },
 | 
			
		||||
 | 
			
		||||
    timeSelect(index) {
 | 
			
		||||
      this.filedIndex = index
 | 
			
		||||
      this.show = true
 | 
			
		||||
    },
 | 
			
		||||
 | 
			
		||||
    clearn() {
 | 
			
		||||
      this.opinion = ''
 | 
			
		||||
      this.list.map((item) => {
 | 
			
		||||
        if (item.mustFill == 1 && item.fieldValue) {
 | 
			
		||||
          item.fieldValue = ''
 | 
			
		||||
        }
 | 
			
		||||
      })
 | 
			
		||||
    },
 | 
			
		||||
 | 
			
		||||
    btn() {
 | 
			
		||||
      if (this.type == 0 && this.opinion == '') {
 | 
			
		||||
        return uni.showToast({
 | 
			
		||||
          title: '请输入审批意见',
 | 
			
		||||
          icon: 'none',
 | 
			
		||||
        })
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
      if (
 | 
			
		||||
        this.list.some((item) => {
 | 
			
		||||
          if (item.mustFill == 1 && !item.fieldValue) {
 | 
			
		||||
            uni.showToast({
 | 
			
		||||
              title: item.fieldName + '为必填',
 | 
			
		||||
              icon: 'none',
 | 
			
		||||
            })
 | 
			
		||||
            return true
 | 
			
		||||
          }
 | 
			
		||||
        })
 | 
			
		||||
      )
 | 
			
		||||
        return
 | 
			
		||||
 | 
			
		||||
      var file = []
 | 
			
		||||
      this.annex.map((item) => {
 | 
			
		||||
        file.push(item.id)
 | 
			
		||||
      })
 | 
			
		||||
 | 
			
		||||
      var img = []
 | 
			
		||||
      this.picture.map((item) => {
 | 
			
		||||
        img.push(item.id)
 | 
			
		||||
      })
 | 
			
		||||
      var params = {
 | 
			
		||||
        id: this.objid,
 | 
			
		||||
        picture: img.join(','),
 | 
			
		||||
        pass: this.type == 1,
 | 
			
		||||
        annex: file.join(','),
 | 
			
		||||
        fieldInfos: this.list,
 | 
			
		||||
        opinion: this.opinion,
 | 
			
		||||
      }
 | 
			
		||||
      uni.showLoading({
 | 
			
		||||
        title: '加载中',
 | 
			
		||||
      })
 | 
			
		||||
 | 
			
		||||
      this.$http
 | 
			
		||||
        .post(`/app/approv-alapply-info/approval`, params)
 | 
			
		||||
        .then((res) => {
 | 
			
		||||
          if (res.code == 0) {
 | 
			
		||||
            uni.navigateTo({
 | 
			
		||||
              url: `./Msg?flag=1`,
 | 
			
		||||
            })
 | 
			
		||||
            // this.getList()
 | 
			
		||||
          }
 | 
			
		||||
        })
 | 
			
		||||
        .catch((e) => {
 | 
			
		||||
          uni.navigateTo({
 | 
			
		||||
            url: `./Msg?flag=0`,
 | 
			
		||||
          })
 | 
			
		||||
          uni.showToast({
 | 
			
		||||
            title: e,
 | 
			
		||||
            icon: 'none',
 | 
			
		||||
          })
 | 
			
		||||
          // this.getList()
 | 
			
		||||
        })
 | 
			
		||||
    },
 | 
			
		||||
 | 
			
		||||
    data(e) {
 | 
			
		||||
      this.files.push(e)
 | 
			
		||||
    },
 | 
			
		||||
 | 
			
		||||
    change(e) {
 | 
			
		||||
      this.files = e
 | 
			
		||||
    },
 | 
			
		||||
 | 
			
		||||
    calendar(e) {
 | 
			
		||||
      this.list[this.filedIndex].fieldValue = e.result
 | 
			
		||||
    },
 | 
			
		||||
  },
 | 
			
		||||
}
 | 
			
		||||
</script>
 | 
			
		||||
 | 
			
		||||
<style scoped lang="scss">
 | 
			
		||||
.approvalopinion {
 | 
			
		||||
  height: 100%;
 | 
			
		||||
 | 
			
		||||
  .nobtn {
 | 
			
		||||
    padding: 0 0 112px 0;
 | 
			
		||||
 | 
			
		||||
    .approvalopinion_text {
 | 
			
		||||
      .list {
 | 
			
		||||
        .textarea_msgfont {
 | 
			
		||||
          position: relative;
 | 
			
		||||
          height: 400px;
 | 
			
		||||
          padding: 32px;
 | 
			
		||||
          background-color: #fff;
 | 
			
		||||
 | 
			
		||||
          .msgfont {
 | 
			
		||||
            font-size: 32px;
 | 
			
		||||
 | 
			
		||||
            .icon {
 | 
			
		||||
              margin-right: 8px;
 | 
			
		||||
              color: #ff4466;
 | 
			
		||||
            }
 | 
			
		||||
          }
 | 
			
		||||
 | 
			
		||||
          .textarea {
 | 
			
		||||
            margin-top: 10px;
 | 
			
		||||
          }
 | 
			
		||||
 | 
			
		||||
          .clearns {
 | 
			
		||||
            color: #1365dd;
 | 
			
		||||
          }
 | 
			
		||||
 | 
			
		||||
          .msg_length {
 | 
			
		||||
            position: absolute;
 | 
			
		||||
            bottom: 42px;
 | 
			
		||||
            right: 32px;
 | 
			
		||||
 | 
			
		||||
            .font {
 | 
			
		||||
              color: #999;
 | 
			
		||||
            }
 | 
			
		||||
          }
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        .calendar {
 | 
			
		||||
          display: flex;
 | 
			
		||||
          justify-content: space-between;
 | 
			
		||||
          align-items: center;
 | 
			
		||||
          margin-top: 20px;
 | 
			
		||||
          background-color: #fff;
 | 
			
		||||
          padding: 0 32px;
 | 
			
		||||
 | 
			
		||||
          .left {
 | 
			
		||||
            .icon {
 | 
			
		||||
              color: #ff4466;
 | 
			
		||||
              margin-right: 8px;
 | 
			
		||||
            }
 | 
			
		||||
          }
 | 
			
		||||
 | 
			
		||||
          .right {
 | 
			
		||||
            width: 160px;
 | 
			
		||||
          }
 | 
			
		||||
        }
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    .reply_files {
 | 
			
		||||
      margin-top: 20px;
 | 
			
		||||
      background-color: #fff;
 | 
			
		||||
      padding: 0 20px 0;
 | 
			
		||||
 | 
			
		||||
      .img {
 | 
			
		||||
        display: inline-block;
 | 
			
		||||
        margin-top: 20px;
 | 
			
		||||
        font-size: 32px;
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
      .img_text {
 | 
			
		||||
        font-size: 32px;
 | 
			
		||||
        color: #999;
 | 
			
		||||
        margin-left: 10px;
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
      .upload {
 | 
			
		||||
        width: 100%;
 | 
			
		||||
        margin-top: 10px;
 | 
			
		||||
        padding: 12px 12px 12px 0;
 | 
			
		||||
        box-sizing: border-box;
 | 
			
		||||
 | 
			
		||||
        .info {
 | 
			
		||||
          width: 100%;
 | 
			
		||||
          text-align: center;
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        ::v-deep .info > span {
 | 
			
		||||
          width: 380px;
 | 
			
		||||
          text-align: left;
 | 
			
		||||
          //  word-break: break-all;
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        ::v-deep .ai-uploader .fileList .default {
 | 
			
		||||
          max-width: 160px;
 | 
			
		||||
          max-height: 160px;
 | 
			
		||||
        }
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    .reply_img {
 | 
			
		||||
      margin-top: 20px;
 | 
			
		||||
      background-color: #fff;
 | 
			
		||||
      padding: 0 20px;
 | 
			
		||||
      box-sizing: border-box;
 | 
			
		||||
 | 
			
		||||
      .img {
 | 
			
		||||
        display: inline-block;
 | 
			
		||||
        margin-top: 20px;
 | 
			
		||||
        font-size: 32px;
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
      .img_text {
 | 
			
		||||
        font-size: 32px;
 | 
			
		||||
        color: #999;
 | 
			
		||||
        margin-left: 10px;
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
      .upload {
 | 
			
		||||
        width: 100%;
 | 
			
		||||
        margin-top: 10px;
 | 
			
		||||
        padding: 12px 12px 12px 0;
 | 
			
		||||
        box-sizing: border-box;
 | 
			
		||||
 | 
			
		||||
        .info {
 | 
			
		||||
          width: 100%;
 | 
			
		||||
          text-align: center;
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        ::v-deep .ai-uploader .fileList .default {
 | 
			
		||||
          width: 160px;
 | 
			
		||||
          height: 160px;
 | 
			
		||||
        }
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  .btn {
 | 
			
		||||
    position: fixed;
 | 
			
		||||
    bottom: 0;
 | 
			
		||||
    line-height: 112px;
 | 
			
		||||
    width: 100%;
 | 
			
		||||
    background-color: #1355dd;
 | 
			
		||||
    color: #fff;
 | 
			
		||||
    text-align: center;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
		Reference in New Issue
	
	Block a user