product_wx/pages/subPackages/economicDevelopmentReport/detail.vue

<template>
  <div class="addEnterprise" >
    <div class="addEnterpriseTit">
      <div>尊敬的<span style="color:#1D18BC "> {{ qyName }} </span>企业用户，你好！</div>
      <div class="line"></div>
      <div>为了更好地为企业提供相关服务，请协助完成相关数据的填报，感谢配合！</div>
    </div>
    <div class="addEnterpriseBody">
      <ul>
        <li class="bodyLi">
          <div class="bodyLiTit">任务编号：</div>
          <input type="text" readonly v-model="infoFrom.temName" placeholder="">
        </li>
        <li class="bodyLi">
          <div class="bodyLiTit">所属时间：</div>
          <input type="text" readonly v-model="infoFrom.temYearTypeCount" placeholder="">
        </li>
        <li class="bodyLi">
          <div class="bodyLiTit">要求完成日期：</div>
          <!-- @click="dateShow=true" -->
          <input
              type="text"
              placeholder="请选择"
              v-model="infoFrom.requireFinishTime"
              readonly

          />
        </li>
        <li class="bodyLi">
          <div class="bodyLiTit">上报日期：</div>
          <input type="text" v-model="infoFrom.fillTime" placeholder="自动生成" readonly>
        </li>
<!--        <li class="bodyLi">-->
<!--          <div class="bodyLiTit">填写说明：</div>-->
<!--          <input type="text" placeholder="" v-model="infoFrom.remark" readonly/>-->
<!--        </li>-->
        <li class="bodyLi" :key="item" v-for="(item, index) in optionList">
          <div class="bodyLiTit" style="font-size: 3.5vw"><span style="color: red">*</span> {{ item }}：</div>
          <input type="text" v-model="contentList[index]" placeholder="请填写"  style="width: 30vw">
        </li>
      </ul>
    </div>
    <div class="buttonBox">
      <button @click="commit('2')">保存</button>
      <button @click="commit('0')">提交</button>
    </div>
  </div>
</template>

<script>
import { getUserLocalStorageInfo,getByStag,fillControllerEditSave } from "@/js_sdk/http.js";
export default {
  name: "detail",
  data(){
    return{
      qyName:getUserLocalStorageInfo().username,
      contentList:[],
      optionList:[],
      infoFrom:{}
    }
  },
  onLoad(item) {
    getByStag({id:item.id}).then(res => {
      if (res.data) {
        this.infoFrom = res.data
        this.$set(this.infoFrom, 'fillTime', this.$common.formatDate('yyyy-MM-dd hh:mm:ss', new Date()))
        if (res.data.temYear && res.data.temYearType) { this.$set(this.infoFrom, 'temYearTypeCount', res.data.temYear + '年' + (res.data.temYearType == '1' ? '半年累计' : '全年累计')) }
        if (res.data.options) { this.optionList = res.data.options.split(',') }
        if (res.data.content) {
          const newArray = res.data.content.split(',')
          this.contentList = newArray.map(item => item === '-' ? '' : item)
        }
      }
    })
  },
  methods:{
    commit(e) {
      if (!this.infoFrom.id) {
        uni.showToast({
          title: '您暂时没有需要提交的信息',
          icon: 'none',
          mask: true,
          duration: 1000
        });
        return false
      }
      let flag = false
      const optios = []
      for (let i = 0; i < this.optionList.length; i++) {
        if (!this.contentList[i]) { flag = true }
        const item = {
          name: this.optionList[i],
          value: this.contentList[i]
        }
        optios.push(item)
      }
      if (flag) {
        uni.showToast({
          title: '请先完成必填项的填写!',
          icon: 'none',
          mask: true,
          duration: 1000
        });
        return false
      }
      const reqData = {
        id: this.infoFrom.id,
        userId: getUserLocalStorageInfo.userId,
        saveType: e,
        optionList: optios
      }
      const enObj = JSON.stringify(reqData)
      fillControllerEditSave(enObj).then(res => {
        if (e === '2') {
          uni.showToast({
            title: '保存成功!',
            icon: 'none',
            mask: true,
            duration: 1000
          });
        } else {
          uni.showToast({
            title: '提交成功!',
            icon: 'none',
            mask: true,
            duration: 1000
          });
        }
      })
    },
  }
}
</script>

<style lang="scss">
.addEnterprise{
  .addEnterpriseTit{
    padding: 4vw 3vw;
    background: white;
    margin: 3vw;
    border-radius: 5px;
    color: #333333;
    font-size: 3.8vw;
    .line{
      margin: 2vw 0;
    }
  }
  .addEnterpriseBody{
    background: white;
    padding: 1vw 3vw 5vw 3vw;
    border-radius: 5px;
    margin: 0 3vw;
    .bodyLi{
      display: flex;
      align-items: center;
      border-bottom: 3px solid #CCCCCC;
      padding: 5vw 0;
      width: 100%;
      font-size: 3.8vw;
      .bodyLiTit{
        width: 50vw;
        white-space: nowrap;
      }
    }
    .lastLi{
      border-bottom: none !important;
      padding-bottom: 2vw;
    }
  }
  .buttonBox{
    display: flex;
    margin-top:10vw;
    justify-content: space-evenly;
    button{
      background: #1D18BC;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 40vw;
      height: 13vw;
      color: #FFFFFF;
      border-radius: 10px;
    }
  }
}

</style>