yos_web/buildAnnexation/ZB/questJs/ServicesupportApplyForm.js

const { createApp, ref ,onMounted,createVNode, render,computed,watch} = Vue

createApp({
  setup() {
    watch(() => tool.loading,(to, from) => {
    })
    onMounted(()=>{
      serviceOption()
      operationRole()
    })
    const formData = ref({
      sa_serviceorderid:0,
      sa_orderid:0,
      siteid:"HY",
      servicetype:"",
      sys_enterpriseid:0,
      sonum:'',
      enterprisename:"",
      class1:"",
      class2:"",
      province:"",
      city:"",
      county:"",
      address:"",
      scenecontact:"",
      phonenumber:"",
      scenecontactphonenumber:'',
      reason:'',
      scenecontactrole:'',
      begdate:'',
      enddate:'',
      remarks:'',
    })

    const restForm = ()=>{
      formData.value = {
        sa_serviceorderid:0,
        sa_orderid:0,
        siteid:"HY",
        servicetype:"",
        sys_enterpriseid:0,
        enterprisename:"",
        class1:"",
        class2:"",
        province:"",
        city:"",
        county:"",
        address:"",
        name:"",
        phonenumber:"",
        scenecontactphonenumber:'',
        reason:'',
        scenecontactrole:'',
        begdate:'',
        enddate:'',
        remarks:'',
      }
    }
    // 判断是否登陆,根据登陆角色类型跳转不同页面
    const isLogin = (type)=>{
      if (!sessionStorage.getItem('loginInfo')){
        $('#myModal').modal('show')
      } else {
        let user = sessionStorage.getItem('loginInfo')
        user = JSON.parse(user)
        if (type == 'apply') {
          $('#myModal').modal('hide')
          linkOf('./ServiceOfficial.html')
        } else {
          let link = {
            Official:'./ServiceOfficialApply.html',
            tourist:'./ServiceOfficialReservation.html'
          }
          linkOf(link[user.type])
        }
        
      }
    }
    
    // 跳转
    const linkOf = (url)=> {
      window.location.href = url
    }

    // 登陆账号验证码数据
    const form = ref({
      phoneNumber:'',
      verifyCode:''
    })
    const isSend = computed(()=>{
      return time.value === 0 ? false : true
    })

    // 服务类型数据
    const serviceOptionData = ref({})
    const serviceOption = async ()=>{
      const res = await instance.post('',{
        "id":20240902102603,
        "content": {
          "siteid":"HY",
          "customerphone":JSON.parse(sessionStorage.getItem('loginInfo')).customerphone,
        }
      })
      serviceOptionData.value = res.data.data
    }
    // 选择服务类型
    const onChangeService = (item,key)=>{
      formData.value[key] = item
      if (item == '售前' || item == '历史售后') {
        formData.value.sa_orderid = formData.value.sonum = ''
      }
    }
    
    // 客诉大类数据
    const serviceKSOptionData = ["内漏", "外漏", "性能失效", "配件损坏或遗失", "外观问题", "异响或抖动", "打不开/不通水", "扭矩大", "其他"]

    // 应用系统数据

    const serviceSysOptionData = ["暖通系统", "消防系统", "其他"]


    // 查询企业信息
    const EnterpriseParam = ref({
      "id":20220920083901,
      "content": {
        "siteid":"HY",
        "pageNumber":1,
        "pageSize":20,
        "where":{
          "condition":'',
          "type":9,
        }
      }
    })
    const EnterprisePageTotal = ref(0)
    const EnterpriseList = ref([])
    const getEnterpriseData = async ()=>{
      if (!JSON.parse(sessionStorage.getItem('loginInfo'))) return false
      const res = await instance.post('',EnterpriseParam.value)
      EnterpriseList.value = res.data.data
      EnterprisePageTotal.value = res.data.pageTotal
    }
    // 附件上传

    const previewList = ref([])
    const fileChange = ()=>{
      tool.fileChange((rs)=>{

        // 监听loading变化
        function createObservable(obj) {
          return new Proxy(obj, {
              get(target, property) {
                  return target[property];
              },
              set(target, property, value) {
                  previewList.value = previewList.value.filter(e=>{if(e.file.name == rs.file.name){e.loading = rs.loading} return e})
                  target[property] = value;
                  return true;
              }
          });
        }
        rs.createObservable = createObservable
        // tool.getUploadUrl(rs)
        previewList.value.push(rs)
      })
    }
    
    // 下一步
    const step = ref(0)
    const steps = ref(['填写信息','添加订单商品','提交申请'])
    const nextStep =  async ()=>{
      const rs = await tool.validateFormData(formData.value)
      if (!rs) return false
      if (step.value == steps.value.length - 1) return false

      step.value ++
      if (step.value == 1) {
        getorderProdData()
      }
    }
    const preStep = ()=>{
      step.value = step.value - 1
    }
    const orderProdData = ref({
      data:[]
    })
    const odParam = ref({
      id:20230206161703,
      content:{
        pageNumber:1,
        pageSize:100,
        sa_orderid: '',
        where:{
          condition:''
        }
      }
    })
    const getorderProdData = async ()=>{
      odParam.value.content.sa_orderid = formData.value.sa_orderid
      const res = await instance.post('',odParam.value)
      res.data.data = res.data.data.map(e=>{
        e.ischeck = false
        return e
      })
      orderProdData.value = res.data
    }
    // 提交单据
    const result = ref({})
    const submitData = async ()=>{
      if (!sessionStorage.getItem('loginInfo')){
        $('#myModal').modal('show')
      } else {
        const rs = await tool.validateFormData(formData.value)
        if (!rs) return false
        step.value = step.value + 1
        formData.value.phonenumber = JSON.parse(sessionStorage.getItem('loginInfo')).customerphone
        const res = await instance.post('',{
          "id":20230206091403,
          "content":  formData.value
        })
        result.value.code = res.data.code
        if (res.data.code == 1) {
          addProdToBill(res.data.data.sa_serviceorderid)
          beginUpload(res.data.data.sa_serviceorderid)
          serviceBillDetail(res.data.data.sa_serviceorderid)
        } else {
          result.value.errmsg = res.data.msg
        }
      }
      
    }

    // 提交单据后插入选择商品

    const addProdToBill = async (dataid)=>{
      const res = await instance.post('',{
        "id":20230206161803,
        "content":  {
          iteminfos:orderProdData.value.data.filter(e=>{if (e.ischeck == true){return e}}).map(e=>{return {
            itemid:e.itemid,
            qty:1,
            reason:'',
            sa_serviceorderitemsid:0
          }}),
          sa_serviceorderid:dataid
        }
      })
    }
    // 数据提交后开始附件上传
    const beginUpload = (id)=>{
      previewList.value.forEach(e=>{
        e.loading = true
        e.dataid = id 
        tool.getUploadUrl(e,'sa_serviceorder')
      })
      listenFileComplete()
    }

    const imageExtensions = ['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp', 'svg'];

    // 删除附件
    const deleteFile = (index)=>{
      previewList.value.splice(index,1)
      document.getElementById('fileInput').value = '';
    }

    // 分页切换
    const pageChange = (page)=>{
      if (page < 1) return false
      if (page > EnterprisePageTotal.value) return false
      EnterpriseParam.value.content.pageNumber = page
      getEnterpriseData()
    }

    
    const entTableVisiable = ref(false)

    // 选择表格数据
    const tableDataSelect = (soure,data)=>{
      switch (soure) {
        case 'enterprise':
          formData.value = Object.assign({},formData.value,data)
          $('#input_province').val(data.province).trigger('change');
          $('#input_city').val(data.city).trigger('change');
          entTableVisiable.value = false
          formData.value.sa_orderid = ''
          break;
        case 'order':
          formData.value.sa_orderid = data.sa_orderid
          formData.value.sonum = data.sonum
          orderTableVisiable.value = false
          break;
        default:
          break;
      }
    }

    // 切换日期
    const dateChange = (dom)=>{
      if (dom == '#begdate') {
        formData.value.begdate = $(dom).val()
      } else {
        formData.value.enddate = $(dom).val()
      }
      
    }
    //关联订单查询
    const orderTableVisiable = ref(false)
    const orderData = ref({

    })
    const orderParam = ref({
      id:20230206091503,
      content:{
        pageNumber: 1,
        pageSize: 20,
        sys_enterpriseid: 0,
        where:{
          condition:''
        }
      }
    })
    const getOrderData = async ()=>{
      orderParam.value.content.sys_enterpriseid = formData.value.sys_enterpriseid
      const res = await instance.post('',orderParam.value)
      orderData.value = res.data
    }
    // 订单分页切换
    const pageOrderChange = (page)=>{
      if (page < 1) return false
      if (page > orderData.value.pageTotal) return false
      orderParam.value.content.pageNumber = page
      getOrderData()
    }
    // 判断操作账号角色
    const hasEntSelectOp = ref(false)
    const operationRole = async ()=>{
      let roles = [0,1]
      let user = JSON.parse(sessionStorage.getItem('loginInfo')).resultobject.account_list[0]
      if (!roles.includes(user.usertype)) {
        const res = await instance.post('',{
          "classname": "common.usercenter.usercenter",
          "method": "queryUserMsg",
          "content": {}
        })
        formData.value.enterprisename = res.data.data.enterprise.enterprisename
        formData.value.sys_enterpriseid = res.data.data.enterprise.sys_enterpriseid
        hasEntSelectOp.value = false
      } else {
        hasEntSelectOp.value = true
      }
    }
    const isComplete = ref(false)
    // 监听附件上传是否已经完成
    listenFileComplete = ()=>{
      const timer = setInterval(() => {
        let arr = previewList.value.filter(e=>{
          if (e.loading == true) {
            return e
          }
        })
        if (arr.length > 0) {
          isComplete.value = false
        } else {
          isComplete.value = true
          clearInterval(timer)
        }
      }, 1000);
    }

    // 查询服务单详情
    const detailData = ref({})
    const serviceBillDetail = async (dataid)=>{
      const res = await instance.post('',{
        id:20230206091603,
        content:{
          sa_serviceorderid:dataid
        }
      })
      detailData.value = res.data.data
      tool.linkOf('./ServiceOfficialApplyList.html')
    }
    return {
      isLogin,
      linkOf,
      onChangeService,
      getEnterpriseData,
      EnterpriseList,
      formData,
      serviceOptionData,
      serviceKSOptionData,
      serviceSysOptionData,
      fileChange,
      previewList,
      submitData,
      imageExtensions,
      deleteFile,
      pageChange,
      EnterpriseParam,
      EnterprisePageTotal,
      entTableVisiable,
      hasEntSelectOp,
      dateChange,
      tableDataSelect,
      orderParam,
      orderData,
      getOrderData,
      pageOrderChange,
      orderTableVisiable,
      step,
      nextStep,
      preStep,
      steps,
      restForm,
      orderProdData,
      addProdToBill,
      isComplete,
      beginUpload,
      detailData,
      result,
      odParam,
      getorderProdData
    }
  }
}).mount('#app')