Commit b4ff8d6a authored by 李苏's avatar 李苏 💬

新增两个审批功能,修改bug

parent 24bb602c
......@@ -51,13 +51,13 @@ const routes = [
title: '退出',
},
},
{
path: '/pages/user/location',
name: 'location',
meta: {
title: '定位',
},
},
// {
// path: '/pages/user/location',
// name: 'location',
// meta: {
// title: '定位',
// },
// },
{
path: '/pages/common/exit',
name: 'exit',
......@@ -113,90 +113,90 @@ const routes = [
title: '通知详情',
},
},
{
path: '/pages/common/helloWorld',
name: 'helloWorld',
meta: {
title: 'helloWorld',
},
},
{
path: '/pages/common/ygqj',
name: 'ygqj',
meta: {
title: 'ygqj',
},
},
{
path: '/pages/common/qjxq',
name: 'qjxq',
meta: {
title: '请假详情',
},
},
{
path: '/pages/common/fybx',
name: 'fybx',
meta: {
title: '费用报销',
},
},
{
path: '/pages/common/fybxxq',
name: 'fybxxq',
meta: {
title: '费用报销详情',
},
},
{
path: '/pages/process/process',
name: 'process',
meta: {
title: 'process',
},
},
{
path: '/pages/process/dbswgzrw',
name: 'dbswgzrw',
meta: {
title:'dbswgzrw',
},
},
{
path: '/pages/process/dbswfybx',
name: 'dbswfybx',
meta: {
title:'dbswfybx',
},
},
{
path: '/pages/process/toprocessing',
name: 'toprocessing',
meta: {
title: '处理',
},
},
{
path: '/pages/process/tockxx',
name: 'tockxx',
meta: {
title: '查看详情',
},
},
{
path: '/pages/process/wdswfybx',
name: 'wdswfybx',
meta: {
title: 'wdswfybx',
},
},
{
path: '/pages/process/qjdedit',
name: 'qjdedit',
meta: {
title: '编辑请假单',
},
},
// {
// path: '/pages/common/helloWorld',
// name: 'helloWorld',
// meta: {
// title: 'helloWorld',
// },
// },
// {
// path: '/pages/common/ygqj',
// name: 'ygqj',
// meta: {
// title: 'ygqj',
// },
// },
// {
// path: '/pages/common/qjxq',
// name: 'qjxq',
// meta: {
// title: '请假详情',
// },
// },
// {
// path: '/pages/common/fybx',
// name: 'fybx',
// meta: {
// title: '费用报销',
// },
// },
// {
// path: '/pages/common/fybxxq',
// name: 'fybxxq',
// meta: {
// title: '费用报销详情',
// },
// },
// {
// path: '/pages/process/process',
// name: 'process',
// meta: {
// title: 'process',
// },
// },
// {
// path: '/pages/process/dbswgzrw',
// name: 'dbswgzrw',
// meta: {
// title:'dbswgzrw',
// },
// },
// {
// path: '/pages/process/dbswfybx',
// name: 'dbswfybx',
// meta: {
// title:'dbswfybx',
// },
// },
// {
// path: '/pages/process/toprocessing',
// name: 'toprocessing',
// meta: {
// title: '处理',
// },
// },
// {
// path: '/pages/process/tockxx',
// name: 'tockxx',
// meta: {
// title: '查看详情',
// },
// },
// {
// path: '/pages/process/wdswfybx',
// name: 'wdswfybx',
// meta: {
// title: 'wdswfybx',
// },
// },
// {
// path: '/pages/process/qjdedit',
// name: 'qjdedit',
// meta: {
// title: '编辑请假单',
// },
// },
{
path: '/pages/process/fybxdedit',
name: 'fybxdedit',
......@@ -266,6 +266,20 @@ const routes = [
meta: {
title: '领料单审批',
},
},
{
path: '/pages/cgddsp/cgddsp',
name: 'cgddsp',
meta: {
title: '采购订单审批',
},
},
{
path: '/pages/xsddsp/allcklc',
name: 'allcklc',
meta: {
title: '查看流程',
},
}
]
export default routes
\ No newline at end of file
......@@ -197,7 +197,7 @@ export const us = {
icon:icon_prefix+"qingjia2.png",
description:"请假",
useCount:1000,
page:'ygqj'
page:'cgddsp'
},
{
title:"销售订单审批",
......
......@@ -156,30 +156,25 @@
},{
"path": "pages/annotation/annotationDetail",
"style": {}
},{
"path": "pages/common/helloWorld",
"style": {},
"enablePullDownRefresh": true
}
,
{
"path": "pages/common/ygqj",
"style": {},
"enablePullDownRefresh": true
},
{
"path": "pages/common/qjxq",
"style": {}
},
{
"path": "pages/common/fybx",
"style": {},
"enablePullDownRefresh": true
},
{
"path": "pages/common/fybxxq",
"style": {}
},
// {
// "path": "pages/common/ygqj",
// "style": {},
// "enablePullDownRefresh": true
// },
// {
// "path": "pages/common/qjxq",
// "style": {}
// },
// {
// "path": "pages/common/fybx",
// "style": {},
// "enablePullDownRefresh": true
// },
// {
// "path": "pages/common/fybxxq",
// "style": {}
// },
{
"path" : "pages/process/process",
"style" :
......@@ -217,19 +212,19 @@
"path": "pages/process/wdswfybx",
"style": {}
},
{
"path": "pages/gzrw/gzrwcj",
"style": {},
"enablePullDownRefresh": true
},
{
"path": "pages/gzrw/gzrwedit",
"style": {}
},
{
"path": "pages/gzrw/gzrwxq",
"style": {}
},
// {
// "path": "pages/gzrw/gzrwcj",
// "style": {},
// "enablePullDownRefresh": true
// },
// {
// "path": "pages/gzrw/gzrwedit",
// "style": {}
// },
// {
// "path": "pages/gzrw/gzrwxq",
// "style": {}
// },
{
"path": "pages/addLovedata/addLovedata",
"style": {}
......@@ -253,6 +248,14 @@
{
"path": "pages/lldsp/lldspxq",
"style": {}
},
{
"path": "pages/cgddsp/cgddsp",
"style": {}
},
{
"path": "pages/xsddsp/allcklc",
"style": {}
}
],
"globalStyle": {
......
<template>
<view class="bg-white">
<cu-custom bgColor="bg-white" isBack="true">
<slot slot="backText">返回</slot>
</cu-custom>
<view class="bg-white nav fixed" :style="[{top:CustomBar + 'px'}]">
<view class="flex text-center">
</view>
</view>
<view class="container">
<view class="cu-bar bg-white search" >
<view class="example-body">
<uni-search-bar placeholder="搜索采购单号" @input="searchinput"></uni-search-bar>
</view>
<view class="action" style="margin-right: 8px;">
<text class="cu-btn round search-btn" @tap="showModal" data-target="bottomModal">
<text class="cuIcon-filter"></text>筛选</text>
</view>
</view>
<view class="index">
<view v-if="!showlist[0]" style="background-image: url(/static/sswnr.png);height: 87vh;background-size:100% 80%;"></view>
<view class="new_box" style="margin-top: 0px;">
<view class="bbox">
<view class="list-box" v-for="(item,index) in showlist" :key="index" style="border-bottom: 0.5px solid #EEEEEE;">
<view class="list-ed">
<view class="list-right">
<view class="flex justify-between">
<view class="list-name">采购单号:{{item.poid}}</view>
<view class="list-head" @click="choice(index)">
<view :class="[item.selected?'selde':'noselde']">
{{item.selected?"已选":"未选"}}<text
:class="[item.selected?'selde-q':'noselde-q']"></text></view>
</view>
</view>
<view class="">
<view>供应商:<text>{{item.gysname||"未设定"}}</text></view>
<view>物料编码:<text>{{item.wlcode||"未设"}}</text></view>
</view>
<view class="list-da">
<view>订单日期:<text>{{item.cjsj|formatDate}}</text></view>
<view>需求日期:<text>{{item.xqrq|formatDate}}</text></view>
</view>
<view class="list-da">
<view>物料名称:<text>{{item.wlmc}}</text></view>
<view>采购计量:<text>{{item.cgjldwname||"未设"}}</text></view>
</view>
<view class="list-da">
<view>需求数量:<text>{{item.xqsl}}</text></view>
<view>含税价格:<text>{{item.hsjg}}</text></view>
</view>
<view class="list-da">
<view>含税金额:<text>{{item.hsje}}</text></view>
<view>增值税率:<text>{{item.zzsl||"未设"}}</text></view>
</view>
<view class="list-da">
<view>无税价格:<text>{{item.wsjg}}</text></view>
<view>无税金额:<text>{{item.wsje}}</text></view>
</view>
<view class="list-da">
<view>型号:<text>{{item.sx01}}</text></view>
<view>材质:<text>{{item.sx02}}</text></view>
</view>
<view class="list-da">
<view>颜色:<text>{{item.sx03}}</text></view>
<view>图号:<text>{{item.sx04}}</text></view>
</view>
<view class="list-da">
<view>长:<text>{{item.sx05}}</text></view>
<view>宽:<text>{{item.sx06}}</text></view>
</view>
<view class="list-da">
<view>高:<text>{{item.sx07}}</text></view>
<view>维护日期:<text>{{item.whsj|formatDate}}</text></view>
</view>
<view class="">
<view>备注:<text>{{item.bz||"未备注"}}</text></view>
</view>
<view class="flex justify-between" style="padding-top: 10px;margin-bottom: 0px;">
<view >状态:
<text style="color:#FBBD08;">
{{item.zt|filterzt}}
</text>
</view>
<view style="color: #007AFF;" @click="nextTo(item)">
查看流程
</view>
</view>
</view>
</view>
</view>
<!-- <view class="sure" @click="sure">确认</view> -->
</view>
</view>
</view>
</view>
<!-- 转交确认模态框 -->
<view class="cu-modal" :class="modalName=='zj'?'show':''">
<view class="cu-dialog">
<view class="cu-bar bg-white justify-end">
<view class="content">提示</view>
<view class="action" @tap="hideModal">
<text class="cuIcon-close text-red"></text>
</view>
</view>
<view class="padding-xl bg-white">
是否转交选中单号请求?
</view>
<view class="cu-bar bg-white justify-end">
<view class="action">
<button class="cu-btn line-green text-green" @tap="hideModal">取消</button>
<button class="cu-btn bg-green margin-left" @tap="qrzj">确定</button>
</view>
</view>
</view>
</view>
<!-- 退回确认模态框 -->
<view class="cu-modal" :class="modalName=='th'?'show':''">
<view class="cu-dialog">
<view class="cu-bar bg-white justify-end">
<view class="content">提示</view>
<view class="action" @tap="hideModal">
<text class="cuIcon-close text-red"></text>
</view>
</view>
<view class="padding-xl bg-white">
是否退回选中单号请求?
</view>
<view class="cu-bar bg-white justify-end">
<view class="action">
<button class="cu-btn line-green text-green" @tap="hideModal">取消</button>
<button class="cu-btn bg-green margin-left" @tap="qrth">确定</button>
</view>
</view>
</view>
</view>
<!-- 撤回确认模态框 -->
<view class="cu-modal" :class="modalName=='ch'?'show':''">
<view class="cu-dialog">
<view class="cu-bar bg-white justify-end">
<view class="content">提示</view>
<view class="action" @tap="hideModal">
<text class="cuIcon-close text-red"></text>
</view>
</view>
<view class="padding-xl bg-white">
是否撤回选中单号请求?
</view>
<view class="cu-bar bg-white justify-end">
<view class="action">
<button class="cu-btn line-green text-green" @tap="hideModal">取消</button>
<button class="cu-btn bg-green margin-left" @tap="qrch">确定</button>
</view>
</view>
</view>
</view>
<!-- 提交确认模态框 -->
<view class="cu-modal" :class="modalName=='tj'?'show':''">
<view class="cu-dialog">
<view class="cu-bar bg-white justify-end">
<view class="content">提示</view>
<view class="action" @tap="hideModal">
<text class="cuIcon-close text-red"></text>
</view>
</view>
<view class="padding-xl bg-white">
是否提交选中单号请求?
</view>
<view class="cu-bar bg-white justify-end">
<view class="action">
<button class="cu-btn line-green text-green" @tap="hideModal">取消</button>
<button class="cu-btn bg-green margin-left" @tap="qrtj">确定</button>
</view>
</view>
</view>
</view>
<!-- 悬浮按钮 -->
<uni-fab :pattern="pattern" :content="content" @trigger="trigger"></uni-fab>
<!-- 筛选弹框 -->
<view class="cu-modal bottom-modal" :class="modalName=='bottomModal'?'show':''">
<view class="cu-dialog">
<view class="cu-bar bg-white cu-dialog-title">
<view class="action cu-dialog-back">
<text class="cuIcon-unfold" @tap="hideModal"></text>
</view>
<text>筛选</text>
</view>
<view class="cu-bar bg-white margin-top">
<view class="action">
<text class="text12">事务类型</text>
</view>
</view>
<view class="cu-list grid col-3">
<view class="cu-item" v-for="(item,index) in swlxlist" :key="index" @tap="selectswlx" :data-id="index">
<button :class="index==swlxsta?'active-select cur':''">{{item.text}}</button>
</view>
</view>
<view class="cu-bar bg-white margin-top">
<view class="action">
<text class="">状态</text>
</view>
</view>
<scroll-view scroll-y="true" style="height: 240px;">
<view class="cu-list grid col-2">
<view class="cu-item" v-for="(item,index) in ztlist" :key="index" @tap="selectzt" :data-id="index">
<button :class="index==ztsta?'active-select cur':''">{{item.text}}</button>
</view>
</view>
</scroll-view>
<view class="cu-bar bg-white cu-dialog-footer">
<button class=" " @tap="resetModal">重置</button>
<button class="text-blue active" @tap="sxqd">确定</button>
</view>
</view>
</view>
<!-- 事务处理 -->
<!-- 转交模态框 -->
<view class="cu-modal drawer-modal justify-end" :class="modalName=='zjmodal'?'show':''" @tap="hideModal">
<view class="cu-dialog basis-lg" style="overflow: auto;" @tap.stop=""
:style="[{top:CustomBar+'px',height:'calc(100vh - ' + CustomBar + 'px)'}]">
<view class="example-body" >
<uni-search-bar placeholder="搜索审批人" @input="searchSpr" ></uni-search-bar>
</view>
<view class="cu-bar bg-white solid-bottom">
<view class="action">
<span class="red"></span> 可选审批人
</view>
</view>
<view class="cu-form-group" style="-webkit-box-pack:unset;justify-content: left;overflow: auto;">
<view style="position: relative;" v-for="(item,index) in tjsprlistS" :key="index">
<view class="cu-avatar round lg margin-xs bg-red" @tap=gettjspr(item)>
<text class="avatar-text">{{item.name}}</text>
</view>
<!-- <view v-if="item.mustSelect!='Y'" @tap=qjzjspr(item) class="cu-avatar round lg margin-xs bg-green "
style="height: 15px;width: 15px;position: absolute;top: 0px;right: 0px;">
<text class="avatar-text"></text>
</view> -->
</view>
</view>
<view class="cu-bar bg-white solid-bottom margin-top">
<view class="action">
<span class="red"></span> 已选审批人
</view>
</view>
<view class="cu-form-group" style="-webkit-box-pack:unset;justify-content: left;overflow: auto;">
<view style="position: relative;" v-for="(item,index) in tjsprlistN" :key="index">
<view class="cu-avatar round lg margin-xs bg-red">
<text class="avatar-text">{{item.name}}</text>
</view>
<view v-if="item.mustSelect!='Y'" @tap=deltjspr(item,index) class="cu-avatar round lg margin-xs bg-gray "
style="height: 15px;width: 15px;position: absolute;top: 0px;right: 0px;">
<text class="avatar-text">x</text>
</view>
</view>
</view>
<view class="cu-list menu-avatar">
<view class="cu-form-group align-start" style="border-bottom:0.5px solid #EEEEEE;">
<view class="title"><span class="red"></span>处理意见</view>
<textarea maxlength="-1" v-model="tjclyj"
></textarea>
</view>
</view>
<view class="padding-xl">
<button @tap="apizjjh" class="cu-btn block bg-blue margin-tb-sm lg">
提交</button>
</view>
</view>
</view>
<!-- 提交模态框 -->
<view class="cu-modal drawer-modal justify-end" :class="modalName=='tjmodal'?'show':''" @tap="hideModal">
<view class="cu-dialog basis-lg" style="overflow: auto;" @tap.stop=""
:style="[{top:CustomBar+'px',height:'calc(100vh - ' + CustomBar + 'px)'}]">
<view class="example-body" >
<uni-search-bar placeholder="搜索审批人" @input="searchSpr" ></uni-search-bar>
</view>
<view class="cu-bar bg-white solid-bottom">
<view class="action">
<span class="red"></span> 可选审批人
</view>
</view>
<view class="cu-form-group" style="-webkit-box-pack:unset;justify-content: left;overflow: auto;">
<view style="position: relative;" v-for="(item,index) in tjsprlistS" :key="index">
<view class="cu-avatar round lg margin-xs bg-red" @tap=gettjspr(item)>
<text class="avatar-text">{{item.name}}</text>
</view>
<!-- <view v-if="item.mustSelect!='Y'" @tap=qjzjspr(item) class="cu-avatar round lg margin-xs bg-green "
style="height: 15px;width: 15px;position: absolute;top: 0px;right: 0px;">
<text class="avatar-text"></text>
</view> -->
</view>
</view>
<view class="cu-bar bg-white solid-bottom margin-top">
<view class="action">
<span class="red"></span> 已选审批人
</view>
</view>
<view class="cu-form-group" style="-webkit-box-pack:unset;justify-content: left;overflow: auto;">
<view style="position: relative;" v-for="(item,index) in tjsprlistN" :key="index">
<view class="cu-avatar round lg margin-xs bg-red">
<text class="avatar-text">{{item.name}}</text>
</view>
<view v-if="item.mustSelect!='Y'" @tap=deltjspr(item,index) class="cu-avatar round lg margin-xs bg-gray "
style="height: 15px;width: 15px;position: absolute;top: 0px;right: 0px;">
<text class="avatar-text">x</text>
</view>
</view>
</view>
<view class="cu-list menu-avatar">
<view class="cu-form-group align-start" style="border-bottom:0.5px solid #EEEEEE;">
<view class="title"><span class="red"></span>处理意见</view>
<textarea maxlength="-1" v-model="tjclyj"
></textarea>
</view>
</view>
<view class="padding-xl">
<button @tap="apitjjh" class="cu-btn block bg-blue margin-tb-sm lg">
提交</button>
</view>
</view>
</view>
<!-- 撤回模态框 -->
<view class="cu-modal drawer-modal justify-end" :class="modalName=='chmodal'?'show':''" @tap="hideModal">
<view class="cu-dialog basis-lg" style="overflow: auto;" @tap.stop=""
:style="[{top:CustomBar+'px',height:'calc(100vh - ' + CustomBar + 'px)'}]">
<view class="example-body" >
<uni-search-bar placeholder="搜索审批人" @input="searchSpr" ></uni-search-bar>
</view>
<view class="cu-bar bg-white solid-bottom">
<view class="action">
<span class="red"></span> 可选审批人
</view>
</view>
<view class="cu-form-group" style="-webkit-box-pack:unset;justify-content: left;overflow: auto;">
<view style="position: relative;" v-for="(item,index) in tjsprlistS" :key="index">
<view class="cu-avatar round lg margin-xs bg-red" @tap=gettjspr(item)>
<text class="avatar-text">{{item.name}}</text>
</view>
<!-- <view v-if="item.mustSelect!='Y'" @tap=qjzjspr(item) class="cu-avatar round lg margin-xs bg-green "
style="height: 15px;width: 15px;position: absolute;top: 0px;right: 0px;">
<text class="avatar-text"></text>
</view> -->
</view>
</view>
<view class="cu-bar bg-white solid-bottom margin-top">
<view class="action">
<span class="red"></span> 已选审批人
</view>
</view>
<view class="cu-form-group" style="-webkit-box-pack:unset;justify-content: left;overflow: auto;">
<view style="position: relative;" v-for="(item,index) in tjsprlistN" :key="index">
<view class="cu-avatar round lg margin-xs bg-red">
<text class="avatar-text">{{item.name}}</text>
</view>
<view v-if="item.mustSelect!='Y'" @tap=deltjspr(item,index) class="cu-avatar round lg margin-xs bg-gray "
style="height: 15px;width: 15px;position: absolute;top: 0px;right: 0px;">
<text class="avatar-text">x</text>
</view>
</view>
</view>
<view class="cu-list menu-avatar">
<view class="cu-form-group align-start" style="border-bottom:0.5px solid #EEEEEE;">
<view class="title"><span class="red"></span>处理意见</view>
<textarea maxlength="-1" v-model="tjclyj"
></textarea>
</view>
</view>
<view class="padding-xl">
<button @tap="apiqrch" class="cu-btn block bg-blue margin-tb-sm lg">
提交</button>
</view>
</view>
</view>
<!-- 撤回模态框 -->
<view class="cu-modal drawer-modal justify-end" :class="modalName=='thmodal'?'show':''" @tap="hideModal">
<view class="cu-dialog basis-lg" style="overflow: auto;" @tap.stop=""
:style="[{top:CustomBar+'px',height:'calc(100vh - ' + CustomBar + 'px)'}]">
<view class="example-body" >
<uni-search-bar placeholder="搜索审批人" @input="searchSpr" ></uni-search-bar>
</view>
<view class="cu-bar bg-white solid-bottom">
<view class="action">
<span class="red"></span> 可选审批人
</view>
</view>
<view class="cu-form-group" style="-webkit-box-pack:unset;justify-content: left;overflow: auto;">
<view style="position: relative;" v-for="(item,index) in tjsprlistS" :key="index">
<view class="cu-avatar round lg margin-xs bg-red" @tap=gettjspr(item)>
<text class="avatar-text">{{item.name}}</text>
</view>
<!-- <view v-if="item.mustSelect!='Y'" @tap=qjzjspr(item) class="cu-avatar round lg margin-xs bg-green "
style="height: 15px;width: 15px;position: absolute;top: 0px;right: 0px;">
<text class="avatar-text"></text>
</view> -->
</view>
</view>
<view class="cu-bar bg-white solid-bottom margin-top">
<view class="action">
<span class="red"></span> 已选审批人
</view>
</view>
<view class="cu-form-group" style="-webkit-box-pack:unset;justify-content: left;overflow: auto;">
<view style="position: relative;" v-for="(item,index) in tjsprlistN" :key="index">
<view class="cu-avatar round lg margin-xs bg-red">
<text class="avatar-text">{{item.name}}</text>
</view>
<view v-if="item.mustSelect!='Y'" @tap=deltjspr(item,index) class="cu-avatar round lg margin-xs bg-gray "
style="height: 15px;width: 15px;position: absolute;top: 0px;right: 0px;">
<text class="avatar-text">x</text>
</view>
</view>
</view>
<view class="cu-list menu-avatar">
<view class="cu-form-group align-start" style="border-bottom:0.5px solid #EEEEEE;">
<view class="title"><span class="red"></span>处理意见</view>
<textarea maxlength="-1" v-model="tjclyj"
></textarea>
</view>
</view>
<view class="padding-xl">
<button @tap="apiqrth" class="cu-btn block bg-blue margin-tb-sm lg">
提交</button>
</view>
</view>
</view>
</view>
</template>
<script>
const tabs = [{
title: '发起提交',
value: 0
}, {
title: '查看数据',
value: 1
}];
import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js";
export default {
mixins: [MescrollMixin], // 使用mixin
onReachBottom(e) {
this.pageNo++
this.apigetcgjh()
},
onLoad() {
let that = this
uni.getStorage({
key: 'username',
success: function(res) {
console.log(res.data);
that.username = res.data
console.log(that.username)
}
});
this.apigetcgjh()
},
filters: {
filterzt:function(a){
const ztList = {"P": "计划", "F":"确认","C":"完成","I":"开始","S":"审批"};
return ztList[a]
},
jqfilters:function(a){
const ztList = {"BJ": "病假", "SJ":"事假","JB":"加班","TS":"调休","QT":"其他"};
return ztList[a]
},
ztTrans: function(a) {
const ztList = {0: "创建", 1:"提交",2:"退回",3:"撤回",4:"转交",5:"调度",8:"待处理"};
return ztList[a]
},
formatTime: function(time) {
if(time!=null&&time!="")
{
var date = new Date(time);
return date.Format("MM-dd hh:mm")
}else{
return "";
}
},
formatDate:function(time){
if(time!=null&&time!="")
{
var date = new Date(time);
return date.Format("yyyy-MM-dd")
}else{
return "";
}
}
},
data() {
return {
tjsprnext:{},
tjclyj:"",
tjsprlist:[],
tjsprlistS:[],
tjsprlistN:[],
pattern: {
color: '#7A7E83',
backgroundColor: '#fff',
selectedColor: '#7A7E83',
},
//批量操作
content: [{
iconPath: '/static/gzlicon/tijiao.png',
selectedIconPath: '/static/gzlicon/tijiao.png',
text: '提交',
active: true
},
{
iconPath: '/static/gzlicon/chehui.png',
selectedIconPath: '/static/gzlicon/chehui.png',
text: '撤回',
active: false
},
{
iconPath: '/static/gzlicon/tuihui.png',
selectedIconPath: '/static/gzlicon/tuihui.png',
text: '退回',
active: false
},
{
iconPath: '/static/gzlicon/zhuanjiao.png',
selectedIconPath: '/static/gzlicon/zhuanjiao.png',
text: '转交',
active: false
}
],
// 查询参数
gysid: "",
operatype: "W",
pageNo: 1,
pageSize: 20,
poid: "",
ywrqb: "",
ywrqe: "",
zt:"",
// 筛选状态
ztsta:"5",
swlxsta:"2",
username: "",
selectBxlx: "",
cgjhlist:[],
showlist:[],
modalName:"",
selectId: [],
swlxlist:[
{id:"0",text:"所有事务"},
{id:"1",text:"已处理"},
{id:"2",text:"待处理"},
],
ztlist:[
{id:"0",text:"开始"},{id:"1",text:"计划"},
{id:"2",text:"审批"},{id:"3",text:"确认"},
{id:"4",text:"完成"},{id:"5",text:"全部"},
],
}
},
onShow() {},
computed: {
},
methods: {
// 重置过滤芯
resetModal(){
this.operatype="W"
this.zt=""
this.ztsta="5"
this.swlxsta="2"
},
// 转交单子api
apizjjh(){
let that=this
let nextinfo =that.tjsprnext
nextinfo.comment=this.tjclyj
nextinfo.userList=this.tjsprlistN
// let nextinfo={
// selected: "Y",
// comment: this.tjclyj,
// userList:this.tjsprlistN,
// wfpid: "0000",
// wfpname: "开始",
// ywzt: "I"
// }
let tjdata=[]
this.selectId.forEach(e=>{
delete e.wfoperate
tjdata.push(e)
})
// delete this.tjdata.wfoperate;
this.$http.post("cggl/posp/wftransfer",{nextinfo:nextinfo,records:tjdata}).then(res => {
if (res.data.success) {
that.$tip.toast("提交成功");
that.hideModal()
that.sxqd()
} else {
this.hideModal()
console.log(res)
that.$tip.toast(res.data.messageArray[0].message||"提交失败");
}
});
},
// 转交spr
apizjsp(){
let that=this;
let qjdata=this.selectId[0]
qjdata.wfoperate="4"
this.$http.post("cggl/posp/wfnextinfo",qjdata).then(res => {
if (res.data.success) {
that.tjsprnext=res.data.data.records[0]
that.tjsprlist=res.data.data.records[0].userList
that.tjsprlistS=that.tjsprlist
that.modalName="zjmodal"
} else {
that.$tip.toast(res.data.message||"获取转交列表失败");
}
});
},
// 确认转交
qrzj(){
if(this.selectId.length==0){
this.hideModal()
this.$tip.toast("请先选中计划单");
return false
}
else {
let rep=true
// this.selectId.forEach(e=>{
// if(e.zt!="I"){
// this.$tip.toast("请选中开始状态的订单再提交");
// rep=false
// }
// })
if(rep){
this.apizjsp()
}
this.hideModal()
}
},
// api退回
apiqrth(){
let that=this
let nextinfo =that.tjsprnext
nextinfo.comment=this.tjclyj
nextinfo.userList=this.tjsprlistN
// let nextinfo={
// selected: "Y",
// comment: this.tjclyj,
// userList:this.tjsprlistN,
// wfid: "2C9577B77AE742EA017AE75BAA9E00D9",
// wfinstid: "402809817D26536D017D265527460008",
// wfpid: "0000",
// wfpname: "开始",
// ywzt: "S"
// }
let tjdata=[]
this.selectId.forEach(e=>{
delete e.wfoperate
tjdata.push(e)
})
// delete this.tjdata.wfoperate;
this.$http.post("cggl/posp/wfgoback",{nextinfo:nextinfo,records:tjdata}).then(res => {
if (res.data.success) {
that.$tip.toast("提交成功");
that.hideModal()
that.sxqd()
} else {
this.hideModal()
console.log(res)
that.$tip.toast(res.data.messageArray[0].message||"提交失败");
}
});
},
// 退回审批人
apithsp(){
let that=this;
let qjdata=this.selectId[0]
qjdata.wfoperate="2"
this.$http.post("cggl/posp/wfnextinfo",qjdata).then(res => {
if (res.data.success) {
that.tjsprnext=res.data.data.records[0]
that.tjsprlist=res.data.data.records[0].userList
that.tjsprlistS=that.tjsprlist
that.tjsprlistS.forEach(item=>{
let noRepeat=true
this.tjsprlistN.forEach((e,index)=>{
if(e.id==item.id){
console.log("重复了")
noRepeat=false
}
})
if(noRepeat&&item.mustSelect=="Y"){
item.selected="Y"
this.tjsprlistN.push(item)
}
})
that.modalName="thmodal"
} else {
that.$tip.toast(res.data.message||"获取审批列表失败");
}
});
},
// 退回弹框确定
qrth(){
if(this.selectId.length==0){
this.hideModal()
this.$tip.toast("请先选中计划单");
return false
}
else {
let rep=true
this.selectId.forEach(e=>{
// if(e.zt!="S"){
// this.$tip.toast("请选中审批状态的订单再提交");
// rep=false
// }
})
if(rep){
this.apithsp()
}
this.hideModal()
}
},
// api撤回
apiqrch(){
let that=this
let nextinfo =that.tjsprnext
nextinfo.comment=this.tjclyj
nextinfo.userList=this.tjsprlistN
// let nextinfo={
// selected: "Y",
// comment: this.tjclyj,
// userList:this.tjsprlistN,
// wfid: "2C9577B77AE742EA017AE75BAA9E00D9",
// wfinstid: "402809817D26536D017D265527460008",
// wfpid: "0000",
// wfpname: "开始",
// ywzt: "I"
// }
let tjdata=[]
this.selectId.forEach(e=>{
delete e.wfoperate
tjdata.push(e)
})
// delete this.tjdata.wfoperate;
this.$http.post("cggl/posp/wfpullback",{nextinfo:nextinfo,records:tjdata}).then(res => {
if (res.data.success) {
that.$tip.toast("提交成功");
that.hideModal()
that.sxqd()
} else {
this.hideModal()
console.log(res)
that.$tip.toast(res.data.messageArray[0].message||"提交失败");
}
});
},
// 撤回弹框确定
qrch(){
if(this.selectId.length==0){
this.hideModal()
this.$tip.toast("请先选中计划单");
return false
}
else {
let rep=true
// this.selectId.forEach(e=>{
// if(e.zt!="S"){
// this.$tip.toast("请选中审批状态的订单再提交");
// rep=false
// }
// })
if(rep){
this.apichsp()
}
this.hideModal()
}
},
// 撤回审批人
apichsp(){
let that=this;
let qjdata=this.selectId[0]
qjdata.wfoperate="3"
this.$http.post("cggl/posp/wfnextinfo",qjdata).then(res => {
if (res.data.success) {
that.tjsprnext=res.data.data.records[0]
that.tjsprlist=res.data.data.records[0].userList
that.tjsprlistS=that.tjsprlist
that.tjsprlistS.forEach(item=>{
let noRepeat=true
this.tjsprlistN.forEach((e,index)=>{
if(e.id==item.id){
console.log("重复了")
noRepeat=false
}
})
if(noRepeat&&item.mustSelect=="Y"){
item.selected="Y"
this.tjsprlistN.push(item)
}
})
that.modalName="chmodal"
} else {
that.$tip.toast(res.data.message||"获取审批列表失败");
}
});
},
// 提交单子api
apitjjh(){
let that=this
let nextinfo =that.tjsprnext
nextinfo.comment=this.tjclyj
nextinfo.userList=this.tjsprlistN
// let nextinfo={
// selected: "Y",
// comment: this.tjclyj,
// userList:this.tjsprlistN,
// wfpid: "0010",
// wfpname: "审批",
// ywzt: "S"
// }
let tjdata=[]
this.selectId.forEach(e=>{
delete e.wfoperate
tjdata.push(e)
})
// delete this.tjdata.wfoperate;
this.$http.post("cggl/posp/wfgo",{nextinfo:nextinfo,records:tjdata}).then(res => {
if (res.data.success) {
that.$tip.toast("提交成功");
that.hideModal()
that.sxqd()
} else {
this.hideModal()
console.log(res)
that.$tip.toast(res.data.messageArray[0].message||"提交失败");
}
});
},
// 删除提交审批人
deltjspr(item,index){
this.tjsprlistN.splice(index, 1)
},
searchSpr(d){
this.tjsprlistS=[]
this.tjsprlist.forEach(e=>{
if(e.name.indexOf(d)!=-1){
this.tjsprlistS.push(e)
}
})
},
// 选择提交审批人
gettjspr(item){
let noRepeat=true
this.tjsprlistN.forEach((e,index)=>{
if(e.id==item.id){
console.log("重复了")
noRepeat=false
}
})
if(noRepeat){
item.selected="Y"
this.tjsprlistN.push(item)
}
},
apitjsp(){
let that=this;
let qjdata=this.selectId[0]
qjdata.wfoperate="1"
this.$http.post("cggl/posp/wfnextinfo",qjdata).then(res => {
if (res.data.success) {
that.tjsprnext=res.data.data.records[0]
that.tjsprlist=res.data.data.records[0].userList
that.tjsprlistS=that.tjsprlist
that.modalName="tjmodal"
} else {
that.$tip.toast(res.data.message||"获取审批列表失败");
}
});
},
qrtj(){
if(this.selectId.length==0){
this.hideModal()
this.$tip.toast("请先选中计划单");
return false
}
else {
let rep=true
// this.selectId.forEach(e=>{
// if(e.zt!="I"){
// this.$tip.toast("请选中开始状态的订单再提交");
// rep=false
// }
// })
if(rep){
this.apitjsp()
}
this.hideModal()
}
},
nextTo(item){
this.$Router.push({
path: '/pages/xsddsp/allcklc', query:{
infor:item
},
})
},
searchinput(e){
this.poid=e
this.pageNo=1
this.showlist=[]
this.selectId=[]
this.apigetcgjh()
},
// 悬浮框方法
trigger(e) {
let gzlzt=e.item.text
if(gzlzt=="提交"){
this.modalName="tj"
}else if(gzlzt=="撤回"){
this.modalName="ch"
}else if(gzlzt=="退回"){
this.modalName="th"
}else if(gzlzt=="转交"){
this.modalName="zj"
}
},
sxqd(){
this.pageNo=1
this.showlist=[]
this.selectId=[]
this.hideModal()
this.apigetcgjh()
},
// 状态选中
selectzt(e){
this.ztsta = e.currentTarget.dataset.id;
let list = {"0": "I", "1":"H","2":"S","3":"F","4":"C","5":"",};
this.zt=list[this.ztsta]
console.log('ztsta',this.zt)
},
// 事务类型选中
selectswlx(e){
this.swlxsta = e.currentTarget.dataset.id;
let list = {"0": "A", "1":"H","2":"W"};
this.operatype=list[this.swlxsta]
console.log('swlxsta',this.operatype)
},
hideModal(e) {
this.modalName = null
this.tjsprlist=[]
this.tjsprlistN=[]
this.tjsprlistS=[]
this.tjclyj=""
},
// 筛选框
showModal(e) {
this.modalName = e.currentTarget.dataset.target
},
// 基础请求数据
apigetcgjh(){
let that=this;
this.$http.post("cggl/posp/query",{
gysid:this.gysid,
operatype: this.operatype,
pageNo: this.pageNo,
pageSize: this.pageSize,
poid: this.poid,
ywrqb: this.ywrqb,
ywrqe: this.ywrqe,
zt: this.zt
}).then(res => {
if (res.data.success) {
res.data.data.records.forEach(e=>{
e.selected= false
})
that.cgjhlist=res.data.data.records
that.cgjhlist.forEach(e=>{
that.showlist.push(e)
})
console.log(that.cgjhlist)
} else {
console.log(res)
that.$tip.toast(res.data.message||"获取采购计划单失败");
}
});
},
// 单选
choice(index){
if(this.showlist[index].selected == true){
this.showlist[index].selected = false;
for(var i = 0; i < this.selectId.length; i++){
if(this.selectId[i].jhid === this.showlist[index].jhid){
this.selectId.splice(i,1);
}
}
console.log("选中的值",this.selectId)
}else{
this.selectId=[]
this.showlist.forEach((e,dex)=>{
if(dex!=index){
this.showlist[dex].selected=false
}
})
this.showlist[index].selected = true;
this.selectId.push(this.showlist[index])
console.log("选中的值",this.selectId)
}
},
// choice(index){
// console.log(this.showlist[index].selected)
// console.log(index)
// if(this.showlist[index].selected == true){
// this.showlist[index].selected = false;
// //取消选中时删除数组中的值
// for(var i = 0; i < this.selectId.length; i++){
// if(this.selectId[i].jhid === this.showlist[index].jhid){
// this.selectId.splice(i,1);
// }
// }
// console.log("选中的值",this.selectId)
// }else{
// this.showlist[index].selected = true;
// this.selectId.push(this.showlist[index])
// console.log("选中的值",this.selectId)
// }
// },
}
}
</script>
<style scoped>
* {
font-size: 14px !important;
}
.uni-card__head-padding {
background-color: #007AFF !important;
color: #FFFFFF;
}
.red {
color: red;
}
.e-btn {
margin-bottom: 1rem;
}
.titlePad {
margin-top: 0.6rem;
}
.cu-list>.move-cur {
transform: translateX(-150rpx);
}
.nav .cu-item.cur {
position: flex;
z-index: 9;
border-bottom: 4px solid;
}
.bordp {
padding-bottom: 10px;
border-bottom: 5px solid #EEEEEE;
}
.bordb {
padding-top: 10px;
border-top: 5px solid #EEEEEE;
}
/* 头条小程序组件内不能引入字体 */
/* #ifdef MP-TOUTIAO */
@font-face {
font-family: uniicons;
font-weight: normal;
font-style: normal;
src: url('~@/static/uni.ttf') format('truetype');
}
/* #endif */
/* #ifndef APP-NVUE */
page {
display: flex;
flex-direction: column;
box-sizing: border-box;
background-color: #efeff4;
min-height: 100%;
height: auto;
}
view {
line-height: inherit;
}
.example {
padding: 0 15px 15px;
}
.example-info {
padding: 15px;
color: #3b4144;
background: #ffffff;
}
.example-body {
width: 100%;
flex-direction: row;
flex-wrap: wrap;
justify-content: center;
padding: 0;
font-size: 14px;
background-color: #ffffff;
}
/* #endif */
.example {
padding: 0 15px;
}
.example-info {
/* #ifndef APP-NVUE */
display: block;
/* #endif */
padding: 15px;
color: #3b4144;
background-color: #ffffff;
font-size: 14px;
line-height: 20px;
}
.example-info-text {
font-size: 14px;
line-height: 20px;
color: #3b4144;
}
.example-body {
flex-direction: column;
padding: 15px;
background-color: #ffffff;
}
.word-btn-white {
font-size: 18px;
color: #FFFFFF;
}
.word-btn {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: row;
align-items: center;
justify-content: center;
border-radius: 6px;
height: 48px;
margin: 15px;
background-color: #007AFF;
}
.word-btn--hover {
background-color: #4ca2ff;
}
.search-result {
margin-top: 10px;
margin-bottom: 20px;
text-align: center;
}
.search-result-text {
text-align: center;
font-size: 14px;
}
.example-body {
/* #ifndef APP-NVUE */
display: block;
/* #endif */
padding: 0px;
}
.search-btn {
font-size: 12px;
width: 54px;
background-color: white;
border: 1px solid lightgray;
padding: 0;
}
.bottom-modal uni-button {
font-size: 12px;
color: #555555;
background: white;
}
.bottom-modal .active-select {
color: white;
background-color: #0081FF;
}
.bottom-modal .cu-list.grid>.cu-item {
padding: 10px 20px;
}
.bottom-modal .cu-list.grid>.cu-item>uni-button {
width: 100%;
}
.cu-dialog-footer button {
padding: 0 40px;
font-size: 14px;
}
.cu-dialog-footer button:last-child {
color: white;
background-color: #007AFF;
}
.process-page .cu-list.menu-avatar.comment>.cu-item {
padding: 15px;
}
.process-page .text-sm {
font-size: 12px;
}
/* */
page{
background-color: #eee;
}
/* 已选择 */
.selde {
border: 1px solid red;
background: red;
color: #FFFFFF;
border-radius: 20px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
font-size: 20px;
padding: 0 5px;
}
.selde-q {
width: 18px;
height: 18px;
border-radius: 50%;
background: #FFFFFF;
margin-left: 6px;
}
/* 未选择 */
.noselde {
border: 1px solid #959595;
background: #FFFFFF;
color: #959595;
border-radius: 13px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
font-size: 15px;
padding: 0 5px;
}
.noselde-q {
border: 1px solid #959595;
width: 15px;
height: 15px;
border-radius: 50%;
background: #FFFFFF;
margin-left: 6px;
}
.list-box {
display: flex;
flex-direction: column;
background-color: #fff;
/* margin: 0px 16px 16px 16px; */
padding: 20px;
border-radius: 0px;
}
.list-ed {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
}
.list-left {
margin-right: 16px;
}
.list-img {
width: 160px;
height: 160px;
margin: 0px 16px 0px 0px;
}
.list-right {
display: flex;
flex-direction: column;
width: 100%;
height: 100%;
}
/* .list-right-img {
width: 140px;
height: 38px;
} */
.noadsop {
width: 120px;
height: 32px;
}
.list-head {
display: flex;
justify-content: flex-end;
margin-bottom: 10px;
}
.list-name {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
margin-bottom: 10px;
}
.list-da {
display: flex;
flex-direction: row;
font-size: 26px;
}
.list-da view {
width: 50%;
}
/* .list-da view text {
color: red;
} */
.sure {
background: #FF6000;
color: #FFFFFF;
width: 80%;
height: 40px;
display: flex;
justify-content: center;
align-items: center;
border-radius: 10px;
margin: 60px auto;
}
</style>
......@@ -19,6 +19,7 @@
</view>
</view>
<view class="index">
<view v-if="!showlist[0]" style="background-image: url(/static/sswnr.png);height: 87vh;background-size:100% 80%;"></view>
<view class="new_box" style="margin-top: 0px;">
<view class="bbox">
<view class="list-box" v-for="(item,index) in showlist" :key="index" style="border-bottom: 0.5px solid #EEEEEE;">
......@@ -33,7 +34,7 @@
</view>
</view>
<view class="list-da">
<view>计划部门:<text>{{item.course||"未设定"}}</text></view>
<view>计划部门:<text>{{item.bmmc||"未设定"}}</text></view>
<view>计划日期:<text>{{item.jhrq|formatDate}}</text></view>
</view>
<view class="list-da">
......@@ -531,6 +532,13 @@
},
methods: {
// 重置过滤芯
resetModal(){
this.operatype="W"
this.zt=""
this.ztsta="5"
this.swlxsta="2"
},
// 转交单子api
apizjjh(){
let that=this
......@@ -928,7 +936,7 @@
this.tjsprlist=[]
this.tjsprlistN=[]
this.tjsprlistS=[]
this.tjclyj=[]
this.tjclyj=""
},
// 筛选框
showModal(e) {
......@@ -962,34 +970,45 @@
}
});
},
choice(index){
console.log(this.showlist[index].selected)
console.log(index)
if(this.showlist[index].selected == true){
this.showlist[index].selected = false;
//取消选中时删除数组中的值
for(var i = 0; i < this.selectId.length; i++){
if(this.selectId[i].jhid === this.showlist[index].jhid){
this.selectId.splice(i,1);
}
// 单选
choice(index){
if(this.showlist[index].selected == true){
this.showlist[index].selected = false;
for(var i = 0; i < this.selectId.length; i++){
if(this.selectId[i].jhid === this.showlist[index].jhid){
this.selectId.splice(i,1);
}
}
console.log("选中的值",this.selectId)
}else{
this.selectId=[]
this.showlist.forEach((e,dex)=>{
if(dex!=index){
this.showlist[dex].selected=false
}
})
this.showlist[index].selected = true;
this.selectId.push(this.showlist[index])
console.log("选中的值",this.selectId)
}
console.log("选中的值",this.selectId)
}else{
this.showlist[index].selected = true;
this.selectId.push(this.showlist[index])
console.log("选中的值",this.selectId)
}
},
//提交
// sure(){
// //提交选中的值
// if(this.selectId.length==0){
// alert("请选择学科");
// return false;
// }
// var listIds = this.selectId.join(",")
// console.log("提交的数据",listIds)
// }
},
// choice(index){
// console.log(this.showlist[index].selected)
// console.log(index)
// if(this.showlist[index].selected == true){
// this.showlist[index].selected = false;
// for(var i = 0; i < this.selectId.length; i++){
// if(this.selectId[i].jhid === this.showlist[index].jhid){
// this.selectId.splice(i,1);
// }
// }
// console.log("选中的值",this.selectId)
// }else{
// this.showlist[index].selected = true;
// this.selectId.push(this.showlist[index])
// console.log("选中的值",this.selectId)
// }
// },
}
}
......
<template>
<view class="bg-white">
<cu-custom bgColor="bg-white" isBack="true">
<slot slot="backText">返回</slot>
</cu-custom>
<view class="bg-white nav fixed" :style="[{top:CustomBar + 'px'}]">
<view class="flex text-center">
<view class="cu-item flex-sub" :class="index==TabCur?'text-orange cur':''" v-for="(item,index) in tabs" :key="index" @tap="tabSelect" :data-id="index">
{{item.title}}
</view>
</view>
</view>
<view class="cu-modal drawer-modal justify-end" :class="modalName=='DrawerModalR'?'show':''" @tap="hideModal">
<view class="cu-dialog basis-lg" style="overflow: auto;" @tap.stop=""
:style="[{top:CustomBar+'px',height:'calc(100vh - ' + CustomBar + 'px)'}]">
<view class="cu-bar bg-white solid-bottom margin-top">
<view class="action">
<text class="cuIcon-title text-orange "></text> 选择审批人
</view>
</view>
<view class="cu-list menu-avatar">
<view v-for="(item,index) in allsprlist" :key="index" class="cu-item" @tap="addsprlist(item)">
<view class="cu-avatar round lg">
<view class="cu-avatar round lg margin-xs ">
<text class="avatar-text">{{item.name.substr(0,1)}}</text>
</view>
</view>
<view class="content">
<view class="text-grey">{{item.name}}</view>
<view class="text-gray text-sm flex">
<view class="text-cut">
{{item.infor}}
</view>
</view>
</view>
<view class="action">
</view>
</view>
</view>
</view>
</view>
<view class="container">
<view class="solid-bottom">
<scroll-view scroll-x class="bg-white nav text-center ">
<view class="flex text-center justify-around">
<view class="cu-item" :class="item.value==TabCur?'text-blue cur':''"
v-for="(item,index) in tabs" :key="index" @tap="tabSelect" :data-id="item.value">
{{item.title}}
</view>
</view>
</scroll-view>
</view>
<view v-if="TabCur==0" class="margin-top-sm">
<!-- 总报销 -->
<view >
<view class="action"
style="padding-top: 5px;padding-bottom: 5px;padding-left: 20px;background-color: #EEEEEE;">
报销信息
</view>
<view class="cu-form-group">
<view class="title"><span class="red">*</span>报销人</view>
<picker mode="selector" :range="bxrlist" value="0" @change="getbxr" range-key="USERS_USERNAME" >
<view class="picker">
{{bxr.USERS_USERNAME||"请选择"}}
</view>
</picker>
</view>
<view class="cu-form-group">
<view class="title"><span class="red">*</span>报销类型</view>
<picker mode="selector" :range="bxlxlist" value="0" @change="getbxlx" range-key="name" >
<view class="picker">
{{bxlx.name||"请选择"}}
</view>
</picker>
</view>
<view class="cu-form-group">
<view class="title"><span class="red">*</span>费用使用人</view>
<input v-model="fysyr" name="input" ></input>
</view>
<view class="cu-form-group ">
<view class="title"><span class="red">*</span>报销日期</view>
<picker mode="date" @change="getbxrq">
<view class="picker">
{{bxrq||"请选择"}}
</view>
</picker>
</view>
<view class="cu-form-group ">
<view class="title"><span class="red">*</span>开始日期</view>
<picker mode="date" @change="getksrq">
<view class="picker">
{{ksrq||"请选择"}}
</view>
</picker>
</view>
<view class="cu-form-group ">
<view class="title"><span class="red">*</span>结束日期</view>
<picker mode="date" @change="getjsrq" >
<view class="picker">
{{jsrq||"请选择"}}
</view>
</picker>
</view>
<view class="cu-form-group align-start" style="border-bottom:0.5px solid #EEEEEE;">
<view class="title"><span class="red">*</span>报销事由</view>
<textarea v-model="bxsy" maxlength="-1" :disabled="modalName!=null"
placeholder="请输入费用明细"></textarea>
</view>
</view>
<!-- 增加报销明细 -->
<view v-for="(item,index) in bxmxlist" :key=index>
<view class="action flex justify-between"
style="padding-top: 5px;padding-bottom: 5px;padding-left: 20px;background-color: #EEEEEE;">
<view>
报销明细{{index+1}}
</view>
<view @click="scmx(index)" style="padding-right: 20px;color: #007AFF;">
删除
</view>
</view>
<view class="cu-form-group">
<view class="title"><span class="red">*</span>费用项目</view>
<picker mode="selector" :range="fyxmlist" value="0" @change="getfyxm($event,index)" range-key="xmmc" >
<view class="picker">
{{bxmxlist[index].fyxm.xmmc||"请选择"}}
</view>
</picker>
</view>
<view class="cu-form-group">
<view class="title"><span class="red">*</span>项目</view>
<picker mode="selector" :range="xmlist" value="0" @change="getxm($event,index)" range-key="name" >
<view class="picker">
{{bxmxlist[index].xm.name||"请选择"}}
</view>
</picker>
</view>
<view class="cu-form-group">
<view class="title"><span class="red">*</span>报销金额</view>
<input type="number" name="input" v-model="item.bxje"></input>
</view>
<view class="cu-form-group">
<view class="title"><span class="red">*</span>发票金额</view>
<input type="number" name="input" v-model="item.fpje"></input>
</view>
<view class="cu-form-group">
<view class="title"><span class="red">*</span>出发地</view>
<input name="input" v-model="item.zf01"></input>
</view>
<view class="cu-form-group">
<view class="title"><span class="red">*</span>到达地</view>
<input name="input" v-model="item.zf02"></input>
</view>
<view class="cu-form-group">
<view class="title"><span class="red">*</span>交通方式</view>
<input name="input" v-model="item.zf03"></input>
</view>
<view class="cu-form-group ">
<view class="title"><span class="red">*</span>开始日期</view>
<picker mode="date" @change="bxmxksrq($event,index)" >
<view class="picker">
{{item.ksrq||"请选择"}}
</view>
</picker>
</view>
<view class="cu-form-group ">
<view class="title"><span class="red">*</span>结束日期</view>
<picker mode="date" @change="bxmxjsrq($event,index)" >
<view class="picker">
{{item.jsrq||"请选择"}}
</view>
</picker>
</view>
<view class="cu-form-group align-start" style="border-bottom:0.5px solid #EEEEEE;">
<view class="title"><span class="red">*</span>备注</view>
<textarea v-model="item.bz" maxlength="-1" :disabled="modalName!=null"
placeholder="请输入备注"></textarea>
</view>
</view>
<view class="padding">
<button class="cu-btn block line-blue lg" @tap="addbxmxlist">
<text class="cuIcon-add"></text>新增明细</button>
</view>
<!-- 新增按钮 -->
<!-- 总报销金额 -->
<!-- <view style="border-bottom: 5px solid #eee;padding-bottom: 10px;">
<view class="action"
style="padding-top: 5px;padding-bottom: 5px;padding-left: 20px;background-color: #EEEEEE;">
</text>总报销金额(元):{{zbxje}}
</view>
<view class="cu-form-group margin-top">
<view class="title">添加图片</view>
</view>
<uni-file-picker style="margin-left: 10px;" ref="img" :auto-upload="false" v-model="imageValue"
fileMediatype="image" mode="grid" @select="tpselect" @progress="tpprogress" @success="tpsuccess"
@fail="tpfail" @delete="tpdel" />
</view> -->
<!-- <view class="cu-form-group">
<view class="title">添加附件</view>
</view>
<uni-file-picker style="margin-left: 10px;padding-bottom: 10px;" ref="files" :auto-upload="false"
v-model="filesValue" fileMediatype="file" mode="grid" @select="tpselect" @progress="tpprogress"
@success="tpsuccess" @fail="tpfail" @delete="tpdel" />
<view class="cu-form-group" style="border-top: 5px solid #eee;padding-top: 10px;padding-bottom: 10px;">
<view class="title">添加审批人</view>
<view class="title"><button class="cu-btn block line-blue " @tap=getspr>
<text class="cuIcon-add"></text></button></view>
</view> -->
<!-- <view class="cu-form-group" style="-webkit-box-pack:unset;justify-content: left;">
<view style="position: relative;" v-for="(item,index) in sprlist" :key="index">
<view class="cu-avatar round lg margin-xs bg-red">
<text class="avatar-text">{{item.name}}</text>
</view>
<view @tap=delspr(index) class="cu-avatar round lg margin-xs bg-grey"
style="height: 15px;width: 15px;position: absolute;top: 0px;right: 0px;">
<text class="avatar-text">X</text>
</view>
</view>
</view> -->
<view class="padding-xl" style="border: 0.5 solid #EEEEEE;">
<button class="cu-btn block bg-blue margin-tb-sm lg" @tap="apiscbxdd()">
</text>提交</button>
</view>
</view>
</view>
<!-- 确认模态框 -->
<view class="cu-modal" :class="modalName=='DialogModal1'?'show':''">
<view class="cu-dialog">
<view class="cu-bar bg-white justify-end">
<view class="content">提示</view>
<view class="action" @tap="hideModal">
<text class="cuIcon-close text-red"></text>
</view>
</view>
<view class="padding-xl bg-white">
是否撤销该请假请求?
</view>
<view class="cu-bar bg-white justify-end">
<view class="action">
<button class="cu-btn line-green text-green" @tap="hideModal">取消</button>
<button class="cu-btn bg-green margin-left" @tap="apicxsjsc()">确定</button>
</view>
</view>
</view>
</view>
<view v-if="TabCur==1" class="">
<!-- 一般用法 -->
<!-- <view class="cu-bar bg-white search" style="border-bottom: 0.5px solid #EEEEEE;" >
<view class="search-form round">
<text class="cuIcon-search"></text>
<input type="text" v-model="searchKey" placeholder="输入搜索的关键词" confirm-type="search" ></input>
</view>
<view class="action">
<button class="cu-btn bg-gradual-blue shadow-blur" @tap="searchtap()" >搜索</button>
</view>
</view> -->
<view class="cu-bar bg-white search" >
<view class="example-body">
<uni-search-bar placeholder="请输入用户ID查询" @input="searchinput"></uni-search-bar>
</view>
<view class="action" style="margin-right: 8px;">
<text class="cu-btn round search-btn" @tap="showModal" data-target="bottomModal">
<text class="cuIcon-filter"></text>筛选</text>
</view>
</view>
<view class="cu-list menu-avatar comment">
<view class="cu-item" v-for="(item,index) in showlist" :key="index" :data-id="index" style="padding:15px;" @tap="getxxxx(item)">
<view class="content">
<view class="margin-top-sm flex justify-between">
<view class="" style="font-size: 15px!important;color: #000000;">{{item.bxrmc}}提交的报销请求</view>
<view>
<text style="font-size: 12px!important;" class="text-gray margin-left-sm text-sm">{{timestampToTime(item.bxrq)}}</text>
</view>
</view>
<view class="text-gray text-content text-sm">
<text style="font-size: 12px!important;">报销单号:</text>
<text style="font-size: 12px!important;">{{item.fybxid}}</text>
</view>
<view class="text-gray text-content text-sm">
<text style="font-size: 12px!important;">开始时间:</text>
<text style="font-size: 12px!important;">{{timestampToTime(item.ksrq)}}</text>
</view>
<view class="text-gray text-content text-sm">
<text style="font-size: 12px!important;">结束时间:</text>
<text style="font-size: 12px!important;">{{timestampToTime(item.jsrq)}}</text>
</view>
<view class="text-gray text-content text-sm">
<text style="font-size: 12px!important;">报销金额:</text>
<text style="font-size: 12px!important;">{{item.bxje}}</text>
</view>
<view class="margin-top-xs flex justify-between">
<view class="text-yellow text-sm">{{item.zt|ztTrans(item.zt)}}</view>
<view>
<text class="margin-left-sm text-sm text-blue" v-if="item.zt=='I'&&item.bxrmc==username" @tap.stop.prevent="confirm(item)" >撤销</text>
</view>
</view>
</view>
</view>
</view>
</view>
<view class="cu-modal bottom-modal" :class="modalName=='bottomModal'?'show':''">
<view class="cu-dialog">
<view class="cu-bar bg-white cu-dialog-title">
<view class="action cu-dialog-back">
<text class="cuIcon-unfold" @tap="hideModal"></text>
</view>
<text>筛选</text>
</view>
<view class="cu-bar bg-white margin-top">
<view class="action">
<text class="text12">报销类型</text>
</view>
</view>
<view class="cu-list grid col-3">
<view class="cu-item" v-for="(item,index) in lxList" :key="index" @tap="tabSelectbxlx" :data-id="index">
<button :class="index==selectBxlx?'active-select cur':''">{{item.text}}</button>
</view>
</view>
<view class="cu-bar bg-white margin-top">
<view class="action">
<text class="text12">状态</text>
</view>
</view>
<view class="cu-list grid col-3">
<view class="cu-item" v-for="(item,index) in spList" :key="index" @tap="tabSelectStatus" :data-id="index">
<button :class="index==selectStatus?'active-select cur':''">{{item.text}}</button>
</view>
</view>
<view class="cu-bar bg-white margin-top">
<view class="action">
<text class="">事务类型</text>
</view>
</view>
<scroll-view scroll-y="true" style="height: 106px;">
<view class="cu-list grid col-2">
<view class="cu-item" v-for="(item,index) in formList" :key="index" @tap="tabSelectselectForm" :data-id="index">
<button :class="index==selectForm?'active-select cur':''">{{item.text}}</button>
</view>
</view>
</scroll-view>
<view class="cu-bar bg-white cu-dialog-footer">
<button class=" " @tap="resetModal">重置</button>
<button class="text-blue active" @tap="modalSearch">确定</button>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
const tabs = [{
title: '发起提交',
value: 0
}, {
title: '查看数据',
value: 1
}];
import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js";
export default {
mixins: [MescrollMixin], // 使用mixin
onReachBottom(e) {
this.pageNo++
this.apigetqjlist()
},
onLoad() {
let that=this
uni.getStorage({
key: 'username',
success: function (res) {
console.log(res.data);
that.username=res.data
console.log(that.username)
}
});
this.apigetbxr()
this.apigetxmlist()
},
data() {
return {
username:"",
selectBxlx:"",
bxlxurl:"/fybx/fybx/8ad0327e6b8c7b8a016b8cb3803a0012/query",
bxlx:{name:""},
bxlxlist:[{name:"差旅费报销"},{name:"日常报销"},{name:"公司报销"}],
swlx:"A",
wfpid:"",
selectForm:"",
selectStatus:"",
navList:[
{id:0,title:"待办事务"},
{id:1,title:"我的事务"}
],
lxList:[
{id:"/fybx/fybx/8ad0327e6b8c7b8a016b8cb3803a0012/query",text:"差旅报销"},
{id:"/fybx/fybx/8ad0327e6c426f83016c42701ebc0005/query",text:"日常报销"},
{id:"/fybx/fybx/8ad0327e6c6ee3cc016c6ee4be480001/query",text:"公司报销"},
],
spList:[
{id:"",text:"全部"},
{id:"0000",text:"提出"},
{id:"0010",text:"审批"},
{id:"0020",text:"支付"},
{id:"0030",text:"财务审核"},
{id:"0040",text:"确认收款"},
{id:"9999",text:"结束"},
],
formList:[
{id:"A",text:"全部"},{id:"W",text:"未处理"},
{id:"H",text:"已处理"}
],
delinfor:"",
// 提交基础url
TJBASE:"",
// 项目列表
xmlist:[],
// 费用项目
fyxmlist:[],
// 报销是由
bxsy:"",
// 结束日期
jsrq:"",
// 开始日期
ksrq:"",
//报销日期
bxrq:"",
// 费用使用人
fysyr:"",
// 报销人
bxr:[],
// 报销人数组
bxrlist:[],
searchKey:"",
pageNo:1,
bxlist:[],
showlist:[],
modalName: null,
imgarry: [],
allsprlist: [{
name: "张三",
infor: "测试"
},
{
name: "李四",
infor: "测试"
}
],
sprlist: [
],
cksj: [{
bxr: "anger",
bxrq: "2021.01",
zt: "处理中",
bxdh: "1213800439",
bxzje: "1000"
},
{
bxr: "anger",
bxrq: "2021.01",
zt: "处理中",
bxdh: "1213800439",
bxzje: "1000"
}
],
imageValue: [
],
filesValue: [
],
bxmxlist: [],
tabs,
TabCur: 0,
scrollLeft: 0,
NavBarColor: this.NavBarColor,
upOption: {
page: {
num: 0, // 当前页码,默认0,回调之前会加1,即callback(page)会从1开始
size: 10 // 每页数据的数量
},
noMoreSize: 4, //如果列表已无数据,可设置列表的总数量要大于半页才显示无更多数据;避免列表数据过少(比如只有一条数据),显示无更多数据会不好看; 默认5
empty: {
tip: '~ 暂无数据 ~', // 提示
},
loading: '',
text: '全部',
isShowNoMore: false,
textNoMore: '我是有底线的 >_<'
},
msgList: [], //列表数据
read: "all",
announcement1: [],
msg1Count: "",
msg1Title: "",
announcement2: [],
msg2Count: "",
msg2Title: "",
url: "/sys/sysAnnouncementSend/getMyAnnouncementSend",
delUrl: '/sys/sysAnnouncementSend/delete',
listTouchStart: 0,
listTouchDirection: null,
}
},
onShow() {},
filters: {
ztTrans: function(a) {
const ztList = {"S": "审批", "I":"提出","F":"支付",3:"撤回",4:"转交",5:"调度"};
return ztList[a]
},
},
computed: {
zfpje(){
let num = 0
this.bxmxlist.forEach((e) => {
if (e.fpje) {
num = num + parseFloat(e.fpje)
}
})
return num
},
zbxje() {
let num = 0
this.bxmxlist.forEach((e) => {
if (e.bxje) {
num = num + parseFloat(e.bxje)
}
})
return num
},
top() {
return this.CustomBar * 2 + 95
},
style() {
var StatusBar = this.StatusBar;
var CustomBar = this.CustomBar;
var style = `height:${CustomBar}px;padding-top:${StatusBar}px;`;
return style
},
},
methods: {
resetModal(e){
this.selectBxlx=""
this.bxlxurl="/fybx/fybx/8ad0327e6b8c7b8a016b8cb3803a0012/query"
this.selectStatus=0
this.selectForm=0
this.swlx="A"
this.wfpid=""
},
searchinput(e){
this.searchKey=e
this.searchtap()
},
modalSearch(){
this.searchtap()
this.hideModal()
},
showModal(e) {
this.modalName = e.currentTarget.dataset.target
},
tabSelectselectForm(e){
this.selectForm=e.currentTarget.dataset.id
this.swlx= this.formList[e.currentTarget.dataset.id].id;
},
tabSelectbxlx(e){
this.selectBxlx=e.currentTarget.dataset.id
this.bxlxurl =this.lxList[e.currentTarget.dataset.id].id;
console.log(this.bxlxurl)
},
tabSelectStatus(e){
this.selectStatus=e.currentTarget.dataset.id
this.wfpid =this.spList[e.currentTarget.dataset.id].id;
},
confirm(e){
this.delinfor=e
this.modalName="DialogModal1"
},
// 查看数据删除
apicxsjsc(){
let that=this
let BASEURL=this.delinfor.fyflid
let url="fybx/fybx/"+BASEURL+"/batch/delete"
this.$http.post(url,{
master:[{
id:this.delinfor.id,
fybxid:this.delinfor.fybxid
}
]
}).then(res=>{
if(res.data.success){
that.$tip.toast("删除成功");
this.hideModal()
that.searchtap()
}else{
that.$tip.toast(res.data.message||"费用项目获取失败");
this.hideModal()
}
});
},
// 生成报销订单
apiscbxdd(){
console.log(this.fyxmlist)
let isPost=true
let that=this
let details=[{}]
details[0].id="FYBXMX"
details[0].records=this.bxmxlist
details[0].records.forEach((e,index)=>{
e.kssj=e.ksrq
e.jssj=e.jsrq
})
let master={}
master.bxje=this.zbxje
master.bxrid=this.bxr.USERS_USERID
master.bxrmc=this.bxr.USERS_USERNAME
master.bxrq=new Date(this.bxrq).getTime()
master.bxsy=this.bxsy
master.fpje=this.zfpje
master.fyflid=this.TJBASE
master.fysyr=this.fysyr
master.jsrq=new Date(this.jsrq).getTime()
master.ksrq=new Date(this.ksrq).getTime()
master.zfje=""
master.zt=""
console.log(details[0].records)
if(!master.bxje||!master.bxrid||!master.bxrq||!master.fpje||!master.jsrq||!master.ksrq){
that.$tip.toast("请补充报销信息");
isPost=false
}
details[0].records.forEach((e,index)=>{
if(!e.fpje||!e.bxje||!e.kssj||!e.jssj){
that.$tip.toast("请补充报销信息");
isPost=false
}
})
let url="fybx/fybx/"+this.TJBASE+"/add"
if(isPost){
this.$http.post(url,{details:details,master:master}).then(res=>{
if(res.data.success){
that.$tip.toast("报销单添加成功");
that.$Router.push({
path: '/pages/common/fybx', query:{
},
})
}else{
that.$tip.toast(res.data.message||"费用项目获取失败");
}
});
}
},
// 报销明细结束时间
bxmxjsrq(e,index){
this.bxmxlist[index].jsrq=e.detail.value
},
// 报销明细开始时间
bxmxksrq(e,index){
this.bxmxlist[index].ksrq=e.detail.value
},
getxm(e,index){
this.bxmxlist[index].xm=this.xmlist[e.detail.value]
this.bxmxlist[index].xmid=this.xmlist[e.detail.value].code
},
// 获取项目列表
apigetxmlist(){
let that=this
this.$http.post("xmgl/gcxm/queryUsedGcxm",{}).then(res=>{
if(res.data.success){
that.xmlist=res.data.data.records
}else{
that.$tip.toast(res.data.message||"费用项目获取失败");
}
});
},
getbxlx(e){
this.bxlx=this.bxlxlist[e.detail.value]
if(this.bxlx.name=="差旅费报销")
{
this.apigetfyxmlist()
}else if(this.bxlx.name=="日常报销"){
this.apigetfyxmlist1()
}else if(this.bxlx.name=="公司报销"){
this.apigetfyxmlist2()
}
},
// 获取费用明细
getfyxm(e,index){
this.bxmxlist[index].fyxm=this.fyxmlist[e.detail.value]
this.bxmxlist[index].xh=this.fyxmlist[e.detail.value].xh
this.bxmxlist[index].fyxmid=this.fyxmlist[e.detail.value].fyxmid
this.TJBASE=this.fyxmlist[e.detail.value].mid
},
// 获取费用项目
apigetfyxmlist(){
let that=this
this.$http.post("fybx/fyflmx/query",{mid:"8ad0327e6b8c7b8a016b8cb3803a0012"}).then(res=>{
if(res.data.success){
that.fyxmlist=res.data.data.records
}else{
that.$tip.toast(res.data.message||"费用项目获取失败");
}
});
},
// 获取费用项目1
apigetfyxmlist1(){
let that=this
this.$http.post("fybx/fyflmx/query",{mid: "8ad0327e6c426f83016c42701ebc0005"}).then(res=>{
if(res.data.success){
that.fyxmlist=res.data.data.records
}else{
that.$tip.toast(res.data.message||"费用项目获取失败");
}
});
},
// 获取费用项目2
apigetfyxmlist2(){
let that=this
this.$http.post("fybx/fyflmx/query",{mid: "8ad0327e6c6ee3cc016c6ee4be480001"}).then(res=>{
if(res.data.success){
that.fyxmlist=res.data.data.records
}else{
that.$tip.toast(res.data.message||"费用项目获取失败");
}
});
},
// 获得结束日期
getjsrq(e){
this.jsrq=e.detail.value
},
// 获得开始日期
getksrq(e){
this.ksrq=e.detail.value
},
// 获取报销日期
getbxrq(e){
this.bxrq=e.detail.value
},
// 获取报销人
getbxr(e){
let index=e.detail.value
this.bxr=this.bxrlist[index]
},
// 获取报销人列表
apigetbxr(){
let that=this
this.$http.post("kzzx/fzsr/select",{id: "402881826c23e82d016c23ec00e80004"}).then(res=>{
if(res.data.success){
that.bxrlist=res.data.data.records
}else{
that.$tip.toast(res.data.message||"获取报销人列表失败");
}
});
},
searchtap(){
this.pageNo=1
this.showlist=[]
this.apigetqjlist()
},
timestampToTime(timestamp){
let date = new Date(timestamp);
  var YY = date.getFullYear() + '-';
  var MM = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
  var DD = (date.getDate() < 10 ? '0' + (date.getDate()) : date.getDate());
  var hh = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
  var mm = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()) + ':';
  var ss = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
  return YY + MM + DD ;
},
// 费用报销请求列表
apigetqjlist(){
let that=this
this.$http.post(this.bxlxurl,{"swlx":this.swlx,"wfpid":this.wfpid,"bxdh": "","bxr":this.searchKey,"pageNo": this.pageNo,"pageSize": 20}).then(res=>{
if(res.data.success){
that.bxlist=res.data.data.records
that.bxlist.forEach(e=>{
that.showlist.push(e)
})
console.log(that.bxlist)
}else{
console.log("请求失败")
}
});
},
// 删除明细
scmx(index){
this.bxmxlist.splice(index, 1)
},
// 添加审批人
addsprlist(e) {
this.sprlist.push(e)
this.modalName = null
},
hideModal(e) {
this.modalName = null
},
// 跳转获取审批人信息
getspr() {
this.modalName = "DrawerModalR"
// this.$Router.push({
// path: '/pages/addressbook/selectspr', query:{
// allinfor:{
// imgarry:this.imgarry,
// imageValue:this.imageValue
// }
// },
// })
},
// 删除审批人
delspr(index) {
this.sprlist.splice(index, 1)
},
// 上传文件
upload(name, fileUrl) {
let that = this;
uni.uploadFile({
url: 'https://jsonplaceholder.typicode.com/posts/',
filePath: fileUrl,
name: 'file',
header: {
"Content-Type": "multipart/form-data",
},
formData: {
// "api_token": that.api_token,
},
success: res => {
console.log(res)
// let url = JSON.parse(res.data).data.url;
// let size = JSON.parse(res.data).data.size;
// let suffix = JSON.parse(res.data).data.ext;
}
})
},
// 数据单详情
getxxxx(e) {
this.$Router.push({
path: '/pages/common/fybxxq',
query: {
infor: e
},
})
},
// 提交按钮
allsubmit() {
this.$http.post("crm/xdfs/add", {master:{bz:123,code:123,name:123},detail:{}}).then(res => {
if (res.data.success) {
console.log(res)
} else {
console.log(res)
}
});
this.imgarry.forEach(e => {
this.upload(e.tempFiles[0].name, e.tempFiles[0].path)
})
this.TabCur=1
},
// 获取上传状态
tpdel(f) {
console.log(f)
this.imgarry.forEach((e, index) => {
if (f.tempFile.path == e.tempFiles[0].path) {
this.imgarry.splice(index, 1)
}
})
console.log(this.imgarry)
},
tpselect(e) {
this.imgarry.push(e)
console.log(this.imgarry)
},
// 获取上传进度
tpprogress(e) {
console.log('上传进度:', e)
},
// 上传成功
tpsuccess(e) {
console.log('上传成功')
},
// 上传失败
tpfail(e) {
console.log('上传失败:', e)
},
addbxmxlist() {
if(!this.bxlx.name){
this.$tip.toast("请先填写报销类型");
return false
}
let addobj = {
bz:"",
ksrq:"",
jsrq:"",
zf03:"",
zf02:"",
zf01:"",
fpje:"",
bxje:"",
xm:"",
fyxm:"",
bxje: "",
bxlb: "",
fxmx: "",
}
this.bxmxlist.push(addobj)
console.log(this.bxmxlist)
},
// unique(arr) {
// var obj = {};
// return arr.filter(function(item, index, arr){
// return obj.hasOwnProperty(typeof item + item) ? false : (obj[typeof item + item] = true)
// })
// },
upCallback(page) {
//联网加载数据
console.log("tabindex", this.TabCur)
let keyword = this.TabCur
if (keyword == 0) {
this.$http.get(this.url, {
params: {
pageNo: page.num,
pageSize: page.size,
msgCategory: '1'
}
}).then(res => {
//联网成功的回调,隐藏下拉刷新和上拉加载的状态;
this.announcement1 = res.data.result.records
this.mescroll.endSuccess(this.announcement1.length);
//console.log("url", res)
//设置列表数据
if (res.data.success) {
console.log("res", res.data)
this.msg1Count = res.data.result.total
this.msg1Title = "通知(" + res.data.result.total + ")";
for (let annItem of this.announcement1) {
this.msgList.push(annItem)
}
}
if (page.num == 1) {
this.msgList = []; //如果是第一页需手动制空列表
this.msgList = this.msgList.concat(this.announcement1); //追加新数据
}
}).catch(() => {
//联网失败, 结束加载
this.mescroll.endErr();
})
}
if (keyword == 1) {
this.$http.get(this.url, {
params: {
pageNo: page.num,
pageSize: page.size,
msgCategory: '2'
}
}).then(res => {
//联网成功的回调,隐藏下拉刷新和上拉加载的状态;
this.announcement2 = res.data.result.records
this.mescroll.endSuccess(this.announcement2.length, this.msgCount);
//设置列表数据
if (res.data.success) {
console.log("res sys", res.data)
this.msg2Count = res.data.result.total
this.msg2Title = "通知(" + res.data.result.total + ")";
// this.announcement2.filter((item,index) => {
// // console.log("item",item)
// if(item.anntId == this.announcement2[index+1].anntId){
// this.announcement2.splice(item,1)
for (let item of this.announcement2) {
this.msgList.push(item)
}
// }
// })
}
if (page.num == 1) {
this.msgList = []; //如果是第一页需手动制空列表
this.msgList = this.msgList.concat(this.announcement2); //追加新数据
}
}).catch(() => {
//联网失败, 结束加载
this.mescroll.endErr();
})
}
},
tabSelect(e) {
this.TabCur = e.currentTarget.dataset.id;
if(this.TabCur==1){
this.searchtap()
}
this.scrollLeft = (e.currentTarget.dataset.id - 1) * 60;
this.msgList = [] // 先置空列表,显示加载进度
},
goAnnotationDetail(item) {
//item.readFlag = '1'
this.mescroll.resetUpScroll()
if (item.openType == "component" && item.openPage.indexOf('email') >= 0) {
this.goEmailDetailPage(item)
} else {
// console.log("detail",encodeURIComponent(JSON.stringify(item)))
uni.navigateTo({
url: '/pages/annotation/annotationDetail?item=' + encodeURIComponent(JSON.stringify(item))
});
}
},
isEmail(item) {
if (item.openType == "component" && item.openPage.indexOf('email') >= 0) {
return true;
} else {
return false;
}
},
goEmailDetailPage(item) {
console.log("go", item.anntId)
console.log("item", item)
if (item.readFlag == '0') {
//item.readFlag = '1'
this.mescroll.resetUpScroll()
let readUrl = '/sys/sysAnnouncementSend/editByAnntIdAndUserId';
this.$http.put(readUrl, {
anntId: item.anntId
})
}
// console.log("goe",item.busId)
uni.navigateTo({
url: '/pages/mail/mailDetail?id=' + item.busId
});
},
ListTouchStart(e) {
this.listTouchStart = e.touches[0].pageX
},
// ListTouch计算方向
ListTouchMove(e) {
this.listTouchDirection = e.touches[0].pageX - this.listTouchStart > 0 ? 'right' : 'left'
},
// ListTouch计算滚动
ListTouchEnd(e) {
if (this.listTouchDirection == 'left') {
this.modalName = e.currentTarget.dataset.target
} else {
this.modalName = null
}
this.listTouchDirection = null
},
deleteAnnotation(item) {
this.$http.delete(this.delUrl + '?id=' + item.id).then(res => {
console.log("结果数据9", res)
if (res.data.success) {
this.mescroll.resetUpScroll()
}
}).catch(e => {
console.log("al delUrl请求错误2", e)
this.mescroll.endErr();
})
},
formatDate(text, len) {
if (!text || text.length == 0) {
return ''
}
if (text.length < len) {
return text;
}
return text.substr(0, len)
},
titleFilter(text, len) {
if (!text || text.length == 0) {
return ''
}
if (text.length < len) {
return text;
}
return text.substr(0, len) + "..."
}
}
}
</script>
<style scoped>
* {
font-size: 14px !important;
}
.uni-card__head-padding {
background-color: #007AFF !important;
color: #FFFFFF;
}
.red {
color: red;
}
.e-btn {
margin-bottom: 1rem;
}
.titlePad {
margin-top: 0.6rem;
}
.cu-list>.move-cur {
transform: translateX(-150rpx);
}
.nav .cu-item.cur {
position: flex;
z-index: 9;
border-bottom: 4upx solid;
}
.bordp {
padding-bottom: 10px;
border-bottom: 5px solid #EEEEEE;
}
.bordb {
padding-top: 10px;
border-top: 5px solid #EEEEEE;
}
/* 头条小程序组件内不能引入字体 */
/* #ifdef MP-TOUTIAO */
@font-face {
font-family: uniicons;
font-weight: normal;
font-style: normal;
src: url('~@/static/uni.ttf') format('truetype');
}
/* #endif */
/* #ifndef APP-NVUE */
page {
display: flex;
flex-direction: column;
box-sizing: border-box;
background-color: #efeff4;
min-height: 100%;
height: auto;
}
view {
line-height: inherit;
}
.example {
padding: 0 15px 15px;
}
.example-info {
padding: 15px;
color: #3b4144;
background: #ffffff;
}
.example-body {
width: 100%;
flex-direction: row;
flex-wrap: wrap;
justify-content: center;
padding: 0;
font-size: 14px;
background-color: #ffffff;
}
/* #endif */
.example {
padding: 0 15px;
}
.example-info {
/* #ifndef APP-NVUE */
display: block;
/* #endif */
padding: 15px;
color: #3b4144;
background-color: #ffffff;
font-size: 14px;
line-height: 20px;
}
.example-info-text {
font-size: 14px;
line-height: 20px;
color: #3b4144;
}
.example-body {
flex-direction: column;
padding: 15px;
background-color: #ffffff;
}
.word-btn-white {
font-size: 18px;
color: #FFFFFF;
}
.word-btn {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: row;
align-items: center;
justify-content: center;
border-radius: 6px;
height: 48px;
margin: 15px;
background-color: #007AFF;
}
.word-btn--hover {
background-color: #4ca2ff;
}
.search-result {
margin-top: 10px;
margin-bottom: 20px;
text-align: center;
}
.search-result-text {
text-align: center;
font-size: 14px;
}
.example-body {
/* #ifndef APP-NVUE */
display: block;
/* #endif */
padding: 0px;
}
.search-btn{
font-size: 12px;
width: 54px;
background-color: white;
border: 1px solid lightgray;
padding: 0;
}
.bottom-modal uni-button{
font-size: 12px;
color: #555555;
background: white;
}
.bottom-modal .active-select{
color: white;
background-color: #0081FF;
}
.bottom-modal .cu-list.grid>.cu-item{
padding: 10upx 20px;
}
.bottom-modal .cu-list.grid>.cu-item>uni-button{
width: 100%;
}
.cu-dialog-footer button{
padding: 0 40px;
font-size: 14px;
}
.cu-dialog-footer button:last-child{
color: white;
background-color: #007AFF;
}
.process-page .cu-list.menu-avatar.comment>.cu-item{
padding: 15px;
}
.process-page .text-sm{
font-size: 12px;
}
</style>
<template>
<view class="bg-white" >
<cu-custom bgColor="bg-white" isBack="true" >
<slot slot="backText">返回</slot>
</cu-custom>
<view class="container">
<view class="cu-card article " style="padding-bottom: 0px;">
<view class="cu-item shadow" style="padding-bottom: 0px;">
<view class="title flex justify-between" style="height: 25px;">
<view class="text-cut" style="font-size: 16px!important;line-height: 22px;">{{spinfor.bxrmc||""}}{{spinfor.action|ztTrans}}{{spinfor.flmc||""}}</view>
</view>
<view class="content">
<view class="desc">
<view class="text-content" style="height: 50px;">
<view>苏州格物信息技术有限公司</view>
<view style="color:#E8A54C;">{{spinfor.zt|TztTrans(spinfor.zt)}}</view>
</view>
</view>
</view>
</view>
</view>
<!-- <view class="cu-form-group">
<view class="title"><span class="red"> </span>报销单号</view>
<input v-model="bxdh" placeholder="" name="input" ></input>
</view> -->
<view v-if="TabCur==0" class="margin-top">
<view >
<!-- 总报销 -->
<view >
<view class="action"
style="padding-top: 5px;padding-bottom: 5px;padding-left: 20px;background-color: #EEEEEE;">
报销信息
</view>
<view class="cu-form-group">
<view class="title"><span class="red">*</span>报销人</view>
<input name="input" >{{bxxxinfo.bxrmc}}</input>
</view>
<view class="cu-form-group">
<view class="title"><span class="red">*</span>费用使用人</view>
<input name="input" >{{bxxxinfo.fysyr}}</input>
</view>
<view class="cu-form-group ">
<view class="title"><span class="red">*</span>报销日期</view>
<input name="input" >{{timestampToTime(bxxxinfo.bxrq)}}</input>
</view>
<view class="cu-form-group ">
<view class="title"><span class="red">*</span>开始日期</view>
<input name="input" >{{timestampToTime(bxxxinfo.ksrq)}}</input>
</view>
<view class="cu-form-group ">
<view class="title"><span class="red">*</span>结束日期</view>
<input name="input" >{{timestampToTime(bxxxinfo.jsrq)}}</input>
</view>
<view class="cu-form-group align-start" style="border-bottom:0.5px solid #EEEEEE;">
<view class="title"><span class="red">*</span>报销事由</view>
<textarea maxlength="-1" :disabled="modalName!=null"
v-model="bxxxinfo.bxsy"
placeholder="请输入费用明细"></textarea>
</view>
</view>
<!-- 增加报销明细 -->
<view v-for="(item,index) in bxxxmxinfo">
<view class="action flex justify-between"
style="padding-top: 5px;padding-bottom: 5px;padding-left: 20px;background-color: #EEEEEE;">
<view>
报销明细{{index+1}}
</view>
</view>
<view class="cu-form-group">
<view class="title"><span class="red">*</span>费用项目</view>
<input name="input" >{{item.xmmc}}</input>
</view>
<view class="cu-form-group">
<view class="title"><span class="red">*</span>项目</view>
<input name="input" >{{item.name}}</input>
</view>
<view class="cu-form-group">
<view class="title"><span class="red">*</span>报销金额</view>
<input type="number" name="input" >{{item.bxje}}</input>
</view>
<view class="cu-form-group">
<view class="title"><span class="red">*</span>发票金额</view>
<input type="number" name="input" >{{item.fpje}}</input>
</view>
<view class="cu-form-group">
<view class="title"><span class="red">*</span>出发地</view>
<input name="input" >{{item.zf01}}</input>
</view>
<view class="cu-form-group">
<view class="title"><span class="red">*</span>到达地</view>
<input name="input" >{{item.zf02}}</input>
</view>
<view class="cu-form-group">
<view class="title"><span class="red">*</span>交通方式</view>
<input name="input" >{{item.zf03}}</input>
</view>
<view class="cu-form-group ">
<view class="title"><span class="red">*</span>开始日期</view>
<input name="input" >{{timestampToTime(item.kssj)}}</input>
</view>
<view class="cu-form-group ">
<view class="title"><span class="red">*</span>结束日期</view>
<input name="input" >{{timestampToTime(item.jssj)}}</input>
</view>
<view class="cu-form-group align-start" style="border-bottom:0.5px solid #EEEEEE;">
<view class="title"><span class="red">*</span>备注</view>
<textarea maxlength="-1" :disabled="modalName!=null" v-model="item.bz"
></textarea>
</view>
</view>
<!-- 提交模态框 -->
<view class="cu-modal drawer-modal justify-end" :class="modalName=='DrawerModalR'?'show':''" @tap="hideModal">
<view class="cu-dialog basis-lg" style="overflow: auto;" @tap.stop=""
:style="[{top:CustomBar+'px',height:'calc(100vh - ' + CustomBar + 'px)'}]">
<view class="cu-bar bg-white solid-bottom margin-top">
<view class="action">
<span class="red"></span> 审批人
</view>
</view>
<view class="cu-form-group" style="-webkit-box-pack:unset;justify-content: left;">
<view style="position: relative;" v-for="(item,index) in tjsprlist" :key="index">
<view class="cu-avatar round lg margin-xs bg-red">
<text class="avatar-text">{{item.name}}</text>
</view>
<view v-if="item.selected!='Y'" @tap=delspr(index) class="cu-avatar round lg margin-xs bg-grey "
style="height: 15px;width: 15px;position: absolute;top: 0px;right: 0px;">
<text class="avatar-text">X</text>
</view>
</view>
</view>
<view class="cu-list menu-avatar">
<view class="cu-form-group align-start" style="border-bottom:0.5px solid #EEEEEE;">
<view class="title"><span class="red"></span>处理意见</view>
<textarea maxlength="-1" v-model="tjfybxclyj"
></textarea>
</view>
</view>
<view class="padding-xl">
<button @tap="apitjfybx" class="cu-btn block bg-blue margin-tb-sm lg">
提交</button>
</view>
</view>
</view>
<!-- 确认模态框 -->
<view class="cu-modal" :class="modalName=='qjchehui'?'show':''">
<view class="cu-dialog">
<view class="cu-bar bg-white justify-end">
<view class="content">提示</view>
<view class="action" @tap="hideModal">
<text class="cuIcon-close text-red"></text>
</view>
</view>
<view class="padding-xl bg-white">
是否删除该请假请求?
</view>
<view class="cu-bar bg-white justify-end">
<view class="action">
<button class="cu-btn line-green text-green" @tap="hideModal">取消</button>
<button class="cu-btn bg-green margin-left" @tap="apidelfybx">确定</button>
</view>
</view>
</view>
</view>
<!-- -->
<!-- 报销退回 -->
<view class="cu-modal" :class="modalName=='bxtuihui'?'show':''">
<view class="cu-dialog">
<view class="cu-bar bg-white justify-end">
<view class="content">提示</view>
<view class="action" @tap="hideModal">
<text class="cuIcon-close text-red"></text>
</view>
</view>
<view class="padding-xl bg-white">
是否退回该报销请求?
</view>
<view class="cu-bar bg-white justify-end">
<view class="action">
<button class="cu-btn line-green text-green" @tap="hideModal">取消</button>
<button class="cu-btn bg-green margin-left" @tap="apibxth">确定</button>
</view>
</view>
</view>
</view>
<!-- 请假转交模态框 -->
<view class="cu-modal drawer-modal justify-end" :class="modalName=='DrawerModalRbxzj'?'show':''" @tap="hideModal">
<view class="cu-dialog basis-lg" style="overflow: auto;" @tap.stop=""
:style="[{top:CustomBar+'px',height:'calc(100vh - ' + CustomBar + 'px)'}]">
<view class="cu-bar bg-white solid-bottom margin-top">
<view class="action">
<span class="red"></span> 可选审批人
</view>
</view>
<view class="cu-form-group" style="-webkit-box-pack:unset;justify-content: left;overflow: auto;">
<view style="position: relative;" v-for="(item,index) in bxzjsprlist" :key="index">
<view class="cu-avatar round lg margin-xs bg-red" @tap=bxzjspr(item)>
<text class="avatar-text">{{item.name}}</text>
</view>
</view>
</view>
<view class="cu-bar bg-white solid-bottom margin-top">
<view class="action">
<span class="red"></span> 已选审批人
</view>
</view>
<view class="cu-form-group" style="-webkit-box-pack:unset;justify-content: left;overflow: auto;">
<view style="position: relative;" v-for="(item,index) in bxzjsprlistN" :key="index">
<view class="cu-avatar round lg margin-xs bg-red">
<text class="avatar-text">{{item.name}}</text>
</view>
<view v-if="item.mustSelect!='Y'" @tap=delbxzjspr(item,index) class="cu-avatar round lg margin-xs bg-gray "
style="height: 15px;width: 15px;position: absolute;top: 0px;right: 0px;">
<text class="avatar-text">x</text>
</view>
</view>
</view>
<view class="cu-list menu-avatar">
<view class="cu-form-group align-start" style="border-bottom:0.5px solid #EEEEEE;">
<view class="title"><span class="red"></span>处理意见</view>
<textarea maxlength="-1" v-model="zjbxclyj"
></textarea>
</view>
</view>
<view class="padding-xl">
<button @tap="apizjbx" class="cu-btn block bg-blue margin-tb-sm lg">
提交</button>
</view>
</view>
</view>
</view>
<view class="bordb">
<view class="cu-form-group" style="border-top: 10px solid #EEEEEE;">
<view class="title">流程</view>
</view>
<view class="cu-form-group padding-bottom ">
<view >
<view class="cu-timeline " v-for="(item,index) in lc" :key="index">
<view class="cu-time" style="width: 80px;">{{item.nodeName}}</view>
<view class="cu-item text-gray">
<view class="bg-blue content">
<text></text> {{item.actionTime|formatTime(item.actionTime)}}{{item.actionUserName}}{{item.action|ztTrans(item.action)}}
</view>
</view>
</view>
</view>
</view>
</view>
<!-- <view class="bordb">
<view class="cu-form-group" style="border-top: 10px solid #EEEEEE;">
<view class="title">处理</view>
</view>
<view class="cu-form-group padding flex justify-around ">
<view class="" style="" >
<button class="cu-btn round bg-blue" @tap="showR()">提交</button>
</view>
<view class="" style="" >
<button class="cu-btn round bg-blue" @tap="showCh()" >删除</button>
</view>
<view class="" style="">
<button class="cu-btn round bg-blue" @tap="showTh()">退回</button>
</view>
<view class="" style="">
<button class="cu-btn round bg-blue" @tap="showRbxzj()">转交</button>
</view>
<view class="" style="" >
<button class="cu-btn round bg-blue" >编辑</button>
</view>
</view>
</view> -->
</view>
</view>
</view>
</template>
<script>
const tabs = [{title:'发起提交',value:0}, {title:'查看数据',value:1}];
import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js";
import formatTimeToStr from '@/common/util/date.js';
export default {
mixins: [MescrollMixin], // 使用mixin
onLoad(e){
if(e){
this.spinfor=JSON.parse(e.query).infor
this.TabCur="0"
this.urls.fybxgzl=this.urls.fybxgzl+"/"+this.spinfor.wfinstid
this.apiqueryfybx()
this.apifybxgzl()
}
},
filters: {
TztTrans: function(a) {
const ztList = {"S": "审批", "I":"提出","F":"支付",3:"撤回",4:"转交",5:"调度"};
return ztList[a]
},
jqfilters:function(a){
const ztList = {"BJ": "病假", "SJ":"事假","JB":"加班","TS":"调休","QT":"其他"};
return ztList[a]
},
ztTrans: function(a) {
const ztList = {0: "创建", 1:"提交",2:"退回",3:"撤回",4:"转交",5:"调度",8:"待处理"};
return ztList[a]
},
formatTime: function(time) {
if(time!=null&&time!="")
{
var date = new Date(time);
return date.Format("MM-dd hh:mm")
}else{
return "";
}
},
formatDate:function(time){
if(time!=null&&time!="")
{
var date = new Date(time);
return date.Format("yyyy-MM-dd")
}else{
return "";
}
}
},
data() {
return {
// 报销转交数据
zjbxclyj:"",
bxzjsprlistN:[],
bxzjsprdata:"",
bxzjsprlist:[],
// 提交费用报销处理意见
tjfybxclyj:"",
tjsprdata:"",
tjsprlist:"",
bxxxinfo:"",
bxxxmxinfo:"",
modalName:null,
urls:{
fybxgzl:"wf/query/wflog",
qjxx:"kqgl/ygqj/query",
gzxx:"dmg/xmrw/query",
gzxxgzl:"wf/query/wflog",
qjxxgzl:"wf/query/wflog"
},
lc:[],
bxdh:null,
imageValue:[
],
tabs,
TabCur: 0,
scrollLeft: 0,
NavBarColor:this.NavBarColor,
}
},
onShow() {
},
computed:{
zbxje(){
let num=0
this.bxmxlist.forEach((e)=>{
if(e.bxje){
num=num+parseFloat(e.bxje)
}
})
return num
},
top() {
return this.CustomBar * 2 + 95
},
style() {
var StatusBar= this.StatusBar;
var CustomBar= this.CustomBar;
var style = `height:${CustomBar}px;padding-top:${StatusBar}px;`;
return style
},
},
methods: {
// 转交请假
apizjbx(){
let that=this
let nextinfo={
selected: "Y",
comment: this.zjbxclyj,
userList:this.bxzjsprlistN,
}
console.log(nextinfo)
let BASEURL="fybx/fybx/"+this.bxxxinfo.fyflid+"/wftransfer"
this.$http.post(BASEURL,{nextinfo:nextinfo,records:[this.bxxxinfo]}).then(res => {
if (res.data.success) {
that.$tip.toast("提交成功!");
that.$Router.push({
path: '/pages/process/process', query:{
},
})
} else {
this.hideModal()
console.log(res)
that.$tip.toast(res.data.messageArray[0].message||"转交失败");
}
});
},
// 删除报销审批人
delbxzjspr(item,index){
this.bxzjsprlistN.splice(index, 1)
},
// 获取转交审批人
bxzjspr(item){
let noRepeat=true
this.bxzjsprlistN.forEach((e,index)=>{
if(e.id==item.id){
console.log("重复了")
noRepeat=false
}
})
if(noRepeat){
item.selected="Y"
this.bxzjsprlistN.push(item)
}
},
// 报销转交
showRbxzj(){
let that=this
this.bxxxinfo.wfoperate="4"
this.bxxxinfo.sysversion=1
let BASEURL="fybx/fybx/"+this.bxxxinfo.fyflid+"/wfnextinfo"
this.$http.post(BASEURL,this.bxxxinfo).then(res => {
if (res.data.success) {
that.bxzjsprdata=res.data.data.records[0]
that.bxzjsprlist=res.data.data.records[0].userList
this.modalName="DrawerModalRbxzj"
} else {
that.$tip.toast(res.data.message||"获取转交人失败");
}
});
},
// 退回请求
apibxth(){
let that=this
let BASEURL="fybx/fybx/"+this.bxxxinfo.fyflid+"/wfnextinfo"
this.bxxxinfo.wfoperate="2"
this.$http.post(BASEURL,this.bxxxinfo).then(res => {
if (res.data.success) {
that.$tip.toast("退回成功!")
that.$Router.push({
path: '/pages/process/process', query:{
},
})
} else {
that.$tip.toast(res.data.message||"退回失败");
}
});
that.hideModal()
},
// 退回框
showTh(){
this.modalName="bxtuihui"
},
// 费用报销删除请求
apidelfybx(){
let that=this
let BASEURL="fybx/fybx/"+this.bxxxinfo.fyflid+"/batch/delete"
this.$http.post(BASEURL,{master:[{id:this.bxxxinfo.id,fybxid:this.bxxxinfo.fybxid}]}).then(res => {
if (res.data.success) {
that.$tip.toast("删除成功!")
that.$Router.push({
path: '/pages/process/process', query:{
},
})
} else {
that.$tip.toast(res.data.message||"删除失败");
}
});
that.hideModal()
},
// 请假删除框
showCh(){
this.modalName="qjchehui"
},
// 提交fybx信息
apitjfybx(){
let BASE_URL="fybx/fybx/"+this.bxxxinfo.fyflid+"/wfgo"
let that=this
let nextinfo={
selected: "Y",
comment: this.tjfybxclyj,
userList:this.tjsprlist,
}
this.$http.post(BASE_URL,{nextinfo:nextinfo,records:[this.bxxxinfo]}).then(res => {
if (res.data.success) {
that.$tip.toast("提交成功!");
that.$Router.push({
path: '/pages/process/process', query:{
},
})
} else {
that.$tip.toast(res.data.message);
}
});
},
// 删除审批人
delspr(index) {
if(this.tjsprlist[index].mustSelect=="Y"){
this.$tip.toast("必选审批人不可删除");
}else{
this.tjsprlist.splice(index, 1)
}
},
// 提交
showR(){
let that=this
this.bxxxinfo.wfoperate="1"
this.bxxxinfo.sysversion=1
this.$http.post("fybx/fybx/"+this.spinfor.fyflid+"/wfnextinfo",this.bxxxinfo).then(res => {
if (res.data.success) {
console.log(res.data)
that.tjsprdata=res.data.data.records[0]
that.tjsprlist=res.data.data.records[0].userList
this.modalName="DrawerModalR"
} else {
this.$tip.toast(res.data.message||"获取下一步审批人失败!");
}
});
},
timestampToTime(timestamp){
let date = new Date(timestamp);
  var YY = date.getFullYear() + '-';
  var MM = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
  var DD = (date.getDate() < 10 ? '0' + (date.getDate()) : date.getDate());
  var hh = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
  var mm = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()) + ':';
  var ss = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
  return YY + MM + DD ;
},
hideModal(e) {
this.modalName = null
},
// 查询主信息
apiqueryfybx(){
let that=this
this.$http.post("fybx/fybx/"+this.spinfor.fyflid+"/query",{id:this.spinfor.id}).then(res => {
if (res.data.success) {
that.bxxxinfo=res.data.data.records[0]
that.apiqueryfybxmx()
} else {
that.$tip.toast(res.data.message);
}
});
},
// 查询明细
apiqueryfybxmx(){
this.$http.post("fybx/fybxmx/query",{mid:this.bxxxinfo.id}).then(res => {
if (res.data.success) {
this.bxxxmxinfo=res.data.data.records
console.log('this.bxxxinfo')
console.log(this.bxxxinfo)
console.log('this.bxxxmxinfo')
console.log(this.bxxxmxinfo)
} else {
that.$tip.toast(res.data.message);
}
});
},
apifybxgzl(){
this.$http.post(this.urls.fybxgzl).then(res => {
if (res.data.success) {
this.lc=res.data.data.records
} else {
that.$tip.toast(res.data.message);
}
});
},
formatDate(text,len){
if(!text || text.length==0){
return ''
}
if(text.length<len){
return text;
}
return text.substr(0,len)
},
titleFilter(text,len){
if(!text || text.length==0){
return ''
}
if(text.length<len){
return text;
}
return text.substr(0,len)+"..."
}
}
}
</script>
<style scoped>
*{
font-size: 14px!important;
}
.uni-card__head-padding{
background-color: #007AFF!important;
color: #FFFFFF;
}
.red{
color: red;
}
.e-btn{margin-bottom: 1rem;}
.titlePad{margin-top:0.6rem;}
.cu-list>.move-cur{
transform: translateX(-150rpx);
}
.bordb{
padding-bottom: 10px;
border-bottom: 10px solid #EEEEEE;
}
.nav .cu-item.cur {
position: flex;
z-index: 9;
border-bottom: 4upx solid;
}
</style>
<template>
<view class="bg-white">
<cu-custom :bgColor="NavBarColor" :isBack="true" backRouterName="index">
<block slot="backText">返回</block>
<block slot="content">请假</block>
</cu-custom>
<!-- <view class="cu-modal drawer-modal justify-end" :class="modalName=='DrawerModalR'?'show':''" @tap="hideModal">
<view class="cu-dialog basis-lg" style="overflow: auto;" @tap.stop=""
:style="[{top:CustomBar+'px',height:'calc(100vh - ' + CustomBar + 'px)'}]">
<view class="cu-bar bg-white solid-bottom margin-top">
<view class="action">
<text class="cuIcon-title text-orange "></text> 选择审批人
</view>
</view>
<view class="cu-list menu-avatar">
<view v-for="(item,index) in allsprlist" :key="index" class="cu-item" @tap="addsprlist(item)">
<view class="cu-avatar round lg">
<view class="cu-avatar round lg margin-xs ">
<text class="avatar-text">{{item.name.substr(0,1)}}</text>
</view>
</view>
<view class="content">
<view class="text-grey">{{item.name}}</view>
<view class="text-gray text-sm flex">
<view class="text-cut">
{{item.id}}
</view>
</view>
</view>
<view class="action">
</view>
</view>
</view>
</view>
</view> -->
<view class="container">
<view class="solid-bottom">
<scroll-view scroll-x class="bg-white nav text-center ">
<view class="flex text-center justify-around">
<view class="cu-item" :class="item.value==TabCur?'text-blue cur':''"
v-for="(item,index) in tabs" :key="index" @tap="tabSelect" :data-id="item.value">
{{item.title}}
</view>
</view>
</scroll-view>
</view>
<view v-if="TabCur==99" class="margin-top">
<!-- 请假类型 -->
<view class="cu-form-group" style="border-top: 5px solid #EEEEEE;">
<view class="title"><span class="red">*</span>请假类型</view>
<picker :disabled="edit" :range="qjlx" :value="qjinfor.qjlx" @change="getQjtype">
<view class="picker">
{{qjinfor.qjlxzw||"请选择"}}
</view>
</picker>
</view>
<view class="action"
style="padding-top: 5px;padding-bottom: 5px;padding-left: 20px;background-color: #EEEEEE;">
事假余额:
</view>
<view class="bordp" style="padding-bottom: 0px;">
<view class="cu-form-group ">
<view class="title"><span class="red">*</span>开始时间</view>
<picker :disabled="edit" mode="date" :value="qjinfor.qjkssj" @change="DateChange">
<view class="picker">
{{qjinfor.qjkssj}}
</view>
</picker>
</view>
<view class="cu-form-group">
<view class="title"><span class="red">*</span>结束时间</view>
<picker :disabled="edit" mode="date" :value="qjinfor.qjjssj" @change="DateChangeend">
<view class="picker">
{{qjinfor.qjjssj||"请选择"}}
</view>
</picker>
</view>
<view class="cu-form-group">
<view class="title"><span class="red">*</span>请假时长</view>
<input :disabled="edit" placeholder="请输入时长" v-model="qjinfor.qjsc" name="input"></input>
</view>
</view>
<view class="cu-form-group align-start bordp">
<view class="title"><span class="red">*</span>请假事由</view>
<textarea :disabled="edit" maxlength="-1" v-model="qjinfor.qjyy"
placeholder="请输入请假事由"></textarea>
</view>
<view style="border-bottom: 5px solid #eee;padding-bottom: 10px;">
<view class="cu-form-group margin-top">
<view class="title">添加图片</view>
</view>
<uni-file-picker style="margin-left: 10px;" ref="img" :auto-upload="false" v-model="imageValue"
fileMediatype="image" mode="grid" @select="tpselect" @progress="tpprogress" @success="tpsuccess"
@fail="tpfail" @delete="tpdel" />
</view>
<view class="cu-form-group" style="padding-top: 10px;padding-bottom: 10px;">
<view class="title">添加审批人(生成请假单)</view>
<view class="title"><button class="cu-btn block line-blue " @tap=getspr>
<text class="cuIcon-add"></text></button></view>
</view>
<view class="cu-form-group" style="-webkit-box-pack:unset;justify-content: left;">
<view style="position: relative;" v-for="(item,index) in sprlist" :key="index">
<view class="cu-avatar round lg margin-xs bg-red">
<text class="avatar-text">{{item.name}}</text>
</view>
<view @tap=delspr(index) class="cu-avatar round lg margin-xs bg-grey "
style="height: 15px;width: 15px;position: absolute;top: 0px;right: 0px;">
<text class="avatar-text">X</text>
</view>
</view>
</view>
<view class="padding-xl" style="border: 0.5 solid #EEEEEE;">
<button class="cu-btn block bg-blue margin-tb-sm lg" @click="allsubmit()">
</text>提交</button>
</view>
</view>
</view>
<view v-if="TabCur==99" class="">
<!-- 一般用法 -->
<view class="cu-bar bg-white search" style="border-bottom: 0.5px solid #EEEEEE;" >
<view class="search-form round">
<text class="cuIcon-search"></text>
<input type="text" placeholder="输入搜索的关键词" confirm-type="search" v-model="searchKey"></input>
</view>
<view class="action">
<button class="cu-btn bg-gradual-blue shadow-blur" @tap="apisearch">搜索</button>
</view>
</view>
<view class="cu-list menu-avatar comment">
<view class="cu-item" v-for="(item,index) in showlist" :key="index" :data-id="index" style="padding:15px;">
<view class="content">
<view class="margin-top-sm flex justify-between">
<view class="" style="font-size: 15px!important;color: #000000;">{{item.username}}提交的请假请求</view>
<view>
<text style="font-size: 12px!important;" class="text-gray margin-left-sm text-sm">{{timestampToTime(item.qjksrq)}}</text>
</view>
</view>
<view class="text-gray text-content text-sm">
<text style="font-size: 12px!important;">请假原因:</text>
<text style="font-size: 12px!important;">{{item.qjyy}}</text>
</view>
<view class="text-gray text-content text-sm">
<text style="font-size: 12px!important;">开始时间:</text>
<text style="font-size: 12px!important;">{{timestampToTime(item.qjksrq)}}</text>
</view>
<view class="text-gray text-content text-sm">
<text style="font-size: 12px!important;">结束时间:</text>
<text style="font-size: 12px!important;">{{timestampToTime(item.qjjsrq)}}</text>
</view>
<view class="margin-top-xs flex justify-between">
<view class="text-yellow text-sm">{{item.wfpname}}</view>
<view>
<text class="margin-left-sm text-sm text-blue" @tap.stop.prevent="confirm(item)" >撤销</text>
</view>
</view>
</view>
</view>
</view>
</view>
<!-- 内容通栏 -->
<!-- 确认模态框 -->
<view class="cu-modal" :class="modalName=='DialogModal1'?'show':''">
<view class="cu-dialog">
<view class="cu-bar bg-white justify-end">
<view class="content">提示</view>
<view class="action" @tap="hideModal">
<text class="cuIcon-close text-red"></text>
</view>
</view>
<view class="padding-xl bg-white">
是否撤销该请假请求?
</view>
<view class="cu-bar bg-white justify-end">
<view class="action">
<button class="cu-btn line-green text-green" @tap="hideModal">取消</button>
<button class="cu-btn bg-green margin-left" @tap="delqjd">确定</button>
</view>
</view>
</view>
</view>
<!-- 确认添加审批人 -->
<view class="cu-modal" :class="modalName=='DialogModal2'?'show':''">
<view class="cu-dialog">
<view class="cu-bar bg-white justify-end">
<view class="content">提示</view>
<view class="action" @tap="hideModal">
<text class="cuIcon-close text-red"></text>
</view>
</view>
<view class="padding-xl bg-white">
确定添加审批人?添加后将生成请假单,信息将不可更改
</view>
<view class="cu-bar bg-white justify-end">
<view class="action">
<button class="cu-btn line-green text-green" @tap="hideModal">取消</button>
<button class="cu-btn bg-green margin-left" @tap="confirmspr">确定</button>
</view>
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
const tabs = [{
title: '发起提交',
value: 0
}, {
title: '查看数据',
value: 1
}];
import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js";
export default {
mixins: [MescrollMixin], // 使用mixin
onReachBottom(e) {
this.pageNo++
this.apigetqjlist()
},
onLoad(e) {
let that=this
uni.getStorage({
key: 'userid',
success: function (res) {
console.log(res.data)
that.qjinfor.qjrid=res.data
}
});
uni.getStorage({
key: 'username',
success: function (res) {
console.log(res.data)
that.qjinfor.whr=res.data
}
});
let nowtime=new Date()
this.qjinfor.qjkssj=this.getNowdate(nowtime)
},
data() {
return {
delinfor:null,
nextinfo:null,
edit:null,
addinfor:"",
userid:"",
pageNo:1,
searchKey:"",
showlist:[],
qjlist:[
],
qjlx:["病假","事假","加班","调休","其他"],
qjinfor:{
whr:"",
qjrid:"",
qjyy:"",
qjlx:"",
qjkssj:"",
qjjssj:"",
qjsc:"",
},
modalName: null,
imgarry: [],
allsprlist: [],
sprlist: [
],
cksj: [{
bxr: "anger",
bxrq: "2021.01",
zt: "处理中",
bxdh: "1213800439",
bxzje: "年假"
},
{
bxr: "anger",
bxrq: "2021.01",
zt: "处理中",
bxdh: "1213800439",
bxzje: "年假"
}
],
imageValue: [
],
filesValue: [
],
bxmxlist: [{
bxje: "",
bxlb: "",
fxmx: ""
}],
tabs,
TabCur: 0,
scrollLeft: 0,
NavBarColor: this.NavBarColor,
upOption: {
page: {
num: 0, // 当前页码,默认0,回调之前会加1,即callback(page)会从1开始
size: 10 // 每页数据的数量
},
noMoreSize: 4, //如果列表已无数据,可设置列表的总数量要大于半页才显示无更多数据;避免列表数据过少(比如只有一条数据),显示无更多数据会不好看; 默认5
empty: {
tip: '~ 暂无数据 ~', // 提示
},
loading: '',
text: '全部',
isShowNoMore: false,
textNoMore: '我是有底线的 >_<'
},
msgList: [], //列表数据
read: "all",
announcement1: [],
msg1Count: "",
msg1Title: "",
announcement2: [],
msg2Count: "",
msg2Title: "",
url: "/sys/sysAnnouncementSend/getMyAnnouncementSend",
delUrl: '/sys/sysAnnouncementSend/delete',
listTouchStart: 0,
listTouchDirection: null,
}
},
onShow() {},
computed: {
zbxje() {
let num = 0
this.bxmxlist.forEach((e) => {
if (e.bxje) {
num = num + parseFloat(e.bxje)
}
})
return num
},
top() {
return this.CustomBar * 2 + 95
},
style() {
var StatusBar = this.StatusBar;
var CustomBar = this.CustomBar;
var style = `height:${CustomBar}px;padding-top:${StatusBar}px;`;
return style
},
},
filters: {
// timestampToTime: function (timestamp) {
//   let date = new Date(timestamp);
//   var YY = date.getFullYear() + '-';
//   var MM = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
//   var DD = (date.getDate() < 10 ? '0' + (date.getDate()) : date.getDate());
//   var hh = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
//   var mm = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()) + ':';
//   var ss = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
//   return YY + MM + DD +" "+hh + mm + ss;
// }
},
methods: {
confirmspr(){
let that=this
this.qjinfor.qjksrq=new Date(this.qjinfor.qjkssj).getTime()
this.qjinfor.qjjsrq=new Date(this.qjinfor.qjjssj).getTime()
if(!this.qjinfor.qjrid||!this.qjinfor.qjkssj||!this.qjinfor.qjjssj||!this.qjinfor.qjlx||!this.qjinfor.qjsc){
console.log(this.qjinfor)
uni.showToast({
title: '请填写必填项',
duration: 2000,
icon:"none"
});
that.hideModal()
}else{
this.edit=true
this.$http.post("/kqgl/ygqj/add",{details: [],master:this.qjinfor}).then(res => {
if (res.data.success) {
that.addinfor=res.data.data
for(let key in that.qjinfor){
that.addinfor.records[key]=that.qjinfor[key]
}
that.addinfor.qjsc=parseFloat(that.addinfor.qjsc)
that.addinfor.records.bz=""
that.addinfor.records.qjyy=that.qjinfor.qjyy
that.addinfor.records.whrid=that.qjinfor.qjrid
that.addinfor.records.cjr=that.qjinfor.whr
that.addinfor.records.username=that.qjinfor.whr
that.addinfor.records.cjrid=that.qjinfor.qjrid
that.addinfor.records.cjsj=new Date().getTime()
that.addinfor.records.whsj=new Date().getTime()
that.addinfor.records.wfoperate="1"
that.addinfor.records.sysversion=1
that.$http.post("kqgl/ygqj/wfnextinfo",that.addinfor.records).then(res => {
if (res.data.success) {
if(res.data.data.records[0].userList)
that.nextinfo=res.data.data.records[0]
that.allsprlist=res.data.data.records[0].userList
that.allsprlist.forEach(e=>{
if(e.mustSelect=="Y"){
that.sprlist.push(e)
}
})
this.$tip.toast("必选审批人已添加!");
that.modalName = "DrawerModalR"
} else {
}
});
} else {
}
});
}
},
apisearch(){
this.pageNo=1
this.showlist=[]
this.apigetqjlist()
},
// 获取请假列表
timestampToTime(timestamp){
let date = new Date(timestamp);
  var YY = date.getFullYear() + '-';
  var MM = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
  var DD = (date.getDate() < 10 ? '0' + (date.getDate()) : date.getDate());
  var hh = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
  var mm = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()) + ':';
  var ss = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
  return YY + MM + DD ;
},
apigetqjlist(){
this.$http.post("kqgl/ygqj/query",{operatype: "A",qjr:this.searchKey,pageNo:this.pageNo,pageSize:"20"}).then(res=>{
if(res.data.success){
this.qjlist=res.data.data.records
this.qjlist.forEach(e=>{
this.showlist.push(e)
})
console.log(this.qjlist)
}else{
console.log("出差")
}
});
},
delqjd(){
let that=this
if(!this.delinfor){
this.$tip.toast("请选择要撤销的单子");
}else{
this.$http.post("kqgl/ygqj/delete",{master:{id:this.delinfor.id}}).then(res => {
if (res.data.success) {
that.$tip.toast("删除成功!")
that.apisearch()
} else {
that.$tip.toast(res.data.message||"删除失败");
}
});
}
that.hideModal()
},
confirm(e){
this.delinfor=e
this.modalName="DialogModal1"
},
ckqjxq(e){
this.$Router.push({
path: '/pages/common/qjxq', query:{
},
})
},
getQjtype(value){
if(this.qjlx[value.detail.value]=="病假")
{
this.qjinfor.qjlxzw="病假"
this.qjinfor.qjlx="BJ"
}else if(this.qjlx[value.detail.value]=="事假"){
this.qjinfor.qjlxzw="事假"
this.qjinfor.qjlx="SJ"
}else if(this.qjlx[value.detail.value]=="加班"){
this.qjinfor.qjlxzw="加班"
this.qjinfor.qjlx="JB"
}else if(this.qjlx[value.detail.value]=="调休"){
this.qjinfor.qjlxzw="调休"
this.qjinfor.qjlx="TX"
}else if(this.qjlx[value.detail.value]=="其他"){
this.qjinfor.qjlxzw="其他"
this.qjinfor.qjlx="QT"
}
},
DateChange(value){
this.qjinfor.qjkssj=value.detail.value
},
DateChangeend(value){
this.qjinfor.qjjssj=value.detail.value
},
completeDate(value) {
return value < 10 ? "0"+value:value;
},
getNowdate(nowDate){
var char = "-";
if(nowDate == null){
nowDate = new Date();
}
var day = nowDate.getDate();
var month = nowDate.getMonth() + 1;//注意月份需要+1
var year = nowDate.getFullYear();
//补全0,并拼接
return year + char +this. completeDate(month) + char +this.completeDate(day);
},
// 添加审批人
addsprlist(e) {
let rep=true
if(!this.sprlist[0]){
this.sprlist.push(e)
this.modalName = null
rep=false
}else{
this.sprlist.forEach(a=>{
if(a.name==e.name){
this.modalName = null
this.$tip.toast("审批人重复了,请重新选择!");
rep=false
}
})
}
if(rep){
this.sprlist.push(e)
this.modalName = null
}
},
hideModal(e) {
this.modalName = null
},
// 跳转获取审批人信息
getspr() {
if(!this.addinfor){
this.modalName="DialogModal2"
}else{
this.modalName = "DrawerModalR"
}
// this.$Router.push({
// path: '/pages/addressbook/selectspr', query:{
// allinfor:{
// imgarry:this.imgarry,
// imageValue:this.imageValue
// }
// },
// })
},
// 删除审批人
delspr(index) {
if(this.sprlist[index].mustSelect=="Y"){
this.$tip.toast("必选审批人不可删除");
}else{
this.sprlist.splice(index, 1)
}
},
// 上传文件
upload(name, fileUrl) {
let that = this;
uni.uploadFile({
url: 'https://jsonplaceholder.typicode.com/posts',
filePath: fileUrl,
name: 'file',
header: {
"Content-Type": "multipart/form-data",
},
formData: {
// "api_token": that.api_token,
},
success: res => {
console.log(res)
// let url = JSON.parse(res.data).data.url;
// let size = JSON.parse(res.data).data.size;
// let suffix = JSON.parse(res.data).data.ext;
}
})
},
// 数据单详情
getxxxx(e) {
this.$Router.push({
path: '/pages/addressbook/xxxx',
query: {
infor: e
},
})
},
// 提交按钮
allsubmit() {
let that=this
if(!this.sprlist[0]){
this.$tip.toast("请先选择审批人");
}else{
this.$http.post("kqgl/ygqj/wfgo",{nextinfo:this.nextinfo,records:[this.addinfor.records]}).then(res => {
if (res.data.success) {
that.$tip.toast("提交成功!");
that.$Router.push({
path: '/pages/common/helloWorld', query:{
},
})
} else {
that.$tip.toast(res.data.message);
}
});
}
// this.imgarry.forEach(e => {
// this.upload(e.tempFiles[0].name, e.tempFiles[0].path)
// })
// this.$http.post("/upload").then(res => {
// if (res.data.success) {
// this.smsCountDown = 60;
// this.startSMSTimer();
// } else {
// this.smsCountDown = 0;
// this.$tip.toast(res.data.message);
// }
// });
// this.imgarry.forEach(e => {
// this.upload(e.tempFiles[0].name, e.tempFiles[0].path)
// })
},
// 获取上传状态
tpdel(f) {
console.log(f)
this.imgarry.forEach((e, index) => {
if (f.tempFile.path == e.tempFiles[0].path) {
this.imgarry.splice(index, 1)
}
})
console.log(this.imgarry)
},
tpselect(e) {
this.imgarry.push(e)
console.log(this.imgarry)
},
// 获取上传进度
tpprogress(e) {
console.log('上传进度:', e)
},
// 上传成功
tpsuccess(e) {
console.log('上传成功')
},
// 上传失败
tpfail(e) {
console.log('上传失败:', e)
},
addbxmxlist() {
let addobj = {
bxje: "",
bxlb: "",
fxmx: ""
}
this.bxmxlist.push(addobj)
console.log(this.bxmxlist)
},
// unique(arr) {
// var obj = {};
// return arr.filter(function(item, index, arr){
// return obj.hasOwnProperty(typeof item + item) ? false : (obj[typeof item + item] = true)
// })
// },
upCallback(page) {
//联网加载数据
console.log("tabindex", this.TabCur)
let keyword = this.TabCur
if (keyword == 0) {
this.$http.get(this.url, {
params: {
pageNo: page.num,
pageSize: page.size,
msgCategory: '1'
}
}).then(res => {
//联网成功的回调,隐藏下拉刷新和上拉加载的状态;
this.announcement1 = res.data.result.records
this.mescroll.endSuccess(this.announcement1.length);
//console.log("url", res)
//设置列表数据
if (res.data.success) {
console.log("res", res.data)
this.msg1Count = res.data.result.total
this.msg1Title = "通知(" + res.data.result.total + ")";
for (let annItem of this.announcement1) {
this.msgList.push(annItem)
}
}
if (page.num == 1) {
this.msgList = []; //如果是第一页需手动制空列表
this.msgList = this.msgList.concat(this.announcement1); //追加新数据
}
}).catch(() => {
//联网失败, 结束加载
this.mescroll.endErr();
})
}
if (keyword == 1) {
this.$http.get(this.url, {
params: {
pageNo: page.num,
pageSize: page.size,
msgCategory: '2'
}
}).then(res => {
//联网成功的回调,隐藏下拉刷新和上拉加载的状态;
this.announcement2 = res.data.result.records
this.mescroll.endSuccess(this.announcement2.length, this.msgCount);
//设置列表数据
if (res.data.success) {
console.log("res sys", res.data)
this.msg2Count = res.data.result.total
this.msg2Title = "通知(" + res.data.result.total + ")";
// this.announcement2.filter((item,index) => {
// // console.log("item",item)
// if(item.anntId == this.announcement2[index+1].anntId){
// this.announcement2.splice(item,1)
for (let item of this.announcement2) {
this.msgList.push(item)
}
// }
// })
}
if (page.num == 1) {
this.msgList = []; //如果是第一页需手动制空列表
this.msgList = this.msgList.concat(this.announcement2); //追加新数据
}
}).catch(() => {
//联网失败, 结束加载
this.mescroll.endErr();
})
}
},
tabSelect(e) {
this.TabCur = e.currentTarget.dataset.id;
if(e.currentTarget.dataset.id==1){
this.apisearch()
}
this.scrollLeft = (e.currentTarget.dataset.id - 1) * 60;
this.msgList = [] // 先置空列表,显示加载进度
},
goAnnotationDetail(item) {
//item.readFlag = '1'
this.mescroll.resetUpScroll()
if (item.openType == "component" && item.openPage.indexOf('email') >= 0) {
this.goEmailDetailPage(item)
} else {
// console.log("detail",encodeURIComponent(JSON.stringify(item)))
uni.navigateTo({
url: '/pages/annotation/annotationDetail?item=' + encodeURIComponent(JSON.stringify(item))
});
}
},
isEmail(item) {
if (item.openType == "component" && item.openPage.indexOf('email') >= 0) {
return true;
} else {
return false;
}
},
goEmailDetailPage(item) {
console.log("go", item.anntId)
console.log("item", item)
if (item.readFlag == '0') {
//item.readFlag = '1'
this.mescroll.resetUpScroll()
let readUrl = '/sys/sysAnnouncementSend/editByAnntIdAndUserId';
this.$http.put(readUrl, {
anntId: item.anntId
})
}
// console.log("goe",item.busId)
uni.navigateTo({
url: '/pages/mail/mailDetail?id=' + item.busId
});
},
ListTouchStart(e) {
this.listTouchStart = e.touches[0].pageX
},
// ListTouch计算方向
ListTouchMove(e) {
this.listTouchDirection = e.touches[0].pageX - this.listTouchStart > 0 ? 'right' : 'left'
},
// ListTouch计算滚动
ListTouchEnd(e) {
if (this.listTouchDirection == 'left') {
this.modalName = e.currentTarget.dataset.target
} else {
this.modalName = null
}
this.listTouchDirection = null
},
deleteAnnotation(item) {
this.$http.delete(this.delUrl + '?id=' + item.id).then(res => {
console.log("结果数据9", res)
if (res.data.success) {
this.mescroll.resetUpScroll()
}
}).catch(e => {
console.log("al delUrl请求错误2", e)
this.mescroll.endErr();
})
},
formatDate(text, len) {
if (!text || text.length == 0) {
return ''
}
if (text.length < len) {
return text;
}
return text.substr(0, len)
},
titleFilter(text, len) {
if (!text || text.length == 0) {
return ''
}
if (text.length < len) {
return text;
}
return text.substr(0, len) + "..."
}
}
}
</script>
<style scoped>
*{
font-size: 14px!important;
}
.uni-card__head-padding {
background-color: #007AFF !important;
color: #FFFFFF;
}
.red {
color: red;
}
.e-btn {
margin-bottom: 1rem;
}
.titlePad {
margin-top: 0.6rem;
}
.cu-list>.move-cur {
transform: translateX(-150rpx);
}
.nav .cu-item.cur {
position: flex;
z-index: 9;
border-bottom: 4upx solid;
}
.bordp {
padding-bottom: 10px;
border-bottom: 5px solid #EEEEEE;
}
.bordb {
padding-top: 10px;
border-top: 5px solid #EEEEEE;
}
</style>
<template>
<view class="bg-white" >
<cu-custom bgColor="bg-white" isBack="true" >
<slot slot="backText">返回</slot>
</cu-custom>
<view class="container">
<view class="cu-card article " style="padding-bottom: 0px;">
<view class="cu-item shadow" style="padding-bottom: 0px;">
<view class="title flex justify-between" style="height: 25px;">
<view class="text-cut" style="font-size: 16px!important;line-height: 22px;">{{spinfor.username||""}}的请假信息</view>
</view>
<view class="content">
<view class="desc">
<view class="text-content" style="height: 50px;">
<view>苏州格物信息技术有限公司</view>
<view style="color:#E8A54C;">{{spinfor.wfpname||""}}</view>
</view>
</view>
</view>
</view>
</view>
<view v-if="TabCur==1" class="">
<view >
<view class="action"
style="padding-bottom: 5px;padding-left: 20px;background-color: #EEEEEE;padding-bottom: 5px;padding-top: 5px;">
请假信息
</view>
<view class="cu-form-group margin-top">
<view class="title"><span class="red">*</span>请假单号</view>
<input disabled placeholder="" name="input" >{{qjinfor.qjdh}}</input>
</view>
<view class="cu-form-group">
<view class="title"><span class="red">*</span>开始时间</view>
<input disabled name="input" >{{qjinfor.qjksrq|formatDate(qjinfor.qjksrq)}}</input>
</view>
<view class="cu-form-group">
<view class="title"><span class="red">*</span>结束时间</view>
<input disabled name="input">{{qjinfor.qjksrq|formatDate(qjinfor.qjjsrq)}}</input>
</view>
<view class="cu-form-group">
<view class="title"><span class="red">*</span>考勤类型</view>
<input disabled name="input" >{{qjinfor.qjlx|jqfilters(qjinfor.qjlx)}}</input>
</view>
<view class="cu-form-group">
<view class="title"><span class="red">*</span>时长(天)</view>
<input disabled name="input">{{qjinfor.qjsc}}</input>
</view>
<view class="cu-form-group align-start" style="border-bottom:0.5px solid #EEEEEE;">
<view class="title"><span class="red">*</span>原因</view>
<textarea style="text-align: left;" maxlength="-1" :disabled="modalName!=null" v-model="qjinfor.qjyy" disabled>
</textarea>
</view>
</view>
<view class="bordb">
<view class="cu-form-group" style="border-top: 10px solid #EEEEEE;">
<view class="title">流程</view>
</view>
<view class="cu-form-group padding-bottom ">
<view >
<view class="cu-timeline " v-for="(item,index) in lc" :key="index">
<view class="cu-time" style="width: 80px;">{{item.nodeName}}</view>
<view class="cu-item text-gray" v-if="item.nodeName!='结束'">
<view class="bg-blue content">
<text></text> {{item.actionTime|formatTime(item.actionTime)}}{{item.actionUserName}}{{item.action|ztTrans(item.action)}}
</view>
</view>
</view>
</view>
</view>
</view>
<!-- <view class="bordb">
<view class="cu-form-group" style="border-top: 10px solid #EEEEEE;">
<view class="title">处理</view>
</view>
<view class="cu-form-group padding justify-around ">
<view class="" >
<button class="cu-btn round bg-blue" @tap="showR()">提交</button>
</view>
<view class="" >
<button class="cu-btn round bg-blue" @tap="showCh()">删除</button>
</view>
<view class="" >
<button class="cu-btn round bg-blue" @tap="showTh()">退回</button>
</view>
<view class="">
<button class="cu-btn round bg-blue" @tap="showRqjzj()">转交</button>
</view>
<view class="" >
<button class="cu-btn round bg-blue" @tap="showR3()" >撤回</button>
</view>
</view>
</view> -->
</view>
</view>
<!-- 请假提交模态框 -->
<view class="cu-modal drawer-modal justify-end" :class="modalName=='tjDrawerModalR'?'show':''" @tap="hideModal">
<view class="cu-dialog basis-lg" style="overflow: auto;" @tap.stop=""
:style="[{top:CustomBar+'px',height:'calc(100vh - ' + CustomBar + 'px)'}]">
<view class="cu-bar bg-white solid-bottom margin-top">
<view class="action">
<span class="red"></span> 审批人
</view>
</view>
<view class="cu-form-group" style="-webkit-box-pack:unset;justify-content: left;">
<view style="position: relative;" v-for="(item,index) in tjsprlist" :key="index">
<view class="cu-avatar round lg margin-xs bg-red">
<text class="avatar-text">{{item.name}}</text>
</view>
<view v-if="item.mustSelect!='Y'" @tap=delspr(index) class="cu-avatar round lg margin-xs bg-grey "
style="height: 15px;width: 15px;position: absolute;top: 0px;right: 0px;">
<text class="avatar-text">X</text>
</view>
</view>
</view>
<view class="cu-list menu-avatar">
<view class="cu-form-group align-start" style="border-bottom:0.5px solid #EEEEEE;">
<view class="title"><span class="red"></span>处理意见</view>
<textarea maxlength="-1" v-model="tjqjclyj"
></textarea>
</view>
</view>
<view class="padding-xl">
<button @tap="apitjqj" class="cu-btn block bg-blue margin-tb-sm lg">
提交</button>
</view>
</view>
</view>
<!-- 请假撤回模态框 -->
<view class="cu-modal drawer-modal justify-end" :class="modalName=='DrawerModalR'?'show':''" @tap="hideModal">
<view class="cu-dialog basis-lg" style="overflow: auto;" @tap.stop=""
:style="[{top:CustomBar+'px',height:'calc(100vh - ' + CustomBar + 'px)'}]">
<view class="cu-bar bg-white solid-bottom margin-top">
<view class="action">
<span class="red"></span> 审批人
</view>
</view>
<view class="cu-form-group" style="-webkit-box-pack:unset;justify-content: left;">
<view style="position: relative;" v-for="(item,index) in tjsprlist" :key="index">
<view class="cu-avatar round lg margin-xs bg-red">
<text class="avatar-text">{{item.name}}</text>
</view>
<view v-if="item.mustSelect!='Y'" @tap=delspr(index) class="cu-avatar round lg margin-xs bg-grey "
style="height: 15px;width: 15px;position: absolute;top: 0px;right: 0px;">
<text class="avatar-text">X</text>
</view>
</view>
</view>
<view class="cu-list menu-avatar">
<view class="cu-form-group align-start" style="border-bottom:0.5px solid #EEEEEE;">
<view class="title"><span class="red"></span>处理意见</view>
<textarea maxlength="-1" v-model="tjqjclyj"
></textarea>
</view>
</view>
<view class="padding-xl">
<button @tap="apichqj" class="cu-btn block bg-blue margin-tb-sm lg">
提交</button>
</view>
</view>
</view>
<!-- 请假转交模态框 -->
<view class="cu-modal drawer-modal justify-end" :class="modalName=='DrawerModalRqjzj'?'show':''" @tap="hideModal">
<view class="cu-dialog basis-lg" style="overflow: auto;" @tap.stop=""
:style="[{top:CustomBar+'px',height:'calc(100vh - ' + CustomBar + 'px)'}]">
<view class="cu-bar bg-white solid-bottom margin-top">
<view class="action">
<span class="red"></span> 可选审批人
</view>
</view>
<view class="cu-form-group" style="-webkit-box-pack:unset;justify-content: left;overflow: auto;">
<view style="position: relative;" v-for="(item,index) in qjzjsprlist" :key="index">
<view class="cu-avatar round lg margin-xs bg-red" @tap=qjzjspr(item)>
<text class="avatar-text">{{item.name}}</text>
</view>
<!-- <view v-if="item.mustSelect!='Y'" @tap=qjzjspr(item) class="cu-avatar round lg margin-xs bg-green "
style="height: 15px;width: 15px;position: absolute;top: 0px;right: 0px;">
<text class="avatar-text"></text>
</view> -->
</view>
</view>
<view class="cu-bar bg-white solid-bottom margin-top">
<view class="action">
<span class="red"></span> 已选审批人
</view>
</view>
<view class="cu-form-group" style="-webkit-box-pack:unset;justify-content: left;overflow: auto;">
<view style="position: relative;" v-for="(item,index) in qjzjsprlistN" :key="index">
<view class="cu-avatar round lg margin-xs bg-red">
<text class="avatar-text">{{item.name}}</text>
</view>
<view v-if="item.mustSelect!='Y'" @tap=delqjzjspr(item,index) class="cu-avatar round lg margin-xs bg-gray "
style="height: 15px;width: 15px;position: absolute;top: 0px;right: 0px;">
<text class="avatar-text">x</text>
</view>
</view>
</view>
<view class="cu-list menu-avatar">
<view class="cu-form-group align-start" style="border-bottom:0.5px solid #EEEEEE;">
<view class="title"><span class="red"></span>处理意见</view>
<textarea maxlength="-1" v-model="zjqjclyj"
></textarea>
</view>
</view>
<view class="padding-xl">
<button @tap="apizjqj" class="cu-btn block bg-blue margin-tb-sm lg">
提交</button>
</view>
</view>
</view>
<!-- 确认模态框 -->
<view class="cu-modal" :class="modalName=='qjchehui'?'show':''">
<view class="cu-dialog">
<view class="cu-bar bg-white justify-end">
<view class="content">提示</view>
<view class="action" @tap="hideModal">
<text class="cuIcon-close text-red"></text>
</view>
</view>
<view class="padding-xl bg-white">
是否删除该请假请求?
</view>
<view class="cu-bar bg-white justify-end">
<view class="action">
<button class="cu-btn line-green text-green" @tap="hideModal">取消</button>
<button class="cu-btn bg-green margin-left" @tap="apidelqjd">确定</button>
</view>
</view>
</view>
</view>
<!-- 确认模态框 -->
<view class="cu-modal" :class="modalName=='qjchehui'?'show':''">
<view class="cu-dialog">
<view class="cu-bar bg-white justify-end">
<view class="content">提示</view>
<view class="action" @tap="hideModal">
<text class="cuIcon-close text-red"></text>
</view>
</view>
<view class="padding-xl bg-white">
是否撤销该请假请求?
</view>
<view class="cu-bar bg-white justify-end">
<view class="action">
<button class="cu-btn line-green text-green" @tap="hideModal">取消</button>
<button class="cu-btn bg-green margin-left" @tap="apidelqjd">确定</button>
</view>
</view>
</view>
</view>
<!-- 请假退回 -->
<view class="cu-modal" :class="modalName=='qjtuihui'?'show':''">
<view class="cu-dialog">
<view class="cu-bar bg-white justify-end">
<view class="content">提示</view>
<view class="action" @tap="hideModal">
<text class="cuIcon-close text-red"></text>
</view>
</view>
<view class="padding-xl bg-white">
是否退回该请假请求?
</view>
<view class="cu-bar bg-white justify-end">
<view class="action">
<button class="cu-btn line-green text-green" @tap="hideModal">取消</button>
<button class="cu-btn bg-green margin-left" @tap="apiqjth">确定</button>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
const tabs = [{title:'发起提交',value:0}, {title:'查看数据',value:1}];
import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js";
import formatTimeToStr from '@/common/util/date.js';
export default {
mixins: [MescrollMixin], // 使用mixin
onLoad(e){
if(e){
this.spinfor=JSON.parse(e.query).infor
console.log("spinfor")
console.log(this.spinfor)
this.TabCur="1"
this.urls.qjxxgzl=this.urls.qjxxgzl+"/"+this.spinfor.wfinstid
this.apiqueryqjxx()
this.apiqjxxgzl()
}
},
filters: {
jqfilters:function(a){
const ztList = {"BJ": "病假", "SJ":"事假","JB":"加班","TS":"调休","QT":"其他"};
return ztList[a]
},
ztTrans: function(a) {
const ztList = {0: "创建", 1:"提交",2:"退回",3:"撤回",4:"转交",5:"调度",8:"待处理"};
return ztList[a]
},
formatTime: function(time) {
if(time!=null&&time!="")
{
var date = new Date(time);
return date.Format("MM-dd hh:mm")
}else{
return "";
}
},
formatDate:function(time){
if(time!=null&&time!="")
{
var date = new Date(time);
return date.Format("yyyy-MM-dd")
}else{
return "";
}
}
},
data() {
return {
qjzjsprlistN:[],
qjzjsprlist:[],
qjzjsprdata:null,
zjqjclyj:"",
// 提交请假处理意见
tjqjclyj:"",
qjinfor:{
},
modalName:null,
urls:{
qjxx:"kqgl/ygqj/query",
gzxx:"dmg/xmrw/query",
gzxxgzl:"wf/query/wflog",
qjxxgzl:"wf/query/wflog"
},
spinfor:{
action:""
},
lc:[],
bxdh:null,
imageValue:[
],
bxmxlist:[
{
bxje:"",
bxlb:"",
fxmx:""
},
{
bxje:"",
bxlb:"",
fxmx:""
}
],
tabs,
TabCur: 0,
scrollLeft: 0,
NavBarColor:this.NavBarColor,
upOption:{
page: {
num: 0, // 当前页码,默认0,回调之前会加1,即callback(page)会从1开始
size: 10 // 每页数据的数量
},
noMoreSize: 4, //如果列表已无数据,可设置列表的总数量要大于半页才显示无更多数据;避免列表数据过少(比如只有一条数据),显示无更多数据会不好看; 默认5
empty:{
tip: '~ 暂无数据 ~', // 提示
},
loading:'',
text:'全部',
isShowNoMore:false,
textNoMore:'我是有底线的 >_<'
},
msgList: [], //列表数据
read: "all",
announcement1:[],
msg1Count:"",
msg1Title:"",
announcement2:[],
msg2Count:"",
msg2Title:"",
url:"/sys/sysAnnouncementSend/getMyAnnouncementSend",
delUrl:'/sys/sysAnnouncementSend/delete',
listTouchStart: 0,
listTouchDirection: null,
tjsprlist:null,
tjsprdata:null,
}
},
onShow() {
},
computed:{
zbxje(){
let num=0
this.bxmxlist.forEach((e)=>{
if(e.bxje){
num=num+parseFloat(e.bxje)
}
})
return num
},
top() {
return this.CustomBar * 2 + 95
},
style() {
var StatusBar= this.StatusBar;
var CustomBar= this.CustomBar;
var style = `height:${CustomBar}px;padding-top:${StatusBar}px;`;
return style
},
},
methods: {
// 转交请假
apizjqj(){
let that=this
let nextinfo={
selected: "Y",
comment: this.zjqjclyj,
userList:this.qjzjsprlistN,
}
console.log(nextinfo)
delete this.qjinfor.wfoperate;
this.$http.post("kqgl/ygqj/wftransfer",{nextinfo:nextinfo,records:[this.qjinfor]}).then(res => {
if (res.data.success) {
that.$tip.toast("提交成功!");
that.$Router.push({
path: '/pages/process/process', query:{
},
})
} else {
this.hideModal()
console.log(res)
that.$tip.toast(res.data.messageArray[0].message||"转交失败");
}
});
},
// 获取转交审批人
qjzjspr(item){
let noRepeat=true
this.qjzjsprlistN.forEach((e,index)=>{
if(e.id==item.id){
console.log("重复了")
noRepeat=false
}
})
if(noRepeat){
item.selected="Y"
this.qjzjsprlistN.push(item)
}
},
// 删除请假审批人
delqjzjspr(item,index){
this.qjzjsprlistN.splice(index, 1)
},
// 请假转交
showRqjzj(){
let that=this
this.qjinfor.wfoperate="4"
this.qjinfor.sysversion=1
this.$http.post("kqgl/ygqj/wfnextinfo",this.qjinfor).then(res => {
if (res.data.success) {
that.qjzjsprdata=res.data.data.records[0]
that.qjzjsprlist=res.data.data.records[0].userList
this.modalName="DrawerModalRqjzj"
} else {
that.$tip.toast(res.data.message||"处理失败");
}
});
},
// 请假删除请求
apidelqjd(){
let that=this
this.$http.post("kqgl/ygqj/delete",{master:{id:this.qjinfor.id}}).then(res => {
if (res.data.success) {
that.$tip.toast("删除成功!")
that.$Router.push({
path: '/pages/process/process', query:{
},
})
} else {
that.$tip.toast(res.data.message||"删除失败");
}
});
that.hideModal()
},
// 请假删除框
showCh(){
this.modalName="qjchehui"
},
// 提交请假
apitjqj(){
let that=this
let nextinfo={
selected: "Y",
comment: this.tjqjclyj,
userList:this.tjsprlist,
}
this.$http.post("kqgl/ygqj/wfgo",{nextinfo:nextinfo,records:[this.qjinfor]}).then(res => {
if (res.data.success) {
that.$tip.toast("提交成功!");
that.$Router.push({
path: '/pages/process/process', query:{
},
})
} else {
that.$tip.toast(res.data.message);
}
});
},
// 退回请求
apiqjth(){
let that=this
this.qjinfor.wfoperate="2"
this.$http.post("kqgl/ygqj/wfnextinfo",this.qjinfor).then(res => {
if (res.data.success) {
that.$tip.toast("退回成功!")
that.$Router.push({
path: '/pages/process/process', query:{
},
})
} else {
that.$tip.toast(res.data.message||"退回失败");
}
});
that.hideModal()
},
// 撤回请求
apichqjd(){
let that=this
this.$http.post("kqgl/ygqj/delete",{master:{id:this.qjinfor.id}}).then(res => {
if (res.data.success) {
that.$tip.toast("删除成功!")
that.$Router.push({
path: '/pages/process/process', query:{
},
})
} else {
that.$tip.toast(res.data.message||"删除失败");
}
});
that.hideModal()
},
// 退回框
showTh(){
this.modalName="qjtuihui"
},
// 撤回框
showCh(){
this.modalName="qjchehui"
},
// 提交请假
apichqj(){
let that=this
let nextinfo={
selected: "Y",
comment: this.tjqjclyj,
userList:this.tjsprlist,
}
this.$http.post("kqgl/ygqj/wfpullback",{nextinfo:nextinfo,records:[this.qjinfor]}).then(res => {
if (res.data.success) {
that.$tip.toast("撤回成功");
that.$Router.push({
path: '/pages/process/process', query:{
},
})
} else {
this.hideModal()
that.$tip.toast(res.data.messageArray[0].message);
}
});
},
// 删除审批人
delspr(index) {
if(this.tjsprlist[index].mustSelect=="Y"){
this.$tip.toast("必选审批人不可删除");
}else{
this.tjsprlist.splice(index, 1)
}
},
// 提交
showR(){
let that=this
this.qjinfor.wfoperate="1"
this.qjinfor.sysversion=1
this.$http.post("kqgl/ygqj/wfnextinfo",this.qjinfor).then(res => {
if (res.data.success) {
that.tjsprdata=res.data.data.records[0]
that.tjsprlist=res.data.data.records[0].userList
this.modalName="tjDrawerModalR"
} else {
that.$tip.toast(res.data.message||"请求失败");
}
});
},
// 撤回
showR3(){
let that=this
this.qjinfor.wfoperate="3"
// this.qjinfor.sysversion=1
this.$http.post("kqgl/ygqj/wfnextinfo",this.qjinfor).then(res => {
if (res.data.success) {
that.tjsprdata=res.data.data.records[0]
that.tjsprlist=res.data.data.records[0].userList
this.modalName="DrawerModalR"
} else {
that.$tip.toast(res.data.message);
}
});
},
hideModal(e) {
this.modalName = null
},
apiqueryqjxx(){
this.$http.post(this.urls.qjxx,{id:this.spinfor.id}).then(res => {
if (res.data.success) {
this.qjinfor=res.data.data.records[0]
console.log("qjinfor")
console.log(this.qjinfor)
} else {
that.$tip.toast(res.data.message);
}
});
},
apiquerygzxx(){
this.$http.post(this.urls.gzxx,{id:this.spinfor.wfId}).then(res => {
if (res.data.success) {
} else {
that.$tip.toast(res.data.message);
}
});
},
apigzxxgzl(){
this.$http.post(this.urls.gzxxgzl).then(res => {
if (res.data.success) {
this.lc=res.data.data.records
} else {
that.$tip.toast(res.data.message);
}
});
},
apiqjxxgzl(){
this.$http.post(this.urls.qjxxgzl).then(res => {
if (res.data.success) {
this.lc=res.data.data.records
} else {
that.$tip.toast(res.data.message);
}
});
},
tabSelect(e) {
this.TabCur = e.currentTarget.dataset.id;
this.scrollLeft = (e.currentTarget.dataset.id - 1) * 60;
this.msgList = []// 先置空列表,显示加载进度
},
formatDate(text,len){
if(!text || text.length==0){
return ''
}
if(text.length<len){
return text;
}
return text.substr(0,len)
},
titleFilter(text,len){
if(!text || text.length==0){
return ''
}
if(text.length<len){
return text;
}
return text.substr(0,len)+"..."
}
}
}
</script>
<style scoped>
*{
font-size: 14px!important;
}
.uni-card__head-padding{
background-color: #007AFF!important;
color: #FFFFFF;
}
.red{
color: red;
}
.e-btn{margin-bottom: 1rem;}
.titlePad{margin-top:0.6rem;}
.cu-list>.move-cur{
transform: translateX(-150rpx);
}
.bordb{
padding-bottom: 10px;
border-bottom: 10px solid #EEEEEE;
}
.nav .cu-item.cur {
position: flex;
z-index: 9;
border-bottom: 4upx solid;
}
</style>
<template>
<view class="bg-white">
<cu-custom bgColor="bg-white" isBack="true" >
<slot slot="backText">返回</slot>
</cu-custom>
<view class="bg-white nav fixed" :style="[{top:CustomBar + 'px'}]">
<view class="flex text-center">
<view class="cu-item flex-sub" :class="index==TabCur?'text-orange cur':''" v-for="(item,index) in tabs" :key="index" @tap="tabSelect" :data-id="index">
{{item.title}}
</view>
</view>
</view>
<view class="cu-modal drawer-modal justify-end" :class="modalName=='DrawerModalR'?'show':''" @tap="hideModal">
<view class="cu-dialog basis-lg" style="overflow: auto;" @tap.stop=""
:style="[{top:CustomBar+'px',height:'calc(100vh - ' + CustomBar + 'px)'}]">
<view class="cu-bar bg-white solid-bottom margin-top">
<view class="action">
<text class="cuIcon-title text-orange "></text> 选择审批人
</view>
</view>
<view class="cu-list menu-avatar">
<view v-for="(item,index) in allsprlist" :key="index" class="cu-item" @tap="addsprlist(item)">
<view class="cu-avatar round lg">
<view class="cu-avatar round lg margin-xs ">
<text class="avatar-text">{{item.name.substr(0,1)}}</text>
</view>
</view>
<view class="content">
<view class="text-grey">{{item.name}}</view>
<view class="text-gray text-sm flex">
<view class="text-cut">
{{item.id}}
</view>
</view>
</view>
<view class="action">
</view>
</view>
</view>
</view>
</view>
<view class="container">
<view class="solid-bottom">
<scroll-view scroll-x class="bg-white nav text-center ">
<view class="flex text-center justify-around">
<view class="cu-item" :class="item.value==TabCur?'text-blue cur':''"
v-for="(item,index) in tabs" :key="index" @tap="tabSelect" :data-id="item.value">
{{item.title}}
</view>
</view>
</scroll-view>
</view>
<view v-if="TabCur==0" class="">
<!-- 请假类型 -->
<view class="cu-form-group" style="border-bottom: 0.5px solid #EEEEEE;">
<view class="title"><span class="red">*</span>请假类型</view>
<picker :disabled="edit" :range="qjlx" :value="qjinfor.qjlx" @change="getQjtype">
<view class="picker">
{{qjinfor.qjlxzw||"请选择"}}
</view>
</picker>
</view>
<!-- <view class="action"
style="padding-top: 5px;padding-bottom: 5px;padding-left: 20px;background-color: #EEEEEE;">
事假余额:
</view> -->
<view class="bordp" style="padding-bottom: 0px;">
<view class="cu-form-group ">
<view class="title"><span class="red">*</span>开始时间</view>
<picker :disabled="edit" mode="date" :value="qjinfor.qjkssj" @change="DateChange">
<view class="picker">
{{qjinfor.qjkssj}}
</view>
</picker>
</view>
<view class="cu-form-group">
<view class="title"><span class="red">*</span>结束时间</view>
<picker :disabled="edit" mode="date" :value="qjinfor.qjjssj" @change="DateChangeend">
<view class="picker">
{{qjinfor.qjjssj||"请选择"}}
</view>
</picker>
</view>
<view class="cu-form-group">
<view class="title"><span class="red">*</span>请假时长</view>
<input :disabled="edit" placeholder="请输入时长" v-model="qjinfor.qjsc" name="input"></input>
</view>
</view>
<view class="cu-form-group align-start bordp">
<view class="title"><span class="red">*</span>请假事由</view>
<textarea :disabled="edit" maxlength="-1" v-model="qjinfor.qjyy"
placeholder="请输入请假事由"></textarea>
</view>
<view style="border-bottom: 5px solid #eee;padding-bottom: 10px;">
<view class="cu-form-group margin-top">
<view class="title">添加图片</view>
</view>
<uni-file-picker style="margin-left: 10px;" ref="img" :auto-upload="false" v-model="imageValue"
fileMediatype="image" mode="grid" @select="tpselect" @progress="tpprogress" @success="tpsuccess"
@fail="tpfail" @delete="tpdel" />
</view>
<view class="cu-form-group" style="padding-top: 10px;padding-bottom: 10px;">
<view class="title">添加审批人(生成请假单)</view>
<view class="title"><button class="cu-btn block line-blue " @tap=getspr>
<text class="cuIcon-add"></text></button></view>
</view>
<view class="cu-form-group" style="-webkit-box-pack:unset;justify-content: left;">
<view style="position: relative;" v-for="(item,index) in sprlist" :key="index">
<view class="cu-avatar round lg margin-xs bg-red">
<text class="avatar-text">{{item.name}}</text>
</view>
<view @tap=delspr(index) class="cu-avatar round lg margin-xs bg-grey "
style="height: 15px;width: 15px;position: absolute;top: 0px;right: 0px;">
<text class="avatar-text">X</text>
</view>
</view>
</view>
<view class="padding-xl" style="border: 0.5 solid #EEEEEE;">
<button class="cu-btn block bg-blue margin-tb-sm lg" @click="allsubmit()">
</text>提交</button>
</view>
</view>
</view>
<view v-if="TabCur==1" class="">
<!-- 一般用法 -->
<!-- <view class="cu-bar bg-white search" style="border-bottom: 0.5px solid #EEEEEE;" >
<view class="search-form round">
<text class="cuIcon-search"></text>
<input type="text" placeholder="输入搜索的关键词" confirm-type="search" v-model="searchKey"></input>
</view>
<view class="action">
<button class="cu-btn bg-gradual-blue shadow-blur" @tap="apisearch">搜索</button>
</view>
</view> -->
<view class="cu-bar bg-white search" >
<view class="example-body">
<uni-search-bar placeholder="请输入请假人" @input="searchinput"></uni-search-bar>
</view>
<view class="action" style="margin-right: 8px;">
<text class="cu-btn round search-btn" @tap="showModal" data-target="bottomModal">
<text class="cuIcon-filter"></text>筛选</text>
</view>
</view>
<view class="cu-list menu-avatar comment">
<view class="cu-item" v-for="(item,index) in showlist" :key="index" :data-id="index" style="padding:15px;" @tap="ckqjxq(item)">
<view class="content">
<view class="margin-top-sm flex justify-between">
<view class="" style="font-size: 15px!important;color: #000000;">{{item.username}}提交的请假请求</view>
<view>
<text style="font-size: 12px!important;" class="text-gray margin-left-sm text-sm">{{timestampToTime(item.qjksrq)}}</text>
</view>
</view>
<view class="text-gray text-content text-sm">
<text style="font-size: 12px!important;">请假原因:</text>
<text style="font-size: 12px!important;">{{item.qjyy}}</text>
</view>
<view class="text-gray text-content text-sm">
<text style="font-size: 12px!important;">开始时间:</text>
<text style="font-size: 12px!important;">{{timestampToTime(item.qjksrq)}}</text>
</view>
<view class="text-gray text-content text-sm">
<text style="font-size: 12px!important;">结束时间:</text>
<text style="font-size: 12px!important;">{{timestampToTime(item.qjjsrq)}}</text>
</view>
<view class="margin-top-xs flex justify-between">
<view class="text-yellow text-sm">{{item.wfpname}}</view>
<view>
<text class="margin-left-sm text-sm text-blue" v-if="item.zt=='I'&&item.cjr==username" @tap.stop.prevent="confirm(item)" >撤销</text>
</view>
</view>
</view>
</view>
</view>
</view>
<!-- 内容通栏 -->
<!-- 确认模态框 -->
<view class="cu-modal" :class="modalName=='DialogModal1'?'show':''">
<view class="cu-dialog">
<view class="cu-bar bg-white justify-end">
<view class="content">提示</view>
<view class="action" @tap="hideModal">
<text class="cuIcon-close text-red"></text>
</view>
</view>
<view class="padding-xl bg-white">
是否撤销该请假请求?
</view>
<view class="cu-bar bg-white justify-end">
<view class="action">
<button class="cu-btn line-green text-green" @tap="hideModal">取消</button>
<button class="cu-btn bg-green margin-left" @tap="delqjd">确定</button>
</view>
</view>
</view>
</view>
<!-- 确认添加审批人 -->
<view class="cu-modal" :class="modalName=='DialogModal2'?'show':''">
<view class="cu-dialog">
<view class="cu-bar bg-white justify-end">
<view class="content">提示</view>
<view class="action" @tap="hideModal">
<text class="cuIcon-close text-red"></text>
</view>
</view>
<view class="padding-xl bg-white">
确定添加审批人?添加后将生成请假单,信息将不可更改
</view>
<view class="cu-bar bg-white justify-end">
<view class="action">
<button class="cu-btn line-green text-green" @tap="hideModal">取消</button>
<button class="cu-btn bg-green margin-left" @tap="confirmspr">确定</button>
</view>
</view>
</view>
</view>
<!-- 过滤框 -->
<view class="cu-modal bottom-modal" :class="modalName=='bottomModal'?'show':''">
<view class="cu-dialog">
<view class="cu-bar bg-white cu-dialog-title">
<view class="action cu-dialog-back">
<text class="cuIcon-unfold" @tap="hideModal"></text>
</view>
<text>筛选</text>
</view>
<view class="cu-bar bg-white margin-top">
<view class="action">
<text class="text12">状态</text>
</view>
</view>
<view class="cu-list grid col-3">
<view class="cu-item" v-for="(item,index) in spList" :key="index" @tap="tabSelectStatus" :data-id="index">
<button :class="index==selectStatus?'active-select cur':''">{{item.text}}</button>
</view>
</view>
<view class="cu-bar bg-white margin-top">
<view class="action">
<text class="">事务类型</text>
</view>
</view>
<scroll-view scroll-y="true" style="height: 240px;">
<view class="cu-list grid col-2">
<view class="cu-item" v-for="(item,index) in formList" :key="index" @tap="tabSelectselectForm" :data-id="index">
<button :class="index==selectForm?'active-select cur':''">{{item.text}}</button>
</view>
</view>
</scroll-view>
<view class="cu-bar bg-white cu-dialog-footer">
<button class=" " @tap="resetModal">重置</button>
<button class="text-blue active" @tap="modalSearch">确定</button>
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
const tabs = [{
title: '发起提交',
value: 0
}, {
title: '查看数据',
value: 1
}];
import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js";
export default {
mixins: [MescrollMixin], // 使用mixin
onReachBottom(e) {
this.pageNo++
this.apigetqjlist()
},
onLoad(e) {
let that=this
uni.getStorage({
key: 'userid',
success: function (res) {
console.log(res.data)
that.qjinfor.qjrid=res.data
}
});
uni.getStorage({
key: 'username',
success: function (res) {
console.log(res.data)
that.qjinfor.whr=res.data
that.username=res.data
}
});
let nowtime=new Date()
this.qjinfor.qjkssj=this.getNowdate(nowtime)
},
data() {
return {
username:"",
zt:"",
operatype:"A",
selectForm:"",
selectStatus:"",
spList:[
{id:"",text:"全部"},
{id:"S",text:"审批"},
{id:"I",text:"初始"},
{id:"C",text:"完成"},
],
formList:[
{id:"A",text:"全部"},{id:"W",text:"未处理"},
{id:"H",text:"已处理"}
],
delinfor:null,
nextinfo:null,
edit:null,
addinfor:"",
userid:"",
pageNo:1,
searchKey:"",
showlist:[],
qjlist:[
],
qjlx:["病假","事假","加班","调休","其他"],
qjinfor:{
whr:"",
qjrid:"",
qjyy:"",
qjlx:"",
qjkssj:"",
qjjssj:"",
qjsc:"",
},
modalName: null,
imgarry: [],
allsprlist: [],
sprlist: [
],
cksj: [{
bxr: "anger",
bxrq: "2021.01",
zt: "处理中",
bxdh: "1213800439",
bxzje: "年假"
},
{
bxr: "anger",
bxrq: "2021.01",
zt: "处理中",
bxdh: "1213800439",
bxzje: "年假"
}
],
imageValue: [
],
filesValue: [
],
bxmxlist: [{
bxje: "",
bxlb: "",
fxmx: ""
}],
tabs,
TabCur: 0,
scrollLeft: 0,
NavBarColor: this.NavBarColor,
upOption: {
page: {
num: 0, // 当前页码,默认0,回调之前会加1,即callback(page)会从1开始
size: 10 // 每页数据的数量
},
noMoreSize: 4, //如果列表已无数据,可设置列表的总数量要大于半页才显示无更多数据;避免列表数据过少(比如只有一条数据),显示无更多数据会不好看; 默认5
empty: {
tip: '~ 暂无数据 ~', // 提示
},
loading: '',
text: '全部',
isShowNoMore: false,
textNoMore: '我是有底线的 >_<'
},
msgList: [], //列表数据
read: "all",
announcement1: [],
msg1Count: "",
msg1Title: "",
announcement2: [],
msg2Count: "",
msg2Title: "",
url: "/sys/sysAnnouncementSend/getMyAnnouncementSend",
delUrl: '/sys/sysAnnouncementSend/delete',
listTouchStart: 0,
listTouchDirection: null,
}
},
onShow() {},
computed: {
zbxje() {
let num = 0
this.bxmxlist.forEach((e) => {
if (e.bxje) {
num = num + parseFloat(e.bxje)
}
})
return num
},
top() {
return this.CustomBar * 2 + 95
},
style() {
var StatusBar = this.StatusBar;
var CustomBar = this.CustomBar;
var style = `height:${CustomBar}px;padding-top:${StatusBar}px;`;
return style
},
},
filters: {
// timestampToTime: function (timestamp) {
//   let date = new Date(timestamp);
//   var YY = date.getFullYear() + '-';
//   var MM = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
//   var DD = (date.getDate() < 10 ? '0' + (date.getDate()) : date.getDate());
//   var hh = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
//   var mm = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()) + ':';
//   var ss = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
//   return YY + MM + DD +" "+hh + mm + ss;
// }
},
methods: {
resetModal(){
this.selectStatus=0
this.selectForm=0
this.zt=""
this.operatype="A"
},
searchinput(e){
this.searchKey=e
this.apisearch()
},
modalSearch(){
this.apisearch()
this.hideModal()
},
tabSelectselectForm(e){
this.selectForm=e.currentTarget.dataset.id
this.operatype= this.formList[e.currentTarget.dataset.id].id;
},
tabSelectStatus(e){
this.selectStatus=e.currentTarget.dataset.id
this.zt =this.spList[e.currentTarget.dataset.id].id;
},
showModal(e) {
this.modalName = e.currentTarget.dataset.target
},
confirmspr(){
let that=this
this.qjinfor.qjksrq=new Date(this.qjinfor.qjkssj).getTime()
this.qjinfor.qjjsrq=new Date(this.qjinfor.qjjssj).getTime()
if(!this.qjinfor.qjrid||!this.qjinfor.qjkssj||!this.qjinfor.qjjssj||!this.qjinfor.qjlx||!this.qjinfor.qjsc){
console.log(this.qjinfor)
uni.showToast({
title: '请填写必填项',
duration: 2000,
icon:"none"
});
that.hideModal()
}else{
that.hideModal()
this.edit=true
this.$http.post("/kqgl/ygqj/add",{details: [],master:this.qjinfor}).then(res => {
if (res.data.success) {
that.addinfor=res.data.data
for(let key in that.qjinfor){
that.addinfor.records[key]=that.qjinfor[key]
}
that.addinfor.qjsc=parseFloat(that.addinfor.qjsc)
that.addinfor.records.bz=""
that.addinfor.records.qjyy=that.qjinfor.qjyy
that.addinfor.records.whrid=that.qjinfor.qjrid
that.addinfor.records.cjr=that.qjinfor.whr
that.addinfor.records.username=that.qjinfor.whr
that.addinfor.records.cjrid=that.qjinfor.qjrid
that.addinfor.records.cjsj=new Date().getTime()
that.addinfor.records.whsj=new Date().getTime()
that.addinfor.records.wfoperate="1"
that.addinfor.records.sysversion=1
that.$http.post("kqgl/ygqj/wfnextinfo",that.addinfor.records).then(res => {
if (res.data.success) {
if(res.data.data.records[0].userList)
that.nextinfo=res.data.data.records[0]
that.allsprlist=res.data.data.records[0].userList
that.allsprlist.forEach(e=>{
if(e.mustSelect=="Y"){
that.sprlist.push(e)
}
})
this.$tip.toast("必选审批人已添加!");
that.modalName = "DrawerModalR"
} else {
}
});
} else {
}
});
}
},
apisearch(){
this.pageNo=1
this.showlist=[]
this.apigetqjlist()
},
// 获取请假列表
timestampToTime(timestamp){
let date = new Date(timestamp);
  var YY = date.getFullYear() + '-';
  var MM = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
  var DD = (date.getDate() < 10 ? '0' + (date.getDate()) : date.getDate());
  var hh = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
  var mm = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()) + ':';
  var ss = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
  return YY + MM + DD ;
},
apigetqjlist(){
this.$http.post("kqgl/ygqj/query",{operatype: this.operatype,zt:this.zt,qjr:this.searchKey,pageNo:this.pageNo,pageSize:"20"}).then(res=>{
if(res.data.success){
this.qjlist=res.data.data.records
this.qjlist.forEach(e=>{
this.showlist.push(e)
})
console.log(this.qjlist)
}else{
console.log("出差")
}
});
},
delqjd(){
let that=this
if(!this.delinfor){
this.$tip.toast("请选择要撤销的单子");
}else{
this.$http.post("kqgl/ygqj/delete",{master:{id:this.delinfor.id}}).then(res => {
if (res.data.success) {
that.$tip.toast("删除成功!")
that.apisearch()
} else {
that.$tip.toast(res.data.message||"删除失败");
}
});
}
that.hideModal()
},
confirm(e){
this.delinfor=e
this.modalName="DialogModal1"
},
ckqjxq(e){
this.$Router.push({
path: '/pages/common/qjxq', query:{
infor:e
},
})
},
getQjtype(value){
if(this.qjlx[value.detail.value]=="病假")
{
this.qjinfor.qjlxzw="病假"
this.qjinfor.qjlx="BJ"
}else if(this.qjlx[value.detail.value]=="事假"){
this.qjinfor.qjlxzw="事假"
this.qjinfor.qjlx="SJ"
}else if(this.qjlx[value.detail.value]=="加班"){
this.qjinfor.qjlxzw="加班"
this.qjinfor.qjlx="JB"
}else if(this.qjlx[value.detail.value]=="调休"){
this.qjinfor.qjlxzw="调休"
this.qjinfor.qjlx="TX"
}else if(this.qjlx[value.detail.value]=="其他"){
this.qjinfor.qjlxzw="其他"
this.qjinfor.qjlx="QT"
}
},
DateChange(value){
this.qjinfor.qjkssj=value.detail.value
},
DateChangeend(value){
this.qjinfor.qjjssj=value.detail.value
},
completeDate(value) {
return value < 10 ? "0"+value:value;
},
getNowdate(nowDate){
var char = "-";
if(nowDate == null){
nowDate = new Date();
}
var day = nowDate.getDate();
var month = nowDate.getMonth() + 1;//注意月份需要+1
var year = nowDate.getFullYear();
//补全0,并拼接
return year + char +this. completeDate(month) + char +this.completeDate(day);
},
// 添加审批人
addsprlist(e) {
let rep=true
if(!this.sprlist[0]){
this.sprlist.push(e)
this.modalName = null
rep=false
}else{
this.sprlist.forEach(a=>{
if(a.name==e.name){
this.modalName = null
this.$tip.toast("审批人重复了,请重新选择!");
rep=false
}
})
}
if(rep){
this.sprlist.push(e)
this.modalName = null
}
},
hideModal(e) {
this.modalName = null
},
// 跳转获取审批人信息
getspr() {
if(!this.addinfor){
this.modalName="DialogModal2"
}else{
this.modalName = "DrawerModalR"
}
// this.$Router.push({
// path: '/pages/addressbook/selectspr', query:{
// allinfor:{
// imgarry:this.imgarry,
// imageValue:this.imageValue
// }
// },
// })
},
// 删除审批人
delspr(index) {
if(this.sprlist[index].mustSelect=="Y"){
this.$tip.toast("必选审批人不可删除");
}else{
this.sprlist.splice(index, 1)
}
},
// 上传文件
upload(name, fileUrl) {
let that = this;
uni.uploadFile({
url: 'https://jsonplaceholder.typicode.com/posts',
filePath: fileUrl,
name: 'file',
header: {
"Content-Type": "multipart/form-data",
},
formData: {
// "api_token": that.api_token,
},
success: res => {
console.log(res)
// let url = JSON.parse(res.data).data.url;
// let size = JSON.parse(res.data).data.size;
// let suffix = JSON.parse(res.data).data.ext;
}
})
},
// 数据单详情
getxxxx(e) {
this.$Router.push({
path: '/pages/addressbook/xxxx',
query: {
infor: e
},
})
},
// 提交按钮
allsubmit() {
let that=this
if(!this.sprlist[0]){
this.$tip.toast("请先选择审批人");
}else{
this.$http.post("kqgl/ygqj/wfgo",{nextinfo:this.nextinfo,records:[this.addinfor.records]}).then(res => {
if (res.data.success) {
that.$tip.toast("提交成功!");
that.$Router.push({
path: '/pages/common/ygqj', query:{
},
})
} else {
that.$tip.toast(res.data.message);
}
});
}
// this.imgarry.forEach(e => {
// this.upload(e.tempFiles[0].name, e.tempFiles[0].path)
// })
// this.$http.post("/upload").then(res => {
// if (res.data.success) {
// this.smsCountDown = 60;
// this.startSMSTimer();
// } else {
// this.smsCountDown = 0;
// this.$tip.toast(res.data.message);
// }
// });
// this.imgarry.forEach(e => {
// this.upload(e.tempFiles[0].name, e.tempFiles[0].path)
// })
},
// 获取上传状态
tpdel(f) {
console.log(f)
this.imgarry.forEach((e, index) => {
if (f.tempFile.path == e.tempFiles[0].path) {
this.imgarry.splice(index, 1)
}
})
console.log(this.imgarry)
},
tpselect(e) {
this.imgarry.push(e)
console.log(this.imgarry)
},
// 获取上传进度
tpprogress(e) {
console.log('上传进度:', e)
},
// 上传成功
tpsuccess(e) {
console.log('上传成功')
},
// 上传失败
tpfail(e) {
console.log('上传失败:', e)
},
addbxmxlist() {
let addobj = {
bxje: "",
bxlb: "",
fxmx: ""
}
this.bxmxlist.push(addobj)
console.log(this.bxmxlist)
},
// unique(arr) {
// var obj = {};
// return arr.filter(function(item, index, arr){
// return obj.hasOwnProperty(typeof item + item) ? false : (obj[typeof item + item] = true)
// })
// },
upCallback(page) {
//联网加载数据
console.log("tabindex", this.TabCur)
let keyword = this.TabCur
if (keyword == 0) {
this.$http.get(this.url, {
params: {
pageNo: page.num,
pageSize: page.size,
msgCategory: '1'
}
}).then(res => {
//联网成功的回调,隐藏下拉刷新和上拉加载的状态;
this.announcement1 = res.data.result.records
this.mescroll.endSuccess(this.announcement1.length);
//console.log("url", res)
//设置列表数据
if (res.data.success) {
console.log("res", res.data)
this.msg1Count = res.data.result.total
this.msg1Title = "通知(" + res.data.result.total + ")";
for (let annItem of this.announcement1) {
this.msgList.push(annItem)
}
}
if (page.num == 1) {
this.msgList = []; //如果是第一页需手动制空列表
this.msgList = this.msgList.concat(this.announcement1); //追加新数据
}
}).catch(() => {
//联网失败, 结束加载
this.mescroll.endErr();
})
}
if (keyword == 1) {
this.$http.get(this.url, {
params: {
pageNo: page.num,
pageSize: page.size,
msgCategory: '2'
}
}).then(res => {
//联网成功的回调,隐藏下拉刷新和上拉加载的状态;
this.announcement2 = res.data.result.records
this.mescroll.endSuccess(this.announcement2.length, this.msgCount);
//设置列表数据
if (res.data.success) {
console.log("res sys", res.data)
this.msg2Count = res.data.result.total
this.msg2Title = "通知(" + res.data.result.total + ")";
// this.announcement2.filter((item,index) => {
// // console.log("item",item)
// if(item.anntId == this.announcement2[index+1].anntId){
// this.announcement2.splice(item,1)
for (let item of this.announcement2) {
this.msgList.push(item)
}
// }
// })
}
if (page.num == 1) {
this.msgList = []; //如果是第一页需手动制空列表
this.msgList = this.msgList.concat(this.announcement2); //追加新数据
}
}).catch(() => {
//联网失败, 结束加载
this.mescroll.endErr();
})
}
},
tabSelect(e) {
this.TabCur = e.currentTarget.dataset.id;
if(e.currentTarget.dataset.id==1){
this.apisearch()
}
this.scrollLeft = (e.currentTarget.dataset.id - 1) * 60;
this.msgList = [] // 先置空列表,显示加载进度
},
goAnnotationDetail(item) {
//item.readFlag = '1'
this.mescroll.resetUpScroll()
if (item.openType == "component" && item.openPage.indexOf('email') >= 0) {
this.goEmailDetailPage(item)
} else {
// console.log("detail",encodeURIComponent(JSON.stringify(item)))
uni.navigateTo({
url: '/pages/annotation/annotationDetail?item=' + encodeURIComponent(JSON.stringify(item))
});
}
},
isEmail(item) {
if (item.openType == "component" && item.openPage.indexOf('email') >= 0) {
return true;
} else {
return false;
}
},
goEmailDetailPage(item) {
console.log("go", item.anntId)
console.log("item", item)
if (item.readFlag == '0') {
//item.readFlag = '1'
this.mescroll.resetUpScroll()
let readUrl = '/sys/sysAnnouncementSend/editByAnntIdAndUserId';
this.$http.put(readUrl, {
anntId: item.anntId
})
}
// console.log("goe",item.busId)
uni.navigateTo({
url: '/pages/mail/mailDetail?id=' + item.busId
});
},
ListTouchStart(e) {
this.listTouchStart = e.touches[0].pageX
},
// ListTouch计算方向
ListTouchMove(e) {
this.listTouchDirection = e.touches[0].pageX - this.listTouchStart > 0 ? 'right' : 'left'
},
// ListTouch计算滚动
ListTouchEnd(e) {
if (this.listTouchDirection == 'left') {
this.modalName = e.currentTarget.dataset.target
} else {
this.modalName = null
}
this.listTouchDirection = null
},
deleteAnnotation(item) {
this.$http.delete(this.delUrl + '?id=' + item.id).then(res => {
console.log("结果数据9", res)
if (res.data.success) {
this.mescroll.resetUpScroll()
}
}).catch(e => {
console.log("al delUrl请求错误2", e)
this.mescroll.endErr();
})
},
formatDate(text, len) {
if (!text || text.length == 0) {
return ''
}
if (text.length < len) {
return text;
}
return text.substr(0, len)
},
titleFilter(text, len) {
if (!text || text.length == 0) {
return ''
}
if (text.length < len) {
return text;
}
return text.substr(0, len) + "..."
}
}
}
</script>
<style scoped>
/* 头条小程序组件内不能引入字体 */
/* #ifdef MP-TOUTIAO */
@font-face {
font-family: uniicons;
font-weight: normal;
font-style: normal;
src: url('~@/static/uni.ttf') format('truetype');
}
/* #endif */
/* #ifndef APP-NVUE */
page {
display: flex;
flex-direction: column;
box-sizing: border-box;
background-color: #efeff4;
min-height: 100%;
height: auto;
}
view {
line-height: inherit;
}
.example {
padding: 0 15px 15px;
}
.example-info {
padding: 15px;
color: #3b4144;
background: #ffffff;
}
.example-body {
width: 100%;
flex-direction: row;
flex-wrap: wrap;
justify-content: center;
padding: 0;
font-size: 14px;
background-color: #ffffff;
}
/* #endif */
.example {
padding: 0 15px;
}
.example-info {
/* #ifndef APP-NVUE */
display: block;
/* #endif */
padding: 15px;
color: #3b4144;
background-color: #ffffff;
font-size: 14px;
line-height: 20px;
}
.example-info-text {
font-size: 14px;
line-height: 20px;
color: #3b4144;
}
.example-body {
flex-direction: column;
padding: 15px;
background-color: #ffffff;
}
.word-btn-white {
font-size: 18px;
color: #FFFFFF;
}
.word-btn {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: row;
align-items: center;
justify-content: center;
border-radius: 6px;
height: 48px;
margin: 15px;
background-color: #007AFF;
}
.word-btn--hover {
background-color: #4ca2ff;
}
.search-result {
margin-top: 10px;
margin-bottom: 20px;
text-align: center;
}
.search-result-text {
text-align: center;
font-size: 14px;
}
.example-body {
/* #ifndef APP-NVUE */
display: block;
/* #endif */
padding: 0px;
}
.search-btn{
font-size: 12px;
width: 54px;
background-color: white;
border: 1px solid lightgray;
padding: 0;
}
.bottom-modal uni-button{
font-size: 12px;
color: #555555;
background: white;
}
.bottom-modal .active-select{
color: white;
background-color: #0081FF;
}
.bottom-modal .cu-list.grid>.cu-item{
padding: 10upx 20px;
}
.bottom-modal .cu-list.grid>.cu-item>uni-button{
width: 100%;
}
.cu-dialog-footer button{
padding: 0 40px;
font-size: 14px;
}
.cu-dialog-footer button:last-child{
color: white;
background-color: #007AFF;
}
.process-page .cu-list.menu-avatar.comment>.cu-item{
padding: 15px;
}
.process-page .text-sm{
font-size: 12px;
}
*{
font-size: 14px!important;
}
.uni-card__head-padding {
background-color: #007AFF !important;
color: #FFFFFF;
}
.red {
color: red;
}
.e-btn {
margin-bottom: 1rem;
}
.titlePad {
margin-top: 0.6rem;
}
.cu-list>.move-cur {
transform: translateX(-150rpx);
}
.nav .cu-item.cur {
position: flex;
z-index: 9;
border-bottom: 4upx solid;
}
.bordp {
padding-bottom: 10px;
border-bottom: 5px solid #EEEEEE;
}
.bordb {
padding-top: 10px;
border-top: 5px solid #EEEEEE;
}
</style>
<template>
<view class="bg-white">
<!-- <l-file ref="lFile" @up-success="onSuccess"></l-file> -->
<cu-custom bgColor="bg-white" isBack="true">
<slot slot="backText">返回</slot>
</cu-custom>
<view class="bg-white nav fixed" :style="[{top:CustomBar + 'px'}]">
<view class="flex text-center">
<view class="cu-item flex-sub" :class="index==TabCur?'text-orange cur':''" v-for="(item,index) in tabs" :key="index" @tap="tabSelect" :data-id="index">
{{item.title}}
</view>
</view>
</view>
<view class="cu-modal drawer-modal justify-end" :class="modalName=='DrawerModalR'?'show':''" @tap="hideModal">
<view class="cu-dialog basis-lg" style="overflow: auto;" @tap.stop=""
:style="[{top:CustomBar+'px',height:'calc(100vh - ' + CustomBar + 'px)'}]">
<view class="cu-bar bg-white solid-bottom margin-top">
<view class="action">
<text class="cuIcon-title text-orange "></text> 选择审批人
</view>
</view>
<view class="cu-list menu-avatar">
<view v-for="(item,index) in allsprlist" :key="index" class="cu-item" @tap="addsprlist(item)">
<view class="cu-avatar round lg">
<view class="cu-avatar round lg margin-xs ">
<text class="avatar-text">{{item.name.substr(0,1)}}</text>
</view>
</view>
<view class="content">
<view class="text-grey">{{item.name}}</view>
<view class="text-gray text-sm flex">
<view class="text-cut">
{{item.infor}}
</view>
</view>
</view>
<view class="action">
</view>
</view>
</view>
</view>
</view>
<view class="container">
<view class="solid-bottom">
<scroll-view scroll-x class="bg-white nav text-center ">
<view class="flex text-center justify-around">
<view class="cu-item" :class="item.value==TabCur?'text-blue cur':''"
v-for="(item,index) in tabs" :key="index" @tap="tabSelect" :data-id="item.value">
{{item.title}}
</view>
</view>
</scroll-view>
</view>
<view v-if="TabCur==0" class="">
<!-- 总报销 -->
<view >
<!-- <view class="action"
style="padding-top: 5px;padding-bottom: 5px;padding-left: 20px;background-color: #EEEEEE;">
新增工作任务
</view> -->
<view class="cu-form-group">
<view class="title"><span class="red">*</span>项目</view>
<picker mode="selector" :range="gzxmlist" value="0" @change="getgzxm" range-key="mc" >
<view class="picker">
{{gzxm.mc||"请选择"}}
</view>
</picker>
</view>
<view class="cu-form-group">
<view class="title"><span class="red">*</span>提出人</view>
<picker mode="selector" :range="tcrlist" value="0" @change="gettcr" range-key="USERS_USERNAME" >
<view class="picker">
{{tcr.USERS_USERNAME||"请选择"}}
</view>
</picker>
</view>
<view class="cu-form-group">
<view class="title"><span class="red">*</span>责任人</view>
<picker mode="selector" :range="tcrlist" value="0" @change="getzrr" range-key="USERS_USERNAME" >
<view class="picker">
{{zrr.USERS_USERNAME||"请选择"}}
</view>
</picker>
</view>
<view class="cu-form-group ">
<view class="title"><span class="red">*</span>计划完成日期</view>
<picker mode="date" @change="getjhwcrq">
<view class="picker">
{{jhwcrq||"请选择"}}
</view>
</picker>
</view>
<view class="cu-form-group ">
<view class="title"><span class="red">*</span>主题</view>
<input name="input" v-model="zt"></input>
</view>
<view class="cu-form-group align-start" style="border-bottom:0.5px solid #EEEEEE;">
<view class="title"><span class="red">*</span>内容</view>
<textarea v-model="gznr" maxlength="-1" :disabled="modalName!=null"
placeholder="请输入明细"></textarea>
</view>
</view>
<!-- 新增按钮 -->
<!-- 总报销金额 -->
<!-- <view style="border-bottom: 5px solid #eee;padding-bottom: 10px;">
<view class="action"
style="padding-top: 5px;padding-bottom: 5px;padding-left: 20px;background-color: #EEEEEE;">
</text>总报销金额(元):{{zbxje}}
</view>
<view class="cu-form-group margin-top">
<view class="title">添加图片</view>
</view>
<uni-file-picker style="margin-left: 10px;" ref="img" :auto-upload="false" v-model="imageValue"
fileMediatype="image" mode="grid" @select="tpselect" @progress="tpprogress" @success="tpsuccess"
@fail="tpfail" @delete="tpdel" />
</view> -->
<!-- <view class="padding">
<button class="cu-btn block bg-blue margin-tb-sm lg" @tap="onUpload">上传</button>
</view> -->
<!-- <view class="cu-form-group flex " >
<view class="title" style="line-height: 50px;">添加附件</view>
</view> -->
<!-- <uni-file-picker style="margin-left: 10px;margin-top: 10px;" ref="files" :auto-upload="false"
v-model="filesValue" fileMediatype="file" mode="grid" @select="tpselect" @progress="tpprogress"
@success="tpsuccess" @fail="tpfail" @delete="tpdel" /> -->
<view class="padding-xl" style="border: 0.5 solid #EEEEEE;">
<button class="cu-btn block bg-blue margin-tb-sm lg" @tap="allsubmit()">
</text>提交</button>
</view>
</view>
</view>
<!-- 确认模态框 -->
<view class="cu-modal" :class="modalName=='DialogModal1'?'show':''">
<view class="cu-dialog">
<view class="cu-bar bg-white justify-end">
<view class="content">提示</view>
<view class="action" @tap="hideModal">
<text class="cuIcon-close text-red"></text>
</view>
</view>
<view class="padding-xl bg-white">
是否撤销该任务?
</view>
<view class="cu-bar bg-white justify-end">
<view class="action">
<button class="cu-btn line-green text-green" @tap="hideModal">取消</button>
<button class="cu-btn bg-green margin-left" @tap="apicxsjsc()">确定</button>
</view>
</view>
</view>
</view>
<view v-if="TabCur==1" class="">
<!-- 一般用法 -->
<!-- <view class="cu-bar bg-white search" style="border-bottom: 0.5px solid #EEEEEE;" >
<view class="search-form round">
<text class="cuIcon-search"></text>
<input type="text" v-model="searchKey" placeholder="输入搜索的关键词" confirm-type="search" ></input>
</view>
<view class="action">
<button class="cu-btn bg-gradual-blue shadow-blur" @tap="searchtap()" >搜索</button>
</view>
</view> -->
<view class="cu-bar bg-white search" >
<view class="example-body">
<uni-search-bar placeholder="请输入内容" @input="searchinput"></uni-search-bar>
</view>
<view class="action" style="margin-right: 8px;">
<text class="cu-btn round search-btn" @tap="showModal" data-target="bottomModal">
<text class="cuIcon-filter"></text>筛选</text>
</view>
</view>
<view class="cu-list menu-avatar comment">
<view class="cu-item" v-for="(item,index) in showlist" :key="index" :data-id="index" style="padding:15px;" @tap="getxxxx(item)">
<view class="content">
<view class="margin-top-sm flex justify-between">
<view class="" style="font-size: 15px!important;color: #000000;">{{item.cjr}}提交的工作任务</view>
<view>
<text style="font-size: 12px!important;" class="text-gray margin-left-sm text-sm">{{timestampToTime(item.whsj)}}</text>
</view>
</view>
<view class="text-gray text-content text-sm">
<text style="font-size: 12px!important;">任务单号:</text>
<text style="font-size: 12px!important;">{{item.rwid}}</text>
</view>
<view class="text-gray text-content text-sm">
<text style="font-size: 12px!important;">项目名称:</text>
<text style="font-size: 12px!important;">{{item.mc}}</text>
</view>
<view class="text-gray text-content text-sm">
<text style="font-size: 12px!important;">主题:</text>
<text style="font-size: 12px!important;">{{item.title}}</text>
</view>
<view class="text-gray text-content text-sm">
<text style="font-size: 12px!important;">责任人:</text>
<text style="font-size: 12px!important;">{{item.username}}</text>
</view>
<view class="margin-top-xs flex justify-between">
<view class="text-yellow text-sm">{{item.wfpname}}</view>
<view>
<text class="margin-left-sm text-sm text-blue" v-if="item.wfpname=='开始'&&item.cjr==username" @tap.stop.prevent="confirm(item)" >撤销</text>
</view>
</view>
</view>
</view>
</view>
<view class="cu-modal bottom-modal" :class="modalName=='bottomModal'?'show':''">
<view class="cu-dialog">
<view class="cu-bar bg-white cu-dialog-title">
<view class="action cu-dialog-back">
<text class="cuIcon-unfold" @tap="hideModal"></text>
</view>
<text>筛选</text>
</view>
<view class="cu-bar bg-white margin-top">
<view class="action">
<text class="text12">状态</text>
</view>
</view>
<view class="cu-list grid col-3">
<view class="cu-item" v-for="(item,index) in spList" :key="index" @tap="tabSelectStatus" :data-id="index">
<button :class="index==selectStatus?'active-select cur':''">{{item.text}}</button>
</view>
</view>
<view class="cu-bar bg-white margin-top">
<view class="action">
<text class="">事务类型</text>
</view>
</view>
<scroll-view scroll-y="true" style="height: 240px;">
<view class="cu-list grid col-2">
<view class="cu-item" v-for="(item,index) in formList" :key="index" @tap="tabSelectselectForm" :data-id="index">
<button :class="index==selectForm?'active-select cur':''">{{item.text}}</button>
</view>
</view>
</scroll-view>
<view class="cu-bar bg-white cu-dialog-footer">
<button class=" " @tap="resetModal">重置</button>
<button class="text-blue active" @tap="modalSearch">确定</button>
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
const tabs = [{
title: '发起提交',
value: 0
}, {
title: '查看数据',
value: 1
}];
import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js";
export default {
mixins: [MescrollMixin], // 使用mixin
onReachBottom(e) {
this.pageNo++
this.apigetqjlist()
},
onLoad() {
let that=this
uni.getStorage({
key: 'username',
success: function (res) {
console.log(res.data);
that.username=res.data
console.log(that.username)
}
});
this.apigetgzxm()
this.apigettcrlist()
// this.apigetfyxmlist()
// this.apigetfyxmlist1()
// this.apigetfyxmlist2()
// this.apigetxmlist()
},
data() {
return {
username:"",
selectStatus:0,
selectForm:1,
swlx:"W",
zt:"",
spList:[
{id:"",text:"全部"},
{id:"I",text:"初始"},
{id:"E",text:"执行"},
{id:"A",text:"确认"},
{id:"C",text:"完成"},
],
formList:[
{id:"A",text:"全部"},{id:"W",text:"未处理"},
{id:"H",text:"已处理"}
],
gznr:"",
jhwcrq:"",
zrr:"",
// 工作提出人list
tcrlist:[],
tcr:"",
delinfor:"",
// 提交基础url
TJBASE:"",
// 项目列表
xmlist:[],
// 费用项目
fyxmlist:[],
// 报销是由
bxsy:"",
// 结束日期
jsrq:"",
// 开始日期
ksrq:"",
//报销日期
bxrq:"",
// 工作项目
gzxm:[],
//项目list
gzxmlist:[],
searchKey:"",
pageNo:1,
bxlist:[],
showlist:[],
modalName: null,
imgarry: [],
allsprlist: [{
name: "张三",
infor: "测试"
},
{
name: "李四",
infor: "测试"
}
],
sprlist: [
],
cksj: [{
bxr: "anger",
bxrq: "2021.01",
zt: "处理中",
bxdh: "1213800439",
bxzje: "1000"
},
{
bxr: "anger",
bxrq: "2021.01",
zt: "处理中",
bxdh: "1213800439",
bxzje: "1000"
}
],
imageValue: [
],
filesValue: [
],
bxmxlist: [],
tabs,
TabCur: 0,
scrollLeft: 0,
NavBarColor: this.NavBarColor,
upOption: {
page: {
num: 0, // 当前页码,默认0,回调之前会加1,即callback(page)会从1开始
size: 10 // 每页数据的数量
},
noMoreSize: 4, //如果列表已无数据,可设置列表的总数量要大于半页才显示无更多数据;避免列表数据过少(比如只有一条数据),显示无更多数据会不好看; 默认5
empty: {
tip: '~ 暂无数据 ~', // 提示
},
loading: '',
text: '全部',
isShowNoMore: false,
textNoMore: '我是有底线的 >_<'
},
msgList: [], //列表数据
read: "all",
announcement1: [],
msg1Count: "",
msg1Title: "",
announcement2: [],
msg2Count: "",
msg2Title: "",
url: "/sys/sysAnnouncementSend/getMyAnnouncementSend",
delUrl: '/sys/sysAnnouncementSend/delete',
listTouchStart: 0,
listTouchDirection: null,
}
},
onShow() {},
filters: {
ztTrans: function(a) {
const ztList = {"S": "审批", "I":"提出","F":"支付",3:"撤回",4:"转交",5:"调度"};
return ztList[a]
},
},
computed: {
zfpje(){
let num = 0
this.bxmxlist.forEach((e) => {
if (e.fpje) {
num = num + parseFloat(e.fpje)
}
})
return num
},
zbxje() {
let num = 0
this.bxmxlist.forEach((e) => {
if (e.bxje) {
num = num + parseFloat(e.bxje)
}
})
return num
},
top() {
return this.CustomBar * 2 + 95
},
style() {
var StatusBar = this.StatusBar;
var CustomBar = this.CustomBar;
var style = `height:${CustomBar}px;padding-top:${StatusBar}px;`;
return style
},
},
methods: {
resetModal(){
this.selectStatus=0
this.selectForm=1
this.swlx="W"
this.zt=""
},
searchinput(e){
this.searchKey=e
this.searchtap()
},
modalSearch(){
this.searchtap()
this.hideModal()
},
tabSelectselectForm(e){
this.selectForm=e.currentTarget.dataset.id
this.swlx= this.formList[e.currentTarget.dataset.id].id;
},
tabSelectStatus(e){
this.selectStatus=e.currentTarget.dataset.id
this.zt =this.spList[e.currentTarget.dataset.id].id;
},
showModal(e) {
this.modalName = e.currentTarget.dataset.target
},
/* 上传 */
onUpload() {
/**
* currentWebview: 当前webview
* url:上传接口地址
* name:附件key,服务端根据key值获取文件流,默认file,上传文件的key
* header: 上传接口请求头
*/
console.log('--------------------');
this.$refs.lFile.upload({
// #ifdef APP-PLUS
//(app端必传)nvue页面使用时请查阅nvue获取当前webview的api,当前示例为vue窗口
currentWebview: this.$mp.page.$getAppWebview(),
// #endif
//替换为你的上传接口地址
url: 'http://119.3.92.249:18080/dmg/dmg/xmrw/attachment/upload',
// 服务端接收附件的key
name: 'file',
//根据你接口需求自定义 (优先不传content-type,安卓端无法收到参数再传)
header: {
'Authorization': 'bearer eyJhbGciOiJSUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VySW5mbyI6eyJ1c2VyTmFtZSI6',
'uid': '27682',
'client': 'app',
'accountid': 'DPOA9487'
},
// 限制选择附件的大小上限,默认10M
// maxSize: 20,
// 若需要在body单独添加附件名或附件大小如下方式传入组件:
// addName: '后端要的附件名称字段key,此处请勿写name的同值如(file),会覆盖name',
// addSize: '后端要的附件大小字段key'
// body参数直接写key,value,如:
// date: '2020-1-1',
// key2: 'value2',
});
},
onSuccess(res) {
console.log('上传成功回调',JSON.stringify(res));
uni.showToast({
title: JSON.stringify(res),
icon: 'none'
})
},
confirm(e){
this.delinfor=e
this.modalName="DialogModal1"
},
// 查看数据删除
apicxsjsc(){
console.log(this.delinfor)
let that=this
let url="dmg/xmrw/delete"
this.$http.post(url,{
master:{
id:this.delinfor.id,
}
}).then(res=>{
if(res.data.success){
that.$tip.toast("删除成功");
this.hideModal()
that.searchtap()
}else{
that.$tip.toast(res.data.message||"操作失败");
this.hideModal()
}
});
},
getxm(e,index){
this.bxmxlist[index].xm=this.xmlist[e.detail.value]
this.bxmxlist[index].xmid=this.xmlist[e.detail.value].code
},
// 获取选中责任人
getzrr(e){
this.zrr=this.tcrlist[e.detail.value]
},
// 获取选中的提出人
gettcr(e){
this.tcr=this.tcrlist[e.detail.value]
},
// 获取提出人列表
apigettcrlist(){
let that=this
this.$http.post("kzzx/fzsr/select",{id:"402881826c23e82d016c23ec00e80004",condition:""}).then(res=>{
if(res.data.success){
that.tcrlist=res.data.data.records
}else{
that.$tip.toast(res.data.message||"工作提出人获取失败");
}
});
},
// 获取项目列表
apigetxmlist(){
let that=this
this.$http.post("xmgl/gcxm/queryUsedGcxm",{}).then(res=>{
if(res.data.success){
that.xmlist=res.data.data.records
}else{
that.$tip.toast(res.data.message||"项目获取失败");
}
});
},
// 获取费用明细
getfyxm(e,index){
this.bxmxlist[index].fyxm=this.fyxmlist[e.detail.value]
this.bxmxlist[index].xh=this.fyxmlist[e.detail.value].xh
this.bxmxlist[index].fyxmid=this.fyxmlist[e.detail.value].fyxmid
this.TJBASE=this.fyxmlist[e.detail.value].mid
},
// 获取费用项目
apigetfyxmlist(){
let that=this
this.$http.post("fybx/fyflmx/query",{mid:"8ad0327e6b8c7b8a016b8cb3803a0012"}).then(res=>{
if(res.data.success){
that.fyxmlist=res.data.data.records
}else{
that.$tip.toast(res.data.message||"项目获取失败");
}
});
},
// 获取费用项目1
apigetfyxmlist1(){
let that=this
this.$http.post("fybx/fyflmx/query",{mid: "8ad0327e6c426f83016c42701ebc0005"}).then(res=>{
if(res.data.success){
res.data.data.records.forEach(e=>{
that.fyxmlist.push(e)
})
}else{
that.$tip.toast(res.data.message||"项目获取失败");
}
});
},
// 获取费用项目2
apigetfyxmlist2(){
let that=this
this.$http.post("fybx/fyflmx/query",{mid: "8ad0327e6c6ee3cc016c6ee4be480001"}).then(res=>{
if(res.data.success){
res.data.data.records.forEach(e=>{
that.fyxmlist.push(e)
})
}else{
that.$tip.toast(res.data.message||"项目获取失败");
}
});
},
// 获得结束日期
getjsrq(e){
this.jsrq=e.detail.value
},
// 获取报销日期
getjhwcrq(e){
this.jhwcrq=e.detail.value
},
// 获取工作项目
getgzxm(e){
let index=e.detail.value
this.gzxm=this.gzxmlist[index]
},
// 获取工作项目列表
apigetgzxm(){
let that=this
this.$http.post("dmg/pd/query",{}).then(res=>{
if(res.data.success){
that.gzxmlist=res.data.data.records
}else{
that.$tip.toast(res.data.message||"获取报销人列表失败");
}
});
},
searchtap(){
this.pageNo=1
this.showlist=[]
this.apigetqjlist()
},
timestampToTime(timestamp){
let date = new Date(timestamp);
  var YY = date.getFullYear() + '-';
  var MM = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
  var DD = (date.getDate() < 10 ? '0' + (date.getDate()) : date.getDate());
  var hh = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
  var mm = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()) + ':';
  var ss = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
  return YY + MM + DD ;
},
// 费用报销请求列表
apigetqjlist(){
let that=this
this.$http.post("dmg/xmrw/query",{"swlx":this.swlx,"zt":this.zt,"bxdh": "","content":this.searchKey,"pageNo": this.pageNo,"pageSize": 20}).then(res=>{
if(res.data.success){
that.bxlist=res.data.data.records
that.bxlist.forEach(e=>{
that.showlist.push(e)
})
console.log(that.bxlist)
}else{
console.log("请求失败")
}
});
},
// 删除明细
scmx(index){
this.bxmxlist.splice(index, 1)
},
// 添加审批人
addsprlist(e) {
this.sprlist.push(e)
this.modalName = null
},
hideModal(e) {
this.modalName = null
},
// 跳转获取审批人信息
getspr() {
this.modalName = "DrawerModalR"
// this.$Router.push({
// path: '/pages/addressbook/selectspr', query:{
// allinfor:{
// imgarry:this.imgarry,
// imageValue:this.imageValue
// }
// },
// })
},
// 删除审批人
delspr(index) {
this.sprlist.splice(index, 1)
},
// 上传文件
upload(name, fileUrl) {
console.log(name)
console.log(fileUrl)
let that = this;
uni.uploadFile({
url: 'http://localhost:9080/dmg/dmg/xmrw/attachment/upload',
filePath: fileUrl,
name: name,
header: {
"Content-Type": "multipart/form-data",
},
formData: {
method: 'POST' //请求方式
},
success: res => {
console.log(res)
// let url = JSON.parse(res.data).data.url;
// let size = JSON.parse(res.data).data.size;
// let suffix = JSON.parse(res.data).data.ext;
}
})
},
// 数据单详情
getxxxx(e) {
this.$Router.push({
path: '/pages/gzrw/gzrwxq',
query: {
infor: e
},
})
},
// 提交按钮
allsubmit() {
let that=this
let master={}
master.cpid=this.gzxm.id
master.content=this.gznr
master.jhwcsj=this.jhwcrq
master.tcrid=this.tcr.USERS_USERID
master.zrrid=this.zrr.USERS_USERID
master.title=this.zt
console.log(master)
if(master.cpid&&master.content&&master.jhwcsj&&master.tcrid&&master.zrrid&&master.title){
this.$http.post("dmg/xmrw/add",{details:[],master}).then(res=>{
if(res.data.success){
that.$tip.toast(res.data.message||"添加工作任务成功");
that.$Router.push({
path: '/pages/gzrw/gzrwcj', query:{
},
})
}else{
that.$tip.toast(res.data.message||"获取报销人列表失败");
}
});
}else{
that.$tip.toast("请补充工作任务信息");
}
// this.imgarry.forEach(e => {
// this.upload(e.tempFiles[0].name, e.tempFiles[0].path)
// })
// this.TabCur=1
},
// 获取上传状态
tpdel(f) {
console.log(f)
this.imgarry.forEach((e, index) => {
if (f.tempFile.path == e.tempFiles[0].path) {
this.imgarry.splice(index, 1)
}
})
console.log(this.imgarry)
},
tpselect(e) {
this.imgarry.push(e)
console.log(this.imgarry)
},
// 获取上传进度
tpprogress(e) {
console.log('上传进度:', e)
},
// 上传成功
tpsuccess(e) {
console.log('上传成功')
},
// 上传失败
tpfail(e) {
console.log('上传失败:', e)
},
addbxmxlist() {
let addobj = {
bz:"",
ksrq:"",
jsrq:"",
zf03:"",
zf02:"",
zf01:"",
fpje:"",
bxje:"",
xm:"",
fyxm:"",
bxje: "",
bxlb: "",
fxmx: "",
}
this.bxmxlist.push(addobj)
console.log(this.bxmxlist)
},
// unique(arr) {
// var obj = {};
// return arr.filter(function(item, index, arr){
// return obj.hasOwnProperty(typeof item + item) ? false : (obj[typeof item + item] = true)
// })
// },
upCallback(page) {
//联网加载数据
console.log("tabindex", this.TabCur)
let keyword = this.TabCur
if (keyword == 0) {
this.$http.get(this.url, {
params: {
pageNo: page.num,
pageSize: page.size,
msgCategory: '1'
}
}).then(res => {
//联网成功的回调,隐藏下拉刷新和上拉加载的状态;
this.announcement1 = res.data.result.records
this.mescroll.endSuccess(this.announcement1.length);
//console.log("url", res)
//设置列表数据
if (res.data.success) {
console.log("res", res.data)
this.msg1Count = res.data.result.total
this.msg1Title = "通知(" + res.data.result.total + ")";
for (let annItem of this.announcement1) {
this.msgList.push(annItem)
}
}
if (page.num == 1) {
this.msgList = []; //如果是第一页需手动制空列表
this.msgList = this.msgList.concat(this.announcement1); //追加新数据
}
}).catch(() => {
//联网失败, 结束加载
this.mescroll.endErr();
})
}
if (keyword == 1) {
this.$http.get(this.url, {
params: {
pageNo: page.num,
pageSize: page.size,
msgCategory: '2'
}
}).then(res => {
//联网成功的回调,隐藏下拉刷新和上拉加载的状态;
this.announcement2 = res.data.result.records
this.mescroll.endSuccess(this.announcement2.length, this.msgCount);
//设置列表数据
if (res.data.success) {
console.log("res sys", res.data)
this.msg2Count = res.data.result.total
this.msg2Title = "通知(" + res.data.result.total + ")";
// this.announcement2.filter((item,index) => {
// // console.log("item",item)
// if(item.anntId == this.announcement2[index+1].anntId){
// this.announcement2.splice(item,1)
for (let item of this.announcement2) {
this.msgList.push(item)
}
// }
// })
}
if (page.num == 1) {
this.msgList = []; //如果是第一页需手动制空列表
this.msgList = this.msgList.concat(this.announcement2); //追加新数据
}
}).catch(() => {
//联网失败, 结束加载
this.mescroll.endErr();
})
}
},
tabSelect(e) {
this.TabCur = e.currentTarget.dataset.id;
if(this.TabCur==1){
this.searchtap()
}
this.scrollLeft = (e.currentTarget.dataset.id - 1) * 60;
this.msgList = [] // 先置空列表,显示加载进度
},
goAnnotationDetail(item) {
//item.readFlag = '1'
this.mescroll.resetUpScroll()
if (item.openType == "component" && item.openPage.indexOf('email') >= 0) {
this.goEmailDetailPage(item)
} else {
// console.log("detail",encodeURIComponent(JSON.stringify(item)))
uni.navigateTo({
url: '/pages/annotation/annotationDetail?item=' + encodeURIComponent(JSON.stringify(item))
});
}
},
isEmail(item) {
if (item.openType == "component" && item.openPage.indexOf('email') >= 0) {
return true;
} else {
return false;
}
},
goEmailDetailPage(item) {
console.log("go", item.anntId)
console.log("item", item)
if (item.readFlag == '0') {
//item.readFlag = '1'
this.mescroll.resetUpScroll()
let readUrl = '/sys/sysAnnouncementSend/editByAnntIdAndUserId';
this.$http.put(readUrl, {
anntId: item.anntId
})
}
// console.log("goe",item.busId)
uni.navigateTo({
url: '/pages/mail/mailDetail?id=' + item.busId
});
},
ListTouchStart(e) {
this.listTouchStart = e.touches[0].pageX
},
// ListTouch计算方向
ListTouchMove(e) {
this.listTouchDirection = e.touches[0].pageX - this.listTouchStart > 0 ? 'right' : 'left'
},
// ListTouch计算滚动
ListTouchEnd(e) {
if (this.listTouchDirection == 'left') {
this.modalName = e.currentTarget.dataset.target
} else {
this.modalName = null
}
this.listTouchDirection = null
},
deleteAnnotation(item) {
this.$http.delete(this.delUrl + '?id=' + item.id).then(res => {
console.log("结果数据9", res)
if (res.data.success) {
this.mescroll.resetUpScroll()
}
}).catch(e => {
console.log("al delUrl请求错误2", e)
this.mescroll.endErr();
})
},
formatDate(text, len) {
if (!text || text.length == 0) {
return ''
}
if (text.length < len) {
return text;
}
return text.substr(0, len)
},
titleFilter(text, len) {
if (!text || text.length == 0) {
return ''
}
if (text.length < len) {
return text;
}
return text.substr(0, len) + "..."
}
}
}
</script>
<style scoped>
* {
font-size: 14px !important;
}
.uni-card__head-padding {
background-color: #007AFF !important;
color: #FFFFFF;
}
.red {
color: red;
}
.e-btn {
margin-bottom: 1rem;
}
.titlePad {
margin-top: 0.6rem;
}
.cu-list>.move-cur {
transform: translateX(-150rpx);
}
.nav .cu-item.cur {
position: flex;
z-index: 9;
border-bottom: 4upx solid;
}
.bordp {
padding-bottom: 10px;
border-bottom: 5px solid #EEEEEE;
}
.bordb {
padding-top: 10px;
border-top: 5px solid #EEEEEE;
}
/* 头条小程序组件内不能引入字体 */
/* #ifdef MP-TOUTIAO */
@font-face {
font-family: uniicons;
font-weight: normal;
font-style: normal;
src: url('~@/static/uni.ttf') format('truetype');
}
/* #endif */
/* #ifndef APP-NVUE */
page {
display: flex;
flex-direction: column;
box-sizing: border-box;
background-color: #efeff4;
min-height: 100%;
height: auto;
}
view {
line-height: inherit;
}
.example {
padding: 0 15px 15px;
}
.example-info {
padding: 15px;
color: #3b4144;
background: #ffffff;
}
.example-body {
width: 100%;
flex-direction: row;
flex-wrap: wrap;
justify-content: center;
padding: 0;
font-size: 14px;
background-color: #ffffff;
}
/* #endif */
.example {
padding: 0 15px;
}
.example-info {
/* #ifndef APP-NVUE */
display: block;
/* #endif */
padding: 15px;
color: #3b4144;
background-color: #ffffff;
font-size: 14px;
line-height: 20px;
}
.example-info-text {
font-size: 14px;
line-height: 20px;
color: #3b4144;
}
.example-body {
flex-direction: column;
padding: 15px;
background-color: #ffffff;
}
.word-btn-white {
font-size: 18px;
color: #FFFFFF;
}
.word-btn {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: row;
align-items: center;
justify-content: center;
border-radius: 6px;
height: 48px;
margin: 15px;
background-color: #007AFF;
}
.word-btn--hover {
background-color: #4ca2ff;
}
.search-result {
margin-top: 10px;
margin-bottom: 20px;
text-align: center;
}
.search-result-text {
text-align: center;
font-size: 14px;
}
.example-body {
/* #ifndef APP-NVUE */
display: block;
/* #endif */
padding: 0px;
}
.search-btn{
font-size: 12px;
width: 54px;
background-color: white;
border: 1px solid lightgray;
padding: 0;
}
.bottom-modal uni-button{
font-size: 12px;
color: #555555;
background: white;
}
.bottom-modal .active-select{
color: white;
background-color: #0081FF;
}
.bottom-modal .cu-list.grid>.cu-item{
padding: 10upx 20px;
}
.bottom-modal .cu-list.grid>.cu-item>uni-button{
width: 100%;
}
.cu-dialog-footer button{
padding: 0 40px;
font-size: 14px;
}
.cu-dialog-footer button:last-child{
color: white;
background-color: #007AFF;
}
.process-page .cu-list.menu-avatar.comment>.cu-item{
padding: 15px;
}
.process-page .text-sm{
font-size: 12px;
}
</style>
<template>
<view class="bg-white">
<cu-custom bgColor="bg-white" isBack="true">
<slot slot="backText">返回</slot>
</cu-custom>
<view class="cu-modal drawer-modal justify-end" :class="modalName=='DrawerModalR'?'show':''" @tap="hideModal">
<view class="cu-dialog basis-lg" style="overflow: auto;" @tap.stop=""
:style="[{top:CustomBar+'px',height:'calc(100vh - ' + CustomBar + 'px)'}]">
<view class="cu-bar bg-white solid-bottom margin-top">
<view class="action">
<text class="cuIcon-title text-orange "></text> 选择审批人
</view>
</view>
<view class="cu-list menu-avatar">
<view v-for="(item,index) in allsprlist" :key="index" class="cu-item" @tap="addsprlist(item)">
<view class="cu-avatar round lg">
<view class="cu-avatar round lg margin-xs ">
<text class="avatar-text">{{item.name.substr(0,1)}}</text>
</view>
</view>
<view class="content">
<view class="text-grey">{{item.name}}</view>
<view class="text-gray text-sm flex">
<view class="text-cut">
{{item.infor}}
</view>
</view>
</view>
<view class="action">
</view>
</view>
</view>
</view>
</view>
<view class="container">
<view v-if="TabCur==0" class="">
<!-- 总报销 -->
<view >
<!-- <view class="action"
style="padding-top: 5px;padding-bottom: 5px;padding-left: 20px;background-color: #EEEEEE;">
新增工作任务
</view> -->
<view class="cu-form-group">
<view class="title"><span class="red">*</span>项目</view>
<picker mode="selector" :range="gzxmlist" value="0" @change="getgzxm" range-key="mc" >
<view class="picker">
{{gzxm.mc||"请选择"}}
</view>
</picker>
</view>
<view class="cu-form-group">
<view class="title"><span class="red">*</span>提出人</view>
<picker mode="selector" :range="tcrlist" value="0" @change="gettcr" range-key="USERS_USERNAME" >
<view class="picker">
{{tcr.USERS_USERNAME||"请选择"}}
</view>
</picker>
</view>
<view class="cu-form-group">
<view class="title"><span class="red">*</span>责任人</view>
<picker mode="selector" :range="tcrlist" value="0" @change="getzrr" range-key="USERS_USERNAME" >
<view class="picker">
{{zrr.USERS_USERNAME||"请选择"}}
</view>
</picker>
</view>
<view class="cu-form-group ">
<view class="title"><span class="red">*</span>计划完成日期</view>
<picker mode="date" @change="getjhwcrq">
<view class="picker">
{{jhwcrq||"请选择"}}
</view>
</picker>
</view>
<view class="cu-form-group ">
<view class="title"><span class="red">*</span>主题</view>
<input name="input" v-model="zt"></input>
</view>
<view class="cu-form-group align-start" style="border-bottom:0.5px solid #EEEEEE;">
<view class="title"><span class="red">*</span>内容</view>
<textarea v-model="gznr" maxlength="-1" :disabled="modalName!=null"
placeholder="请输入费用明细"></textarea>
</view>
</view>
<!-- 新增按钮 -->
<!-- 总报销金额 -->
<!-- <view style="border-bottom: 5px solid #eee;padding-bottom: 10px;">
<view class="action"
style="padding-top: 5px;padding-bottom: 5px;padding-left: 20px;background-color: #EEEEEE;">
</text>总报销金额(元):{{zbxje}}
</view>
<view class="cu-form-group margin-top">
<view class="title">添加图片</view>
</view>
<uni-file-picker style="margin-left: 10px;" ref="img" :auto-upload="false" v-model="imageValue"
fileMediatype="image" mode="grid" @select="tpselect" @progress="tpprogress" @success="tpsuccess"
@fail="tpfail" @delete="tpdel" />
</view> -->
<!-- <view class="cu-form-group flex " >
<view class="title" style="line-height: 50px;">添加附件</view>
</view> -->
<!-- <uni-file-picker style="margin-left: 10px;margin-top: 10px;" ref="files" :auto-upload="false"
v-model="filesValue" fileMediatype="file" mode="grid" @select="tpselect" @progress="tpprogress"
@success="tpsuccess" @fail="tpfail" @delete="tpdel" /> -->
<view class="padding-xl" style="border: 0.5 solid #EEEEEE;">
<button class="cu-btn block bg-blue margin-tb-sm lg" @tap="allsubmit()">
</text>提交</button>
</view>
</view>
</view>
<!-- 确认模态框 -->
<view class="cu-modal" :class="modalName=='DialogModal1'?'show':''">
<view class="cu-dialog">
<view class="cu-bar bg-white justify-end">
<view class="content">提示</view>
<view class="action" @tap="hideModal">
<text class="cuIcon-close text-red"></text>
</view>
</view>
<view class="padding-xl bg-white">
是否撤销该请假请求?
</view>
<view class="cu-bar bg-white justify-end">
<view class="action">
<button class="cu-btn line-green text-green" @tap="hideModal">取消</button>
<button class="cu-btn bg-green margin-left" @tap="apicxsjsc()">确定</button>
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
const tabs = [{
title: '发起提交',
value: 0
}, {
title: '查看数据',
value: 1
}];
import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js";
export default {
mixins: [MescrollMixin], // 使用mixin
onReachBottom(e) {
this.pageNo++
this.apigetqjlist()
},
onLoad(e) {
if(e&&e.query){
this.gzxxinfor=JSON.parse(e.query).infor
this.jhwcrq=this.timestampToTime(this.gzxxinfor.jhwcsj)
this.zt=this.gzxxinfor.title
this.gznr=this.gzxxinfor.content
}
this.apigetgzxm()
this.apigettcrlist()
},
data() {
return {
gzxxinfor:"",
gznr:"",
zt:"",
jhwcrq:"",
zrr:"",
// 工作提出人list
tcrlist:[],
tcr:"",
delinfor:"",
// 提交基础url
TJBASE:"",
// 项目列表
xmlist:[],
// 费用项目
fyxmlist:[],
// 报销是由
bxsy:"",
// 结束日期
jsrq:"",
// 开始日期
ksrq:"",
//报销日期
bxrq:"",
// 工作项目
gzxm:[],
//项目list
gzxmlist:[],
searchKey:"",
pageNo:1,
bxlist:[],
showlist:[],
modalName: null,
imgarry: [],
allsprlist: [{
name: "张三",
infor: "测试"
},
{
name: "李四",
infor: "测试"
}
],
sprlist: [
],
cksj: [{
bxr: "anger",
bxrq: "2021.01",
zt: "处理中",
bxdh: "1213800439",
bxzje: "1000"
},
{
bxr: "anger",
bxrq: "2021.01",
zt: "处理中",
bxdh: "1213800439",
bxzje: "1000"
}
],
imageValue: [
],
filesValue: [
],
bxmxlist: [],
tabs,
TabCur: 0,
scrollLeft: 0,
NavBarColor: this.NavBarColor,
upOption: {
page: {
num: 0, // 当前页码,默认0,回调之前会加1,即callback(page)会从1开始
size: 10 // 每页数据的数量
},
noMoreSize: 4, //如果列表已无数据,可设置列表的总数量要大于半页才显示无更多数据;避免列表数据过少(比如只有一条数据),显示无更多数据会不好看; 默认5
empty: {
tip: '~ 暂无数据 ~', // 提示
},
loading: '',
text: '全部',
isShowNoMore: false,
textNoMore: '我是有底线的 >_<'
},
msgList: [], //列表数据
read: "all",
announcement1: [],
msg1Count: "",
msg1Title: "",
announcement2: [],
msg2Count: "",
msg2Title: "",
url: "/sys/sysAnnouncementSend/getMyAnnouncementSend",
delUrl: '/sys/sysAnnouncementSend/delete',
listTouchStart: 0,
listTouchDirection: null,
}
},
onShow() {},
filters: {
ztTrans: function(a) {
const ztList = {"S": "审批", "I":"提出","F":"支付",3:"撤回",4:"转交",5:"调度"};
return ztList[a]
},
},
computed: {
zfpje(){
let num = 0
this.bxmxlist.forEach((e) => {
if (e.fpje) {
num = num + parseFloat(e.fpje)
}
})
return num
},
zbxje() {
let num = 0
this.bxmxlist.forEach((e) => {
if (e.bxje) {
num = num + parseFloat(e.bxje)
}
})
return num
},
top() {
return this.CustomBar * 2 + 95
},
style() {
var StatusBar = this.StatusBar;
var CustomBar = this.CustomBar;
var style = `height:${CustomBar}px;padding-top:${StatusBar}px;`;
return style
},
},
methods: {
confirm(e){
this.delinfor=e
this.modalName="DialogModal1"
},
// 查看数据删除
apicxsjsc(){
console.log(this.delinfor)
let that=this
let url="dmg/xmrw/delete"
this.$http.post(url,{
master:{
id:this.delinfor.id,
}
}).then(res=>{
if(res.data.success){
that.$tip.toast("删除成功");
this.hideModal()
that.searchtap()
}else{
that.$tip.toast(res.data.message||"操作失败");
this.hideModal()
}
});
},
getxm(e,index){
this.bxmxlist[index].xm=this.xmlist[e.detail.value]
this.bxmxlist[index].xmid=this.xmlist[e.detail.value].code
},
// 获取选中责任人
getzrr(e){
this.zrr=this.tcrlist[e.detail.value]
},
// 获取选中的提出人
gettcr(e){
this.tcr=this.tcrlist[e.detail.value]
},
// 获取提出人列表
apigettcrlist(){
let that=this
this.$http.post("kzzx/fzsr/select",{id:"402881826c23e82d016c23ec00e80004",condition:""}).then(res=>{
if(res.data.success){
that.tcrlist=res.data.data.records
that.tcrlist.forEach((e)=>{
if(e.USERS_USERID==that.gzxxinfor.cjrid){
that.tcr=e
}
if(e.USERS_USERID==that.gzxxinfor.zrrid){
that.zrr=e
}
})
}else{
that.$tip.toast(res.data.message||"工作提出人获取失败");
}
});
},
// 获取项目列表
apigetxmlist(){
let that=this
this.$http.post("xmgl/gcxm/queryUsedGcxm",{}).then(res=>{
if(res.data.success){
that.xmlist=res.data.data.records
}else{
that.$tip.toast(res.data.message||"费用项目获取失败");
}
});
},
// 获取费用明细
getfyxm(e,index){
this.bxmxlist[index].fyxm=this.fyxmlist[e.detail.value]
this.bxmxlist[index].xh=this.fyxmlist[e.detail.value].xh
this.bxmxlist[index].fyxmid=this.fyxmlist[e.detail.value].fyxmid
this.TJBASE=this.fyxmlist[e.detail.value].mid
},
// 获取费用项目
apigetfyxmlist(){
let that=this
this.$http.post("fybx/fyflmx/query",{mid:"8ad0327e6b8c7b8a016b8cb3803a0012"}).then(res=>{
if(res.data.success){
that.fyxmlist=res.data.data.records
}else{
that.$tip.toast(res.data.message||"费用项目获取失败");
}
});
},
// 获取费用项目1
apigetfyxmlist1(){
let that=this
this.$http.post("fybx/fyflmx/query",{mid: "8ad0327e6c426f83016c42701ebc0005"}).then(res=>{
if(res.data.success){
res.data.data.records.forEach(e=>{
that.fyxmlist.push(e)
})
}else{
that.$tip.toast(res.data.message||"费用项目获取失败");
}
});
},
// 获取费用项目2
apigetfyxmlist2(){
let that=this
this.$http.post("fybx/fyflmx/query",{mid: "8ad0327e6c6ee3cc016c6ee4be480001"}).then(res=>{
if(res.data.success){
res.data.data.records.forEach(e=>{
that.fyxmlist.push(e)
})
}else{
that.$tip.toast(res.data.message||"费用项目获取失败");
}
});
},
// 获得结束日期
getjsrq(e){
this.jsrq=e.detail.value
},
// 获取报销日期
getjhwcrq(e){
this.jhwcrq=e.detail.value
},
// 获取工作项目
getgzxm(e){
let index=e.detail.value
this.gzxm=this.gzxmlist[index]
},
// 获取工作项目列表
apigetgzxm(){
let that=this
this.$http.post("dmg/pd/query",{}).then(res=>{
if(res.data.success){
that.gzxmlist=res.data.data.records
// 编辑选中
that.gzxmlist.forEach((e)=>{
if(e.id==that.gzxxinfor.cpid){
that.gzxm=e
}
})
}else{
that.$tip.toast(res.data.message||"获取报销人列表失败");
}
});
},
searchtap(){
this.pageNo=1
this.showlist=[]
this.apigetqjlist()
},
timestampToTime(timestamp){
let date = new Date(timestamp);
  var YY = date.getFullYear() + '-';
  var MM = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
  var DD = (date.getDate() < 10 ? '0' + (date.getDate()) : date.getDate());
  var hh = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
  var mm = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()) + ':';
  var ss = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
  return YY + MM + DD ;
},
// 费用报销请求列表
apigetqjlist(){
let that=this
this.$http.post("dmg/xmrw/query",{"swlx": "A","wfpid": "","bxdh": "","bxr":this.searchKey,"pageNo": this.pageNo,"pageSize": 20}).then(res=>{
if(res.data.success){
that.bxlist=res.data.data.records
that.bxlist.forEach(e=>{
that.showlist.push(e)
})
console.log(that.bxlist)
}else{
console.log("请求失败")
}
});
},
// 删除明细
scmx(index){
this.bxmxlist.splice(index, 1)
},
// 添加审批人
addsprlist(e) {
this.sprlist.push(e)
this.modalName = null
},
hideModal(e) {
this.modalName = null
},
// 跳转获取审批人信息
getspr() {
this.modalName = "DrawerModalR"
// this.$Router.push({
// path: '/pages/addressbook/selectspr', query:{
// allinfor:{
// imgarry:this.imgarry,
// imageValue:this.imageValue
// }
// },
// })
},
// 删除审批人
delspr(index) {
this.sprlist.splice(index, 1)
},
// 上传文件
upload(name, fileUrl) {
console.log(name)
console.log(fileUrl)
let that = this;
uni.uploadFile({
url: 'http://localhost:9080/dmg/dmg/xmrw/attachment/upload',
filePath: fileUrl,
name: name,
header: {
"Content-Type": "multipart/form-data",
},
formData: {
method: 'POST' //请求方式
},
success: res => {
console.log(res)
// let url = JSON.parse(res.data).data.url;
// let size = JSON.parse(res.data).data.size;
// let suffix = JSON.parse(res.data).data.ext;
}
})
},
// 数据单详情
getxxxx(e) {
this.$Router.push({
path: '/pages/common/fybxxq',
query: {
infor: e
},
})
},
// 提交按钮
allsubmit() {
let that=this
let master={}
master.id=this.gzxxinfor.id
master.cpid=this.gzxm.id
master.content=this.gznr
master.jhwcsj=this.jhwcrq
master.tcrid=this.tcr.USERS_USERID
master.zrrid=this.zrr.USERS_USERID
master.title=this.zt
console.log(master)
if(master.cpid&&master.content&&master.jhwcsj&&master.tcrid&&master.zrrid&&master.title){
this.$http.post("dmg/xmrw/update",{details:[],master}).then(res=>{
if(res.data.success){
that.$tip.toast(res.data.message||"修改成功");
that.$Router.push({
path: '/pages/index/index', query:{
infor:"process"
},
})
}else{
that.$tip.toast(res.data.message||"修改失败");
}
});
}else{
that.$tip.toast("请补充工作任务信息");
}
// this.imgarry.forEach(e => {
// this.upload(e.tempFiles[0].name, e.tempFiles[0].path)
// })
// this.TabCur=1
},
// 获取上传状态
tpdel(f) {
console.log(f)
this.imgarry.forEach((e, index) => {
if (f.tempFile.path == e.tempFiles[0].path) {
this.imgarry.splice(index, 1)
}
})
console.log(this.imgarry)
},
tpselect(e) {
this.imgarry.push(e)
console.log(this.imgarry)
},
// 获取上传进度
tpprogress(e) {
console.log('上传进度:', e)
},
// 上传成功
tpsuccess(e) {
console.log('上传成功')
},
// 上传失败
tpfail(e) {
console.log('上传失败:', e)
},
addbxmxlist() {
let addobj = {
bz:"",
ksrq:"",
jsrq:"",
zf03:"",
zf02:"",
zf01:"",
fpje:"",
bxje:"",
xm:"",
fyxm:"",
bxje: "",
bxlb: "",
fxmx: "",
}
this.bxmxlist.push(addobj)
console.log(this.bxmxlist)
},
// unique(arr) {
// var obj = {};
// return arr.filter(function(item, index, arr){
// return obj.hasOwnProperty(typeof item + item) ? false : (obj[typeof item + item] = true)
// })
// },
upCallback(page) {
//联网加载数据
console.log("tabindex", this.TabCur)
let keyword = this.TabCur
if (keyword == 0) {
this.$http.get(this.url, {
params: {
pageNo: page.num,
pageSize: page.size,
msgCategory: '1'
}
}).then(res => {
//联网成功的回调,隐藏下拉刷新和上拉加载的状态;
this.announcement1 = res.data.result.records
this.mescroll.endSuccess(this.announcement1.length);
//console.log("url", res)
//设置列表数据
if (res.data.success) {
console.log("res", res.data)
this.msg1Count = res.data.result.total
this.msg1Title = "通知(" + res.data.result.total + ")";
for (let annItem of this.announcement1) {
this.msgList.push(annItem)
}
}
if (page.num == 1) {
this.msgList = []; //如果是第一页需手动制空列表
this.msgList = this.msgList.concat(this.announcement1); //追加新数据
}
}).catch(() => {
//联网失败, 结束加载
this.mescroll.endErr();
})
}
if (keyword == 1) {
this.$http.get(this.url, {
params: {
pageNo: page.num,
pageSize: page.size,
msgCategory: '2'
}
}).then(res => {
//联网成功的回调,隐藏下拉刷新和上拉加载的状态;
this.announcement2 = res.data.result.records
this.mescroll.endSuccess(this.announcement2.length, this.msgCount);
//设置列表数据
if (res.data.success) {
console.log("res sys", res.data)
this.msg2Count = res.data.result.total
this.msg2Title = "通知(" + res.data.result.total + ")";
// this.announcement2.filter((item,index) => {
// // console.log("item",item)
// if(item.anntId == this.announcement2[index+1].anntId){
// this.announcement2.splice(item,1)
for (let item of this.announcement2) {
this.msgList.push(item)
}
// }
// })
}
if (page.num == 1) {
this.msgList = []; //如果是第一页需手动制空列表
this.msgList = this.msgList.concat(this.announcement2); //追加新数据
}
}).catch(() => {
//联网失败, 结束加载
this.mescroll.endErr();
})
}
},
tabSelect(e) {
this.TabCur = e.currentTarget.dataset.id;
if(this.TabCur==1){
this.searchtap()
}
this.scrollLeft = (e.currentTarget.dataset.id - 1) * 60;
this.msgList = [] // 先置空列表,显示加载进度
},
goAnnotationDetail(item) {
//item.readFlag = '1'
this.mescroll.resetUpScroll()
if (item.openType == "component" && item.openPage.indexOf('email') >= 0) {
this.goEmailDetailPage(item)
} else {
// console.log("detail",encodeURIComponent(JSON.stringify(item)))
uni.navigateTo({
url: '/pages/annotation/annotationDetail?item=' + encodeURIComponent(JSON.stringify(item))
});
}
},
isEmail(item) {
if (item.openType == "component" && item.openPage.indexOf('email') >= 0) {
return true;
} else {
return false;
}
},
goEmailDetailPage(item) {
console.log("go", item.anntId)
console.log("item", item)
if (item.readFlag == '0') {
//item.readFlag = '1'
this.mescroll.resetUpScroll()
let readUrl = '/sys/sysAnnouncementSend/editByAnntIdAndUserId';
this.$http.put(readUrl, {
anntId: item.anntId
})
}
// console.log("goe",item.busId)
uni.navigateTo({
url: '/pages/mail/mailDetail?id=' + item.busId
});
},
ListTouchStart(e) {
this.listTouchStart = e.touches[0].pageX
},
// ListTouch计算方向
ListTouchMove(e) {
this.listTouchDirection = e.touches[0].pageX - this.listTouchStart > 0 ? 'right' : 'left'
},
// ListTouch计算滚动
ListTouchEnd(e) {
if (this.listTouchDirection == 'left') {
this.modalName = e.currentTarget.dataset.target
} else {
this.modalName = null
}
this.listTouchDirection = null
},
deleteAnnotation(item) {
this.$http.delete(this.delUrl + '?id=' + item.id).then(res => {
console.log("结果数据9", res)
if (res.data.success) {
this.mescroll.resetUpScroll()
}
}).catch(e => {
console.log("al delUrl请求错误2", e)
this.mescroll.endErr();
})
},
formatDate(text, len) {
if (!text || text.length == 0) {
return ''
}
if (text.length < len) {
return text;
}
return text.substr(0, len)
},
titleFilter(text, len) {
if (!text || text.length == 0) {
return ''
}
if (text.length < len) {
return text;
}
return text.substr(0, len) + "..."
}
}
}
</script>
<style scoped>
* {
font-size: 14px !important;
}
.uni-card__head-padding {
background-color: #007AFF !important;
color: #FFFFFF;
}
.red {
color: red;
}
.e-btn {
margin-bottom: 1rem;
}
.titlePad {
margin-top: 0.6rem;
}
.cu-list>.move-cur {
transform: translateX(-150rpx);
}
.nav .cu-item.cur {
position: flex;
z-index: 9;
border-bottom: 4upx solid;
}
.bordp {
padding-bottom: 10px;
border-bottom: 5px solid #EEEEEE;
}
.bordb {
padding-top: 10px;
border-top: 5px solid #EEEEEE;
}
</style>
<template>
<view class="bg-white" >
<cu-custom bgColor="bg-white" isBack="true" >
<slot slot="backText">返回</slot>
</cu-custom>
<view class="container">
<view class="cu-card article " style="padding-bottom: 0px;">
<view class="cu-item shadow" style="padding-bottom: 0px;">
<view class="title flex justify-between" style="height: 25px;">
<view class="text-cut" style="font-size: 16px!important;line-height: 22px;">{{spinfor.preUserName||spinfor.username||""}}{{spinfor.action|ztTrans}}{{"工作任务"}}</view>
</view>
<view class="content" @tap="test()">
<view class="desc">
<view class="text-content" style="height: 50px;">
<view>苏州格物信息技术有限公司</view>
<view style="color:#E8A54C;">{{spinfor.wUserName||""}}待处理</view>
</view>
</view>
</view>
</view>
</view>
<!-- <view class="cu-form-group">
<view class="title"><span class="red"> </span>报销单号</view>
<input v-model="bxdh" placeholder="" name="input" ></input>
</view> -->
<view v-if="TabCur==0" class="margin-top">
<view >
<view class="action"
style="padding-bottom: 5px;padding-left: 20px;background-color: #EEEEEE;padding-bottom: 5px;padding-top: 5px;">
工作信息
</view>
<view class="cu-form-group margin-top">
<view class="title"><span class="red">*</span>项目</view>
<input disabled placeholder="" name="input" >{{gzxxinfor.mc}}</input>
</view>
<view class="cu-form-group">
<view class="title"><span class="red">*</span>提出人</view>
<input disabled name="input" >{{gzxxinfor.tcr}}</input>
</view>
<view class="cu-form-group">
<view class="title"><span class="red">*</span>责任人</view>
<input disabled name="input" >{{gzxxinfor.username}}</input>
</view>
<view class="cu-form-group">
<view class="title"><span class="red">*</span>计划完成日期</view>
<input disabled name="input" >{{timestampToTime(gzxxinfor.jhwcsj)}}</input>
</view>
<view class="cu-form-group">
<view class="title"><span class="red">*</span>主题</view>
<input disabled name="input" >{{gzxxinfor.title}}</input>
</view>
<view class="cu-form-group align-start" style="border-bottom:0.5px solid #EEEEEE;">
<view class="title"><span class="red">*</span>内容</view>
<textarea maxlength="-1" :disabled="modalName!=null" :value="gzxxinfor.content"
disabled></textarea>
</view>
</view>
<view class="bordb">
<view class="cu-form-group" style="border-top: 10px solid #EEEEEE;">
<view class="title">流程</view>
</view>
<view class="cu-form-group padding-bottom ">
<view >
<view class="cu-timeline " v-for="(item,index) in lc" :key="index">
<view class="cu-time" style="width: 80px;">{{item.nodeName}}</view>
<view class="cu-item text-gray" v-if="item.nodeName!='结束'">
<view class="bg-blue content">
<text></text> {{item.actionTime|formatTime(item.actionTime)}}{{item.actionUserName}}{{item.action|ztTrans(item.action)}}
</view>
</view>
</view>
</view>
</view>
</view>
<view class="">
<!-- <view class="cu-form-group" style="border-top: 10px solid #EEEEEE;">
<view class="title">处理</view>
</view>
<view class="cu-form-group padding flex justify-around ">
<view class="" style="" >
<button class="cu-btn round bg-blue" @tap="showR()">提交</button>
</view>
<view class="" style="" >
<button class="cu-btn round bg-blue" @tap="showCh()" >删除</button>
</view>
<view class="" style="">
<button class="cu-btn round bg-blue" @tap="showTh()">退回</button>
</view>
<view class="" style="">
<button class="cu-btn round bg-blue" @tap="showRbxzj()">转交</button>
</view>
<view v-if="spinfor.username" class="" style="" >
<button class="cu-btn round bg-blue" @tap="showR3()" >撤回</button>
</view>
<view v-if="spinfor.preUserName" class="" style="" >
<button class="cu-btn round bg-blue" @tap="gzbj(gzxxinfor)" >编辑</button>
</view>
</view> -->
<!-- 提交模态框 -->
<view class="cu-modal drawer-modal justify-end" :class="modalName=='DrawerModalR'?'show':''" @tap="hideModal">
<view class="cu-dialog basis-lg" style="overflow: auto;" @tap.stop=""
:style="[{top:CustomBar+'px',height:'calc(100vh - ' + CustomBar + 'px)'}]">
<view class="cu-bar bg-white solid-bottom margin-top">
<view class="action">
<span class="red"></span> 审批人
</view>
</view>
<view class="cu-form-group" style="-webkit-box-pack:unset;justify-content: left;">
<view style="position: relative;" v-for="(item,index) in tjsprdata.userList" :key="index">
<view class="cu-avatar round lg margin-xs bg-red">
<text class="avatar-text">{{item.name}}</text>
</view>
<view v-if="item.selected!='Y'" @tap=delspr(index) class="cu-avatar round lg margin-xs bg-grey "
style="height: 15px;width: 15px;position: absolute;top: 0px;right: 0px;">
<text class="avatar-text">X</text>
</view>
</view>
</view>
<view class="cu-list menu-avatar">
<view class="cu-form-group align-start" style="border-bottom:0.5px solid #EEEEEE;">
<view class="title"><span class="red"></span>处理意见</view>
<textarea maxlength="-1" v-model="tjclyj"
></textarea>
</view>
</view>
<view class="padding-xl">
<button @tap="apitjgzrw" class="cu-btn block bg-blue margin-tb-sm lg">
提交</button>
</view>
</view>
</view>
<!-- 报销退回 -->
<view class="cu-modal" :class="modalName=='bxtuihui'?'show':''">
<view class="cu-dialog">
<view class="cu-bar bg-white justify-end">
<view class="content">提示</view>
<view class="action" @tap="hideModal">
<text class="cuIcon-close text-red"></text>
</view>
</view>
<view class="padding-xl bg-white">
是否退回该报销请求?
</view>
<view class="cu-bar bg-white justify-end">
<view class="action">
<button class="cu-btn line-green text-green" @tap="hideModal">取消</button>
<button class="cu-btn bg-green margin-left" @tap="apigzrwth">确定</button>
</view>
</view>
</view>
</view>
<!-- 确认模态框 -->
<view class="cu-modal" :class="modalName=='qjchehui'?'show':''">
<view class="cu-dialog">
<view class="cu-bar bg-white justify-end">
<view class="content">提示</view>
<view class="action" @tap="hideModal">
<text class="cuIcon-close text-red"></text>
</view>
</view>
<view class="padding-xl bg-white">
是否删除该条工作任务?
</view>
<view class="cu-bar bg-white justify-end">
<view class="action">
<button class="cu-btn line-green text-green" @tap="hideModal">取消</button>
<button class="cu-btn bg-green margin-left" @tap="apidelgzxx">确定</button>
</view>
</view>
</view>
</view>
<!-- 请假转交模态框 -->
<view class="cu-modal drawer-modal justify-end" :class="modalName=='DrawerModalRbxzj'?'show':''" @tap="hideModal">
<view class="cu-dialog basis-lg" style="overflow: auto;" @tap.stop=""
:style="[{top:CustomBar+'px',height:'calc(100vh - ' + CustomBar + 'px)'}]">
<view class="cu-bar bg-white solid-bottom margin-top">
<view class="action">
<span class="red"></span> 可选审批人
</view>
</view>
<view class="cu-form-group" style="-webkit-box-pack:unset;justify-content: left;overflow: auto;">
<view style="position: relative;" v-for="(item,index) in tjsprdata.userList" :key="index">
<view class="cu-avatar round lg margin-xs bg-red" @tap=bxzjspr(item)>
<text class="avatar-text">{{item.name}}</text>
</view>
</view>
</view>
<view class="cu-bar bg-white solid-bottom margin-top">
<view class="action">
<span class="red"></span> 已选审批人
</view>
</view>
<view class="cu-form-group" style="-webkit-box-pack:unset;justify-content: left;overflow: auto;">
<view style="position: relative;" v-for="(item,index) in zjsprN" :key="index">
<view class="cu-avatar round lg margin-xs bg-red">
<text class="avatar-text">{{item.name}}</text>
</view>
<view v-if="item.mustSelect!='Y'" @tap=delbxzjspr(item,index) class="cu-avatar round lg margin-xs bg-gray "
style="height: 15px;width: 15px;position: absolute;top: 0px;right: 0px;">
<text class="avatar-text">x</text>
</view>
</view>
</view>
<view class="cu-list menu-avatar">
<view class="cu-form-group align-start" style="border-bottom:0.5px solid #EEEEEE;">
<view class="title"><span class="red"></span>处理意见</view>
<textarea maxlength="-1" v-model="zjclyj"
></textarea>
</view>
</view>
<view class="padding-xl">
<button @tap="apizjbx" class="cu-btn block bg-blue margin-tb-sm lg">
提交</button>
</view>
</view>
</view>
<!-- 报销撤回模态框 -->
<view class="cu-modal drawer-modal justify-end" :class="modalName=='DrawerModalRch'?'show':''" @tap="hideModal">
<view class="cu-dialog basis-lg" style="overflow: auto;" @tap.stop=""
:style="[{top:CustomBar+'px',height:'calc(100vh - ' + CustomBar + 'px)'}]">
<view class="cu-bar bg-white solid-bottom margin-top">
<view class="action">
<span class="red"></span> 审批人
</view>
</view>
<view class="cu-form-group" style="-webkit-box-pack:unset;justify-content: left;">
<view style="position: relative;" v-for="(item,index) in tjsprlist" :key="index">
<view class="cu-avatar round lg margin-xs bg-red">
<text class="avatar-text">{{item.name}}</text>
</view>
<view v-if="item.mustSelect!='Y'" @tap=delspr(index) class="cu-avatar round lg margin-xs bg-grey "
style="height: 15px;width: 15px;position: absolute;top: 0px;right: 0px;">
<text class="avatar-text">X</text>
</view>
</view>
</view>
<view class="cu-list menu-avatar">
<view class="cu-form-group align-start" style="border-bottom:0.5px solid #EEEEEE;">
<view class="title"><span class="red"></span>处理意见</view>
<textarea maxlength="-1" v-model="chbxclyj"
></textarea>
</view>
</view>
<view class="padding-xl">
<button @tap="apichbx" class="cu-btn block bg-blue margin-tb-sm lg">
提交</button>
</view>
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
const tabs = [{title:'发起提交',value:0}, {title:'查看数据',value:1}];
import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js";
import formatTimeToStr from '@/common/util/date.js';
export default {
mixins: [MescrollMixin], // 使用mixin
onLoad(e){
if(e){
this.spinfor=JSON.parse(e.query).infor
console.log(this.spinfor)
this.TabCur="0"
this.urls.gzxxgzl=this.urls.gzxxgzl+"/"+this.spinfor.wfinstid
this.apiquerygzxx()
this.apigzxxgzl()
}
},
filters: {
jqfilters:function(a){
const ztList = {"BJ": "病假", "SJ":"事假","JB":"加班","TS":"调休","QT":"其他"};
return ztList[a]
},
ztTrans: function(a) {
const ztList = {0: "创建", 1:"提交",2:"退回",3:"撤回",4:"转交",5:"调度",8:"待处理"};
return ztList[a]
},
formatTime: function(time) {
if(time!=null&&time!="")
{
var date = new Date(time);
return date.Format("MM-dd hh:mm")
}else{
return "";
}
},
formatDate:function(time){
if(time!=null&&time!="")
{
var date = new Date(time);
return date.Format("yyyy-MM-dd")
}else{
return "";
}
}
},
data() {
return {
chbxclyj:"",
tjsprlist:[],
zjclyj:"",
zjsprN:[],
tjclyj:"",
tjsprdata:"",
gzxxinfor:{},
modalName:null,
urls:{
qjxx:"kqgl/ygqj/query",
gzxx:"dmg/xmrw/query",
gzxxgzl:"wf/query/wflog",
qjxxgzl:"wf/query/wflog"
},
lc:[],
bxdh:null,
imageValue:[
],
tabs,
TabCur: 0,
scrollLeft: 0,
NavBarColor:this.NavBarColor,
}
},
onShow() {
},
computed:{
zbxje(){
let num=0
this.bxmxlist.forEach((e)=>{
if(e.bxje){
num=num+parseFloat(e.bxje)
}
})
return num
},
top() {
return this.CustomBar * 2 + 95
},
style() {
var StatusBar= this.StatusBar;
var CustomBar= this.CustomBar;
var style = `height:${CustomBar}px;padding-top:${StatusBar}px;`;
return style
},
},
methods: {
// 撤回任务
apichbx(){
let that=this
let BASEURL="dmg/xmrw/wfgo"
let nextinfo={
selected: "Y",
comment: this.chbxclyj,
userList:this.tjsprlist,
}
this.$http.post(BASEURL,{nextinfo:nextinfo,records:[this.gzxxinfor]}).then(res => {
if (res.data.success) {
that.$tip.toast("撤回成功");
that.$Router.push({
path: '/pages/index/index', query:{
infor:"process"
},
})
} else {
this.hideModal()
that.$tip.toast(res.data.messageArray[0].message);
}
});
},
//// 撤回
showR3(){
let that=this
let BASEURL="dmg/xmrw/wfnextinfo"
this.gzxxinfor.wfoperate="3"
// this.qjinfor.sysversion=1
this.$http.post(BASEURL,this.gzxxinfor).then(res => {
if (res.data.success) {
that.tjsprdata=res.data.data.records[0]
that.tjsprlist=res.data.data.records[0].userList
this.modalName="DrawerModalRch"
} else {
that.$tip.toast(res.data.message);
}
});
},
timestampToTime(timestamp){
let date = new Date(timestamp);
  var YY = date.getFullYear() + '-';
  var MM = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
  var DD = (date.getDate() < 10 ? '0' + (date.getDate()) : date.getDate());
  var hh = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
  var mm = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()) + ':';
  var ss = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
  return YY + MM + DD ;
},
// 报销编辑
gzbj(e){
this.$Router.push({
path: '/pages/gzrw/gzrwedit', query:{
infor:e
},
})
},
// 转交请假
apizjbx(){
let that=this
let nextinfo={
selected: "Y",
comment: this.zjclyj,
userList:this.zjsprN,
}
console.log(nextinfo)
let BASEURL="dmg/xmrw/wftransfer"
this.$http.post(BASEURL,{nextinfo:nextinfo,records:[this.gzxxinfor]}).then(res => {
if (res.data.success) {
that.$tip.toast("提交成功!");
that.$Router.push({
path: '/pages/index/index', query:{
infor:"process"
},
})
} else {
this.hideModal()
console.log(res)
that.$tip.toast(res.data.messageArray[0].message||"转交失败");
}
});
},
// 删除审批人
delbxzjspr(item,index){
this.zjsprN.splice(index, 1)
},
// 获取转交审批人
bxzjspr(item){
let noRepeat=true
this.zjsprN.forEach((e,index)=>{
if(e.id==item.id){
console.log("重复了")
noRepeat=false
}
})
if(noRepeat){
item.selected="Y"
this.zjsprN.push(item)
}
},
// 报销转交
showRbxzj(){
let that=this
this.gzxxinfor.wfoperate="4"
this.gzxxinfor.sysversion=1
let BASEURL="dmg/xmrw/wfnextinfo"
this.$http.post(BASEURL,this.gzxxinfor).then(res => {
if (res.data.success) {
that.tjsprdata=res.data.data.records[0]
this.modalName="DrawerModalRbxzj"
} else {
that.$tip.toast(res.data.message||"获取转交人失败");
}
});
},
// 退回请求
apigzrwth(){
let that=this
let BASEURL="dmg/xmrw/wfnextinfo"
this.gzxxinfor.wfoperate="2"
this.$http.post(BASEURL,this.gzxxinfor).then(res => {
if (res.data.success) {
that.$tip.toast("退回成功!")
that.$Router.push({
path: '/pages/index/index', query:{
infor:"process"
},
})
} else {
that.$tip.toast(res.data.message||"退回失败");
}
});
that.hideModal()
},
// 退回框
showTh(){
this.modalName="bxtuihui"
},
// 删除请求
apidelgzxx(){
let that=this
let BASEURL="dmg/xmrw/delete"
this.$http.post(BASEURL,{master:{id:this.gzxxinfor.id}}).then(res => {
if (res.data.success) {
that.$tip.toast("删除成功!")
that.$Router.push({
path: '/pages/index/index', query:{
infor:"process"
},
})
} else {
that.$tip.toast(res.data.message||"删除失败");
}
});
that.hideModal()
},
// 请假删除框
showCh(){
this.modalName="qjchehui"
},
// 提交fybx信息
apitjgzrw(){
let BASE_URL="/dmg/xmrw/wfgo"
let that=this
let nextinfo={
selected: "Y",
comment: this.tjclyj,
userList:this.tjsprdata.userList,
}
this.$http.post(BASE_URL,{nextinfo:nextinfo,records:[this.gzxxinfor]}).then(res => {
if (res.data.success) {
that.$tip.toast("提交成功!");
that.$Router.push({
path: '/pages/index/index', query:{
infor:"process"
},
})
} else {
that.$tip.toast(res.data.message);
}
});
},
// 删除审批人
delspr(index) {
if(this.tjsprdata.userList[index].mustSelect=="Y"){
this.$tip.toast("必选审批人不可删除");
}else{
this.tjsprdata.userList.splice(index, 1)
}
},
// 提交
showR(){
let that=this
this.gzxxinfor.wfoperate="1"
this.gzxxinfor.sysversion=1
this.$http.post("dmg/xmrw/wfnextinfo",this.gzxxinfor).then(res => {
if (res.data.success) {
that.tjsprdata=res.data.data.records[0]
console.log(that.tjsprdata)
this.modalName="DrawerModalR"
} else {
this.$tip.toast(res.data.message||"获取下一步审批人失败!");
}
});
},
hideModal(e) {
this.modalName = null
},
apiquerygzxx(){
this.$http.post("dmg/xmrw/query",{id:this.spinfor.id}).then(res => {
if (res.data.success) {
this.gzxxinfor=res.data.data.records[0]
} else {
that.$tip.toast(res.data.message||"工作任务详情获取失败。");
}
});
},
apigzxxgzl(){
this.$http.post(this.urls.gzxxgzl).then(res => {
if (res.data.success) {
this.lc=res.data.data.records
} else {
that.$tip.toast(res.data.message);
}
});
},
apiqjxxgzl(){
this.$http.post(this.urls.qjxxgzl).then(res => {
if (res.data.success) {
this.lc=res.data.data.records
} else {
that.$tip.toast(res.data.message);
}
});
},
formatDate(text,len){
if(!text || text.length==0){
return ''
}
if(text.length<len){
return text;
}
return text.substr(0,len)
},
titleFilter(text,len){
if(!text || text.length==0){
return ''
}
if(text.length<len){
return text;
}
return text.substr(0,len)+"..."
}
}
}
</script>
<style scoped>
*{
font-size: 14px!important;
}
.uni-card__head-padding{
background-color: #007AFF!important;
color: #FFFFFF;
}
.red{
color: red;
}
.e-btn{margin-bottom: 1rem;}
.titlePad{margin-top:0.6rem;}
.cu-list>.move-cur{
transform: translateX(-150rpx);
}
.bordb{
padding-bottom: 10px;
border-bottom: 10px solid #EEEEEE;
}
.nav .cu-item.cur {
position: flex;
z-index: 9;
border-bottom: 4upx solid;
}
</style>
......@@ -12,7 +12,7 @@
</input>
<view v-if="show" style="width: 90%;background-color:#EEEEEE;position: absolute;top:85%;right: 3%;z-index: 9999;">
<li style="list-style: none;color: #999999;background-color: #F5F5F5;padding-left: 20px;padding-top: 3px;padding-bottom: 5px;border-bottom: 1px solid #FFFFFF;" @tap="goPage(item.page)" v-for="(item,index) in showlist" :key="index">{{item.mkmc}}</li>
<li style="list-style: none;color: #999999;background-color: #F5F5F5;padding-left: 20px;padding-top: 3px;padding-bottom: 5px;border-bottom: 1px solid #FFFFFF;" @tap="goPage(item.page)" v-for="(item,index) in showlist" :key="index">{{item.title}}</li>
</view>
</view>
......@@ -165,9 +165,10 @@
},
},
searchKey(d){
console.log(this.usList)
this.showlist=[]
this.loveList.forEach(e=>{
if(e.mkmc.indexOf(d)!=-1){
this.usList.forEach(e=>{
if(e.title.indexOf(d)!=-1){
this.showlist.push(e)
}
})
......
......@@ -11,7 +11,7 @@
<view class="container">
<view class="cu-bar bg-white search" >
<view class="example-body">
<uni-search-bar placeholder="搜索任务单号" @input="searchinput"></uni-search-bar>
<uni-search-bar placeholder="搜索领料单号" @input="searchinput"></uni-search-bar>
</view>
<view class="action" style="margin-right: 8px;">
<text class="cu-btn round search-btn" @tap="showModal" data-target="bottomModal">
......@@ -19,6 +19,7 @@
</view>
</view>
<view class="index">
<view v-if="!showlist[0]" style="background-image: url(/static/sswnr.png);height: 87vh;background-size:100% 80%;"></view>
<view class="new_box" style="margin-top: 0px;">
<view class="bbox">
<view class="list-box" v-for="(item,index) in showlist" :key="index" style="border-bottom: 0.5px solid #EEEEEE;">
......@@ -38,7 +39,7 @@
</view>
<view class="list-da">
<view>事务类型:<text>{{item.swlxmc}}</text></view>
<view>仓库:<text>{{item.ckmk||"未设"}}</text></view>
<view>仓库:<text>{{item.ckmc||"未设"}}</text></view>
</view>
<view class="list-da">
<view>领料日期:<text>{{item.llrq|formatDate}}</text></view>
......@@ -537,6 +538,13 @@
},
methods: {
// 重置过滤芯
resetModal(){
this.operatype="W"
this.zt=""
this.ztsta="5"
this.swlxsta="2"
},
// 转交单子api
apizjjh(){
let that=this
......@@ -888,7 +896,7 @@
})
},
searchinput(e){
this.jhid=e
this.djid=e
this.pageNo=1
this.showlist=[]
this.selectId=[]
......@@ -934,7 +942,7 @@
this.tjsprlist=[]
this.tjsprlistN=[]
this.tjsprlistS=[]
this.tjclyj=[]
this.tjclyj=""
},
// 筛选框
showModal(e) {
......@@ -968,35 +976,47 @@
}
});
},
choice(index){
console.log(this.showlist[index].selected)
console.log(index)
if(this.showlist[index].selected == true){
this.showlist[index].selected = false;
//取消选中时删除数组中的值
for(var i = 0; i < this.selectId.length; i++){
if(this.selectId[i].jhid === this.showlist[index].jhid){
this.selectId.splice(i,1);
}
// 单选
choice(index){
if(this.showlist[index].selected == true){
this.showlist[index].selected = false;
for(var i = 0; i < this.selectId.length; i++){
if(this.selectId[i].jhid === this.showlist[index].jhid){
this.selectId.splice(i,1);
}
}
console.log("选中的值",this.selectId)
}else{
this.selectId=[]
this.showlist.forEach((e,dex)=>{
if(dex!=index){
this.showlist[dex].selected=false
}
})
this.showlist[index].selected = true;
this.selectId.push(this.showlist[index])
console.log("选中的值",this.selectId)
}
console.log("选中的值",this.selectId)
}else{
this.showlist[index].selected = true;
this.selectId.push(this.showlist[index])
console.log("选中的值",this.selectId)
}
},
//提交
// sure(){
// //提交选中的值
// if(this.selectId.length==0){
// alert("请选择学科");
// return false;
// }
// var listIds = this.selectId.join(",")
// console.log("提交的数据",listIds)
// }
},
// choice(index){
// console.log(this.showlist[index].selected)
// console.log(index)
// if(this.showlist[index].selected == true){
// this.showlist[index].selected = false;
// //取消选中时删除数组中的值
// for(var i = 0; i < this.selectId.length; i++){
// if(this.selectId[i].jhid === this.showlist[index].jhid){
// this.selectId.splice(i,1);
// }
// }
// console.log("选中的值",this.selectId)
// }else{
// this.showlist[index].selected = true;
// this.selectId.push(this.showlist[index])
// console.log("选中的值",this.selectId)
// }
// },
}
}
</script>
......
<template>
<view class="bg-white" >
<cu-custom bgColor="bg-white" isBack="true" >
<slot slot="backText">返回</slot>
</cu-custom>
<view class="container">
<view class="">
<view class="cu-form-group" style="border-top: 0.5px solid #EEEEEE;">
<view class="title">流程</view>
</view>
<view class="cu-form-group padding-bottom ">
<view >
<view class="cu-timeline " v-for="(item,index) in lc" :key="index">
<view class="cu-time" style="width: 80px;">{{item.nodeName}}</view>
<view class="cu-item text-gray">
<view class="bg-blue content" v-if="item.nodeName!='结束'">
<text></text> {{item.actionTime|formatTime(item.actionTime)}}{{item.actionUserName}}{{item.action|ztTrans(item.action)}}
</view>
<view class="bg-blue content" v-if="item.nodeName=='结束'">
<text></text> {{'结束'}}
</view>
</view>
</view>
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
const tabs = [{title:'发起提交',value:0}, {title:'查看数据',value:1}];
import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js";
import formatTimeToStr from '@/common/util/date.js';
export default {
mixins: [MescrollMixin], // 使用mixin
onLoad(e){
if(e){
this.cgjh=JSON.parse(e.query).infor
console.log(this.cgjh)
this.apiwlxq()
this.apicxbm()
this.apigetlc()
}
else{
console.log("请先选择采购计划单")
}
},
filters: {
filterzt:function(a){
const ztList = {"P": "计划", "F":"确认","C":"完成","I":"开始","S":"审批"};
return ztList[a]
},
jqfilters:function(a){
const ztList = {"BJ": "病假", "SJ":"事假","JB":"加班","TS":"调休","QT":"其他"};
return ztList[a]
},
ztTrans: function(a) {
const ztList = {0: "创建", 1:"提交",2:"退回",3:"撤回",4:"转交",5:"调度",8:"待处理"};
return ztList[a]
},
formatTime: function(time) {
if(time!=null&&time!="")
{
var date = new Date(time);
return date.Format("MM-dd hh:mm")
}else{
return "";
}
},
formatDate:function(time){
if(time!=null&&time!="")
{
var date = new Date(time);
return date.Format("yyyy-MM-dd")
}else{
return "";
}
}
},
data() {
return {
lc:[],
wllist:[],
value:['key1','key2'],
modalName:null,
tabs,
cgjh:{},
allbm:[],
}
},
onShow() {
},
computed:{
top() {
return this.CustomBar * 2 + 95
},
style() {
var StatusBar= this.StatusBar;
var CustomBar= this.CustomBar;
var style = `height:${CustomBar}px;padding-top:${StatusBar}px;`;
return style
},
},
methods: {
// 流程
apigetlc(){
let url="wf/query/wflog/"+this.cgjh.wfinstid
this.$http.post(url).then(res => {
if (res.data.success) {
this.lc=res.data.data.records
} else {
that.$tip.toast(res.data.message);
}
});
},
filterbm(a){
let bmmc="未设置"
this.allbm.forEach(e=>{
if(e.id==a){
bmmc=e.bmmc
}else{
return "未设置"
}
})
return bmmc
},
// 查询部门
apicxbm(){
let that=this;
this.$http.post("jcsj/common/bm/queryCgrkBm",{
}).then(res => {
if (res.data.success) {
that.allbm=res.data.data.records
} else {
that.$tip.toast(res.data.message||"部门详情获取失败");
}
});
},
// 物料详情请求
apiwlxq(){
let that=this;
this.$http.post("kc/llck/query/detail",{
mid:this.cgjh.id
}).then(res => {
if (res.data.success) {
that.wllist=res.data.data.records
} else {
that.$tip.toast(res.data.message||"物料详情获取失败");
}
});
},
}
}
</script>
<style scoped>
*{
font-size: 14px!important;
}
.uni-card__head-padding{
background-color: #007AFF!important;
color: #FFFFFF;
}
.red{
color: red;
}
.e-btn{margin-bottom: 1rem;}
.titlePad{margin-top:0.6rem;}
.cu-list>.move-cur{
transform: translateX(-150rpx);
}
.bordb{
padding-bottom: 10px;
border-bottom: 10px solid #EEEEEE;
}
.nav .cu-item.cur {
position: flex;
z-index: 9;
border-bottom: 4upx solid;
}
/* 已选择 */
.selde {
border: 1px solid red;
background: red;
color: #FFFFFF;
border-radius: 20px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
font-size: 20px;
padding: 0 5px;
}
.selde-q {
width: 18px;
height: 18px;
border-radius: 50%;
background: #FFFFFF;
margin-left: 6px;
}
/* 未选择 */
.noselde {
border: 1px solid #959595;
background: #FFFFFF;
color: #959595;
border-radius: 13px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
font-size: 15px;
padding: 0 5px;
}
.noselde-q {
border: 1px solid #959595;
width: 15px;
height: 15px;
border-radius: 50%;
background: #FFFFFF;
margin-left: 6px;
}
.list-box {
display: flex;
flex-direction: column;
background-color: #fff;
/* margin: 0px 16px 16px 16px; */
padding: 20px;
border-radius: 0px;
}
.list-ed {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
}
.list-left {
margin-right: 16px;
}
.list-img {
width: 160px;
height: 160px;
margin: 0px 16px 0px 0px;
}
.list-right {
display: flex;
flex-direction: column;
width: 100%;
height: 100%;
}
/* .list-right-img {
width: 140px;
height: 38px;
} */
.noadsop {
width: 120px;
height: 32px;
}
.list-head {
display: flex;
justify-content: flex-end;
margin-bottom: 10px;
}
.list-name {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
margin-bottom: 10px;
}
.list-da {
display: flex;
flex-direction: row;
font-size: 26px;
}
.list-da view {
width: 50%;
}
/* .list-da view text {
color: red;
} */
.sure {
background: #FF6000;
color: #FFFFFF;
width: 80%;
height: 40px;
display: flex;
justify-content: center;
align-items: center;
border-radius: 10px;
margin: 60px auto;
}
</style>
......@@ -11,7 +11,7 @@
<view class="container">
<view class="cu-bar bg-white search">
<view class="example-body">
<uni-search-bar placeholder="搜索任务单号" @input="searchinput"></uni-search-bar>
<uni-search-bar placeholder="搜索销售单号" @input="searchinput"></uni-search-bar>
</view>
<view class="action" style="margin-right: 8px;">
<text class="cu-btn round search-btn" @tap="showModal" data-target="bottomModal">
......@@ -19,6 +19,7 @@
</view>
</view>
<view class="index">
<view v-if="!showlist[0]" style="background-image: url(/static/sswnr.png);height: 87vh;background-size:100% 80%;"></view>
<view class="new_box" style="margin-top: 0px;">
<view class="bbox">
<view class="list-box" v-for="(item,index) in showlist" :key="index"
......@@ -44,10 +45,10 @@
</view>
<view class="list-da">
<view>销售数量:<text>{{item.xssl}}</text></view>
<view>销售金额:<text>{{item.xsje}}</text></view>
<view>销售金额:<text>{{item.hsje}}</text></view>
</view>
<view class="list-da">
<view>销售价格:<text>{{item.xsjg||"未设定"}}</text></view>
<view>销售价格:<text>{{item.hsjg}}</text></view>
<view>增值税率:<text>{{item.zzsl}}</text></view>
</view>
<view class="list-da">
......@@ -59,17 +60,20 @@
<view>销售人员:<text>{{item.xsyname}}</text></view>
</view>
<view class="">
<view>
订单日期:{{item.ywrq|formatDate}}
</view>
<view>备注:<text>{{item.bz||"未设定"}}</text></view>
</view>
<view class="list-da" style="padding-top: 10px;margin-bottom: 0px;">
<view class="flex justify-between" style="padding-top: 10px;margin-bottom: 0px;">
<view>状态:
<text style="color:#FBBD08;">
{{item.zt|filterzt}}
</text>
</view>
<view>
订单日期:{{item.ywrq|formatDate}}
</view>
<view style="color: #007AFF;" @click="nextTo(item)">
查看流程
</view>
</view>
</view>
</view>
......@@ -549,7 +553,7 @@
start: "",
zt: "",
// 筛选状态
ztsta: "5",
ztsta: "4",
swlxsta: "2",
username: "",
selectBxlx: "",
......@@ -597,6 +601,13 @@
},
methods: {
// 重置过滤芯
resetModal(){
this.operatype="W"
this.zt=""
this.ztsta="4"
this.swlxsta="2"
},
// 转交单子api
apizjjh() {
let that = this
......@@ -949,7 +960,7 @@
},
nextTo(item) {
this.$Router.push({
path: '/pages/cgjh/cgjhxq',
path: '/pages/xsddsp/allcklc',
query: {
infor: item
},
......@@ -1013,7 +1024,7 @@
this.tjsprlist = []
this.tjsprlistN = []
this.tjsprlistS = []
this.tjclyj = []
this.tjclyj = ""
},
// 筛选框
showModal(e) {
......@@ -1047,32 +1058,43 @@
}
});
},
choice(index) {
if (this.showlist[index].selected == true) {
this.showlist[index].selected = false;
//取消选中时删除数组中的值
for (var i = 0; i < this.selectId.length; i++) {
if (this.selectId[i].soid === this.showlist[index].soid) {
this.selectId.splice(i, 1);
}
}
} else {
this.showlist[index].selected = true;
this.selectId.push(this.showlist[index])
}
console.log(this.selectId)
},
//提交
// sure(){
// //提交选中的值
// if(this.selectId.length==0){
// alert("请选择学科");
// return false;
// 单选
choice(index){
if(this.showlist[index].selected == true){
this.showlist[index].selected = false;
for(var i = 0; i < this.selectId.length; i++){
if(this.selectId[i].jhid === this.showlist[index].jhid){
this.selectId.splice(i,1);
}
}
console.log("选中的值",this.selectId)
}else{
this.selectId=[]
this.showlist.forEach((e,dex)=>{
if(dex!=index){
this.showlist[dex].selected=false
}
})
this.showlist[index].selected = true;
this.selectId.push(this.showlist[index])
console.log("选中的值",this.selectId)
}
},
// choice(index) {
// if (this.showlist[index].selected == true) {
// this.showlist[index].selected = false;
// for (var i = 0; i < this.selectId.length; i++) {
// if (this.selectId[i].soid === this.showlist[index].soid) {
// this.selectId.splice(i, 1);
// }
// }
// } else {
// this.showlist[index].selected = true;
// this.selectId.push(this.showlist[index])
// }
// var listIds = this.selectId.join(",")
// console.log("提交的数据",listIds)
// }
// console.log(this.selectId)
// },
}
}
......
<template>
<view class="uni-cursor-point">
<view v-if="popMenu && (leftBottom||rightBottom||leftTop||rightTop) && content.length > 0" :class="{
'uni-fab--leftBottom': leftBottom,
'uni-fab--rightBottom': rightBottom,
'uni-fab--leftTop': leftTop,
'uni-fab--rightTop': rightTop
}"
class="uni-fab">
<view :class="{
'uni-fab__content--left': horizontal === 'left',
'uni-fab__content--right': horizontal === 'right',
'uni-fab__content--flexDirection': direction === 'vertical',
'uni-fab__content--flexDirectionStart': flexDirectionStart,
'uni-fab__content--flexDirectionEnd': flexDirectionEnd,
'uni-fab__content--other-platform': !isAndroidNvue
}"
:style="{ width: boxWidth, height: boxHeight, backgroundColor: styles.backgroundColor }" class="uni-fab__content"
elevation="5">
<view v-if="flexDirectionStart || horizontalLeft" class="uni-fab__item uni-fab__item--first" />
<view v-for="(item, index) in content" :key="index" :class="{ 'uni-fab__item--active': isShow }" class="uni-fab__item"
@click="_onItemClick(index, item)">
<image :src="item.active ? item.selectedIconPath : item.iconPath" class="uni-fab__item-image" mode="widthFix" />
<text class="uni-fab__item-text" :style="{ color: item.active ? styles.selectedColor : styles.color }">{{ item.text }}</text>
</view>
<view v-if="flexDirectionEnd || horizontalRight" class="uni-fab__item uni-fab__item--first" />
</view>
</view>
<view :class="{
'uni-fab__circle--leftBottom': leftBottom,
'uni-fab__circle--rightBottom': rightBottom,
'uni-fab__circle--leftTop': leftTop,
'uni-fab__circle--rightTop': rightTop,
'uni-fab__content--other-platform': !isAndroidNvue
}"
class="uni-fab__circle uni-fab__plus" :style="{ 'background-color': styles.buttonColor }" @click="_onClick">
<view class="fab-circle-v" :class="{'uni-fab__plus--active': isShow && content.length > 0}"></view>
<view class="fab-circle-h" :class="{'uni-fab__plus--active': isShow && content.length > 0}"></view>
</view>
</view>
</template>
<script>
let platform = 'other'
// #ifdef APP-NVUE
platform = uni.getSystemInfoSync().platform
// #endif
/**
* Fab 悬浮按钮
* @description 点击可展开一个图形按钮菜单
* @tutorial https://ext.dcloud.net.cn/plugin?id=144
* @property {Object} pattern 可选样式配置项
* @property {Object} horizontal = [left | right] 水平对齐方式
* @value left 左对齐
* @value right 右对齐
* @property {Object} vertical = [bottom | top] 垂直对齐方式
* @value bottom 下对齐
* @value top 上对齐
* @property {Object} direction = [horizontal | vertical] 展开菜单显示方式
* @value horizontal 水平显示
* @value vertical 垂直显示
* @property {Array} content 展开菜单内容配置项
* @property {Boolean} popMenu 是否使用弹出菜单
* @event {Function} trigger 展开菜单点击事件,返回点击信息
* @event {Function} fabClick 悬浮按钮点击事件
*/
export default {
name: 'UniFab',
emits:['fabClick','trigger'],
props: {
pattern: {
type: Object,
default () {
return {}
}
},
horizontal: {
type: String,
default: 'left'
},
vertical: {
type: String,
default: 'bottom'
},
direction: {
type: String,
default: 'horizontal'
},
content: {
type: Array,
default () {
return []
}
},
show: {
type: Boolean,
default: false
},
popMenu: {
type: Boolean,
default: true
}
},
data() {
return {
fabShow: false,
isShow: false,
isAndroidNvue: platform === 'android',
styles: {
color: '#3c3e49',
selectedColor: '#007AFF',
backgroundColor: '#fff',
buttonColor: '#007AFF'
}
}
},
computed: {
contentWidth(e) {
return (this.content.length + 1) * 55 + 10 + 'px'
},
contentWidthMin() {
return 55 + 'px'
},
// 动态计算宽度
boxWidth() {
return this.getPosition(3, 'horizontal')
},
// 动态计算高度
boxHeight() {
return this.getPosition(3, 'vertical')
},
// 计算左下位置
leftBottom() {
return this.getPosition(0, 'left', 'bottom')
},
// 计算右下位置
rightBottom() {
return this.getPosition(0, 'right', 'bottom')
},
// 计算左上位置
leftTop() {
return this.getPosition(0, 'left', 'top')
},
rightTop() {
return this.getPosition(0, 'right', 'top')
},
flexDirectionStart() {
return this.getPosition(1, 'vertical', 'top')
},
flexDirectionEnd() {
return this.getPosition(1, 'vertical', 'bottom')
},
horizontalLeft() {
return this.getPosition(2, 'horizontal', 'left')
},
horizontalRight() {
return this.getPosition(2, 'horizontal', 'right')
}
},
watch: {
pattern(newValue, oldValue) {
//console.log(JSON.stringify(newValue))
this.styles = Object.assign({}, this.styles, newValue)
}
},
created() {
this.isShow = this.show
if (this.top === 0) {
this.fabShow = true
}
// 初始化样式
this.styles = Object.assign({}, this.styles, this.pattern)
},
methods: {
_onClick() {
this.$emit('fabClick')
if (!this.popMenu) {
return
}
this.isShow = !this.isShow
},
open() {
this.isShow = true
},
close() {
this.isShow = false
},
/**
* 按钮点击事件
*/
_onItemClick(index, item) {
this.$emit('trigger', {
index,
item
})
},
/**
* 获取 位置信息
*/
getPosition(types, paramA, paramB) {
if (types === 0) {
return this.horizontal === paramA && this.vertical === paramB
} else if (types === 1) {
return this.direction === paramA && this.vertical === paramB
} else if (types === 2) {
return this.direction === paramA && this.horizontal === paramB
} else {
return this.isShow && this.direction === paramA ? this.contentWidth : this.contentWidthMin
}
}
}
}
</script>
<style lang="scss" scoped>
.uni-fab {
position: fixed;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
justify-content: center;
align-items: center;
z-index: 10;
}
.uni-cursor-point {
/* #ifdef H5 */
cursor: pointer;
/* #endif */
}
.uni-fab--active {
opacity: 1;
}
.uni-fab--leftBottom {
left: 5px;
bottom: 20px;
/* #ifdef H5 */
left: calc(5px + var(--window-left));
bottom: calc(20px + var(--window-bottom));
/* #endif */
padding: 10px;
}
.uni-fab--leftTop {
left: 5px;
top: 30px;
/* #ifdef H5 */
left: calc(5px + var(--window-left));
top: calc(30px + var(--window-top));
/* #endif */
padding: 10px;
}
.uni-fab--rightBottom {
right: 5px;
bottom: 20px;
/* #ifdef H5 */
right: calc(5px + var(--window-right));
bottom: calc(20px + var(--window-bottom));
/* #endif */
padding: 10px;
}
.uni-fab--rightTop {
right: 5px;
top: 30px;
/* #ifdef H5 */
right: calc(5px + var(--window-right));
top: calc(30px + var(--window-top));
/* #endif */
padding: 10px;
}
.uni-fab__circle {
position: fixed;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
justify-content: center;
align-items: center;
width: 55px;
height: 55px;
background-color: #3c3e49;
border-radius: 55px;
z-index: 11;
}
.uni-fab__circle--leftBottom {
left: 15px;
bottom: 30px;
/* #ifdef H5 */
left: calc(15px + var(--window-left));
bottom: calc(30px + var(--window-bottom));
/* #endif */
}
.uni-fab__circle--leftTop {
left: 15px;
top: 40px;
/* #ifdef H5 */
left: calc(15px + var(--window-left));
top: calc(40px + var(--window-top));
/* #endif */
}
.uni-fab__circle--rightBottom {
right: 15px;
bottom: 30px;
/* #ifdef H5 */
right: calc(15px + var(--window-right));
bottom: calc(30px + var(--window-bottom));
/* #endif */
}
.uni-fab__circle--rightTop {
right: 15px;
top: 40px;
/* #ifdef H5 */
right: calc(15px + var(--window-right));
top: calc(40px + var(--window-top));
/* #endif */
}
.uni-fab__circle--left {
left: 0;
}
.uni-fab__circle--right {
right: 0;
}
.uni-fab__circle--top {
top: 0;
}
.uni-fab__circle--bottom {
bottom: 0;
}
.uni-fab__plus {
font-weight: bold;
}
.fab-circle-v {
position: absolute;
width: 3px;
height: 31px;
left: 26px;
top: 12px;
background-color: white;
transform: rotate(0deg);
transition: transform 0.3s;
}
.fab-circle-h {
position: absolute;
width: 31px;
height: 3px;
left: 12px;
top: 26px;
background-color: white;
transform: rotate(0deg);
transition: transform 0.3s;
}
.uni-fab__plus--active {
transform: rotate(135deg);
}
.uni-fab__content {
/* #ifndef APP-NVUE */
box-sizing: border-box;
display: flex;
/* #endif */
flex-direction: row;
border-radius: 55px;
overflow: hidden;
transition-property: width, height;
transition-duration: 0.2s;
width: 55px;
border-color: #DDDDDD;
border-width: 1rpx;
border-style: solid;
}
.uni-fab__content--other-platform {
border-width: 0px;
box-shadow: 0 0 5px 2px rgba(0, 0, 0, 0.2);
}
.uni-fab__content--left {
justify-content: flex-start;
}
.uni-fab__content--right {
justify-content: flex-end;
}
.uni-fab__content--flexDirection {
flex-direction: column;
justify-content: flex-end;
}
.uni-fab__content--flexDirectionStart {
flex-direction: column;
justify-content: flex-start;
}
.uni-fab__content--flexDirectionEnd {
flex-direction: column;
justify-content: flex-end;
}
.uni-fab__item {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: column;
justify-content: center;
align-items: center;
width: 55px;
height: 55px;
opacity: 0;
transition: opacity 0.2s;
}
.uni-fab__item--active {
opacity: 1;
}
.uni-fab__item-image {
width: 25px;
height: 25px;
margin-bottom: 3px;
}
.uni-fab__item-text {
color: #FFFFFF;
font-size: 12px;
}
.uni-fab__item--first {
width: 55px;
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment