AnYang_UI/anyangWebAPP/pages/viewWorkOrder/viewWorkOrde...

<template>
  <view class="wrapper">
    <view>
      <uni-segmented-control :current="current" :values="items" @clickItem="onClickItem" styleType="text" activeColor="#4cd964"></uni-segmented-control>
      <view>
        <view v-show="current === 0">
          <view class="detailContent">
            <view class="contentTable">
              <text class="contentTitle">工单编号：</text>
              <text class="contentText">{{ detailContentData.workOrderId }}</text>
            </view>
            <view class="contentTable">
              <text class="contentTitle">状态：</text>
              <text class="contentText">{{ detailContentData.F_WorkState | workStateFilters(detailContentData) }}</text>
            </view>
            <view class="contentTable">
              <text class="contentTitle">受理人：</text>
              <text class="contentText">{{ detailContentData.F_CreateUser | acceptPersonFilters(detailContentData) }}</text>
            </view>
            <view class="contentTable">
              <text class="contentTitle">处理方式：</text>
              <text class="contentText">{{ detailContentData.F_IsResult | dealWithWayFilters }}</text>
            </view>
            <view class="contentTable">
              <text class="contentTitle">录入时间：</text>
              <text class="contentText">{{ detailContentData.F_CreateTime }}</text>
            </view>
            <view class="contentTable">
              <text class="contentTitle">提交时间：</text>
              <text class="contentText">{{ detailContentData.F_SubmitTime }}</text>
            </view>
            <view class="contentTable">
              <text class="contentTitle">办理时间：</text>
              <text class="contentText">{{ detailContentData.F_DealTime }}</text>
            </view>
            <view class="contentTable">
              <text class="contentTitle">结案时间：</text>
              <text class="contentText">{{ detailContentData.F_CloseTime }}</text>
            </view>
            <view class="contentTable">
              <text class="contentTitle">三方通话：</text>
              <text class="contentText">{{ detailContentData.F_Business | threeWayCallFilters }}</text>
            </view>
            <view class="contentTable">
              <text class="contentTitle">反映类型：</text>
              <text class="contentText">{{ detailContentData.TypeName1 }}</text>
            </view>
            <view class="contentTable">
              <text class="contentTitle">紧急程度：</text>
              <text class="contentText">{{ detailContentData.F_Level | levelFilters }}</text>
            </view>
            <view class="contentTable">
              <text class="contentTitle">反映类别：</text>
              <text class="contentText">{{ detailContentData.KeyName }}</text>
            </view>
            <view class="contentTable">
              <text class="contentTitle">密级：</text>
              <text class="contentText">{{ detailContentData.F_IsProtect | isProtectFilters }}</text>
            </view>
            <view class="contentTable">
              <text class="contentTitle">办理单位：</text>
              <text class="contentText">{{ detailContentData.deptname }}</text>
            </view>
            <view class="contentTable">
              <text class="contentTitle">处理结果：</text>
              <text class="contentText">{{ detailContentData.F_Result }}</text>
            </view>
            <view class="contentTable">
              <text class="contentTitle">追加回复：</text>
              <text class="contentText">{{ detailContentData.F_AdditionalReply }}</text>
            </view>
            <view class="contentTable">
              <text class="contentTitle">结案意见：</text>
              <text class="contentText">{{ detailContentData.F_FinalOpinion }}</text>
            </view>
            <view class="contentTable">
              <text class="contentTitle">附件：</text>
              <view class="contentText">
                <show-file :file="File"></show-file>
              </view>
              <!-- <text >{{ detailContentData.SourceName }}</text> -->
            </view>
          </view>
        </view>
        <view v-show="current === 1">
          <view class="detailContent">
            <view class="contentBlock">
              <text class="title">二级办理单位</text>
              <view class="content" v-for="item in twoAssignedInformation" :key="item.F_Id">
                <view class="contentTable">
                  <text class="contentTitle">交办时间：</text>
                  <text class="contentText">{{ item.F_CreateTime }}</text>
                </view>
                <view class="contentTable">
                  <text class="contentTitle">办理时限：</text>
                  <text class="contentText">{{ item.F_LimitTime }}</text>
                </view>
                <view class="contentTable">
                  <text class="contentTitle">承办单位：</text>
                  <text class="contentText">{{ item.DeptName }}</text>
                </view>
                <view class="contentTable">
                  <text class="contentTitle">交办意见：</text>
                  <text class="contentText">{{ item.F_AssignedOpinion }}</text>
                </view>
              </view>
              <yiLine>
                <view></view>
              </yiLine>
            </view>
            <view class="contentBlock">
              <text class="title">三级办理单位</text>
              <view class="content" v-for="item in threeAssignedInformation" :key="item.F_Id">
                <view class="contentTable">
                  <text class="contentTitle">交办时间：</text>
                  <text class="contentText">{{ item.F_CreateTime }}</text>
                </view>
                <view class="contentTable">
                  <text class="contentTitle">办理时限：</text>
                  <text class="contentText">{{ item.F_LimitTime }}</text>
                </view>
                <view class="contentTable">
                  <text class="contentTitle">承办单位：</text>
                  <text class="contentText">{{ item.DeptName }}</text>
                </view>
                <view class="contentTable">
                  <text class="contentTitle">交办意见：</text>
                  <text class="contentText">{{ item.F_AssignedOpinion }}</text>
                </view>
              </view>
              <yiLine>
                <view></view>
              </yiLine>
            </view>
            <view class="contentBlock">
              <text class="title">退回审核</text>
              <view class="content" v-for="item in backAuditList" :key="item.F_Id">
                <view class="contentTable">
                  <text class="contentTitle">申请时间：</text>
                  <text class="contentText">{{ item.F_CreateTime }}</text>
                </view>
                <view class="contentTable">
                  <text class="contentTitle">申请原因：</text>
                  <text class="contentText">{{ item.F_Result }}</text>
                </view>
                <view class="contentTable">
                  <text class="contentTitle">状态：</text>
                  <text class="contentText">{{ item.F_IsAudit |  backauditFilters }}</text>
                </view>
                <view class="contentTable">
                  <text class="contentTitle">审核时间：</text>
                  <text class="contentText">{{ item.F_AuditTime }}</text>
                </view>
                <view class="contentTable">
                  <text class="contentTitle">审核意见：</text>
                  <text class="contentText">{{ item.F_AuditReason }}</text>
                </view>
                <view class="contentTable">
                  <text class="contentTitle">申请单位：</text>
                  <text class="contentText">{{ item.DeptName }}</text>
                </view>
                <view class="contentTable">
                  <text class="contentTitle">附件：</text>
                  <view class="contentText">
                  </view>
                </view>
              </view>
              <yiLine>
                <view></view>
              </yiLine>
            </view>
          </view>
        </view>
        <view v-show="current === 2"></view>
      </view>
    </view>
  </view>
</template>

<script>
import yiLine from "../../components/yi-line/yi-line.vue"
import showFile from "../../components/showFile/index.vue"

export default {
  components: {
    yiLine,
    showFile
  },
  data() {
    return {
      wid: "", // 工单编号
      detailContentData: {}, // 详情内容
      twoAssignedInformation: [], // 二级交办信息
      threeAssignedInformation: [], // 三级交办信息
      backAuditList: [], // 退回审核
      current: 0,
      items: ["工单信息", "交办信息", "市长批示", "工单驳回", "办理情况", "延时审核", "回访信息", "督办信息", "市民催办", "办理过程", "市民评议", "多媒体审核"],
      File: [
        {
          "F_AddTime": "2021-12-08 16:40:34",
          "F_FileId": 86595,
          "F_FileName": "(20211208164033996)588812181.jpg",
          "F_FileType": ".jpg",
          "F_FileUrl": " http://docking.zwfw.anyang.gov.cn:9998/Upload/Files/2021/12/08/(20211208164033996)588812181.jpg",
          "F_Size": 117990,
          "F_UserCode": "10199"
        },
                {
          "F_AddTime": "2021-12-08 16:40:34",
          "F_FileId": 86595,
          "F_FileName": "(20211208164033996)588812181.jpg",
          "F_FileType": ".jpg",
          "F_FileUrl": " http://docking.zwfw.anyang.gov.cn:9998/Upload/Files/2021/12/08/(20211208164033996)588812181.jpg",
          "F_Size": 117990,
          "F_UserCode": "10199"
        },
        {
          "F_AddTime": "2021-12-08 16:40:34",
          "F_FileId": 86595,
          "F_FileName": "(20211208164033996)588812181.jpg",
          "F_FileType": ".jpg",
          "F_FileUrl": " http://docking.zwfw.anyang.gov.cn:9998/Upload/Files/2021/12/08/(20211208164033996)588812181.jpg",
          "F_Size": 117990,
          "F_UserCode": "10199"
        },
        {
          "F_AddTime": "2021-12-08 16:40:34",
          "F_FileId": 86595,
          "F_FileName": "(20211208164033996)588812181.jpg",
          "F_FileType": ".jpg",
          "F_FileUrl": " http://docking.zwfw.anyang.gov.cn:9998/Upload/Files/2021/12/08/(20211208164033996)588812181.jpg",
          "F_Size": 117990,
          "F_UserCode": "10199"
        },
        {
          "F_AddTime": "2021-12-08 16:40:34",
          "F_FileId": 86595,
          "F_FileName": "(20211208164033996)588812181.jpg",
          "F_FileType": ".jpg",
          "F_FileUrl": " http://docking.zwfw.anyang.gov.cn:9998/Upload/Files/2021/12/08/(20211208164033996)588812181.jpg",
          "F_Size": 117990,
          "F_UserCode": "10199"
        },
        {
          "F_AddTime": "2021-12-08 16:40:34",
          "F_FileId": 86595,
          "F_FileName": "(20211208164033996)588812181.jpg",
          "F_FileType": ".pdf",
          "F_FileUrl": " http://docking.zwfw.anyang.gov.cn:9998/Upload/Files/2021/12/08/(20211208164033996)588812181.jpg",
          "F_Size": 117990,
          "F_UserCode": "10199"
        },
        {
          "F_AddTime": "2021-12-08 16:40:34",
          "F_FileId": 86595,
          "F_FileName": "(20211208164033996)588812181.jpg",
          "F_FileType": ".pdf",
          "F_FileUrl": " http://docking.zwfw.anyang.gov.cn:9998/Upload/Files/2021/12/08/(20211208164033996)588812181.jpg",
          "F_Size": 117990,
          "F_UserCode": "10199"
        },
        {
          "F_AddTime": "2021-12-08 16:40:34",
          "F_FileId": 86595,
          "F_FileName": "(20211208164033996)588812181.jpg",
          "F_FileType": ".pdf",
          "F_FileUrl": " http://docking.zwfw.anyang.gov.cn:9998/Upload/Files/2021/12/08/(20211208164033996)588812181.jpg",
          "F_Size": 117990,
          "F_UserCode": "10199"
        },
      ]
    }
  },
  onLoad(option) {
    this.wid = option.wid
    // 获取详情
    this.getDetail("0")
    // 获取交办信息
    // this.getDetail("1")
  },
  methods: {
    // 返回列表页
    returnPage() {
      uni.$emit("updateList", {})
      uni.navigateBack({
        delta: 2,
      })
    },

    //获取详情
    getDetail(type) {
      let params = {
        type: type,
        workorderid: this.wid,
        token: uni.getStorageSync("token"),
      }
      this.$http
        .get("/WorkOrder/GetWorkOrderNew", params)
        .then((response) => {
          if (response.state.toLowerCase() === "success") {
            let data = response.data
            if (String(type) === "0") {
              this.detailContentData = Object.assign({}, data.data[0]) 
            } else if (String(type) === "1") {
              this.twoAssignedInformation = data.jbdata;
              this.threeAssignedInformation = data.ejjbdata;
              this.backAuditList = data.thdata;
            }
          }
        })
        .catch((e) => {
          console.log(e)
        })
    },
    onClickItem(e) {
      this.current = e.currentIndex;
      switch (e.currentIndex) {
        case 1:
          // 获取交办信息
          this.getDetail("1");
          break;
        default:
          break;
      }
    },
  },
  filters: {
    workStateFilters(value, data) {
      let str;
      switch(value) {
        case 0:
            let entryTimeDate = new Date(Date.parse(Data[0].F_CreateTime));
            let defaultTimeDate = new Date(Date.parse("2020-10-16 00:00:00"));
            if (entryTimeDate >= defaultTimeDate) {
              str = "新工单";
            } else {
              str = "新工单（历史工单）";
            }
          break;
        case 1:
          str =  "待交办";
          break;
        case 2:
          str =  "待查收";
          break;
        case 3:
          str =  "退回审核中";
          break;
        case 4:
          str =  "办理中";
          break;
        case 5:
          str =  "延时审核中";
          break;
        case 6:
          str =  "已办理";
          break;
        case 7:
          str =  "待回访";
          break;
        case 8:
          if (String(data.F_Identification) === "0" ) {
            str = "重置转发";
          } else if (String(data.F_Identification) === "1") {
            str = "退回重办";
          } else {
            str =  "重办中";
          }
          break;
        case 9:
          str =  "已结案";
          break;
        case 10:
          str =  "待审核";
          break;
        case 11:
          str =  "重办待交办";
          break;
        case 13:
          str =  "重办驳回";
          break;
        default:
          str = "";
          break;
      }
      return str
    },
    acceptPersonFilters(value, data) {
      let str;
      switch(data.F_InfoSource) {
        case 1:
          str = data.F_CreateUser;
          break;
        default:
          str = data.F_CusName;
          break;
      }
      return str;
    },
    dealWithWayFilters(value) {
      let str;
      switch(value) {
        case 0:
          str = "网络转办";
          break;
        case 1:
          str = "当即办理";
          break;
        default:
          str = "";
          break;
      }
      return str;
    },
    threeWayCallFilters(value) {
      let str;
      switch(value) {
        case 1:
          str = "是";
          break;
        default:
          str = "否";
          break;
      }
      return str;
    },
    levelFilters(value) {
      let str;
      switch(value) {
        case 1:
          str = "普通";
          break;
        default:
          str = "紧急";
          break;
      }
      return str;
    },
    isProtectFilters(value) {
      let str;
      switch(value) {
        case 0:
          str = "普通";
          break;
        default:
          str = "保密";
          break;
      }
      return str;
    },
    backauditFilters(value) {
      let str;
      switch(String(value)) {
        case "1":
          str = "同意";
          break;
        case "2":
          str = "拒绝";
          break;
        default:
          str = "";
          break;
      }
      return str;
    }
  }
}
</script>

<style lang="scss">
.wrapper {
  padding: 10px 10px 0 10px;

  .segmented-control {
    width: 100%;
    overflow: auto;
    /deep/ .segmented-control__item {
      white-space: nowrap;
      margin-right: 8px;
    }
    /deep/ .segmented-control__item:last-child {
      margin-right: 0px;
    }
  }
  .detailContent {
    margin: 15px 0 15px 0;
    .contentBlock {
      margin: 18px 0 0 0;
      .title {
        font-weight: 700;
      }
      .content {
        margin: 5px 0 5px 0;
      }
    }
    .contentTable {
      margin: 0 0 5px 0;
      .contentTitle {
        font-weight: 700;
        font-size: 14px;
      }
      .contentText {
        color: #525252;
        font-size: 14px;
      }
    }
  }
}
</style>