123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658 |
- <template>
- <view class="registrationRecord-box">
- <view class="list-box">
- <u--form label-width="auto" ref="uForm" :model="form" labelAlign="right">
- <!-- <u-subsection :list="list" mode="subsection" :current="curNow" @change="sectionChange"></u-subsection> -->
- <u-tabs :list="tablist"
- :itemStyle="{
- width: '330rpx',
- height: '80rpx'
- }"
- :activeStyle="{
- color:'#4573FC'
- }"
- lineColor="#4573FC"
- @click="({index}) => {
- curNow = index
- anewQueryMyList()
- }"
- >
- </u-tabs>
- <u-cell-group customStyle="margin-top: 2px">
- <template>
- <u-cell title="任务开始时间" :border="true" :isLink="true"
- @click="calendarShow = true">
- <view slot="value">
- <u-form-item label="" prop="form.startTime">
- <template v-if="form.createTimeEnd">
- {{ form.createTimeBegin }} - {{ form.createTimeEnd
- }}</template>
- <template v-else></template>
- </u-form-item>
- </view>
-
- <u-icon v-if="form.createTimeEnd == ''" slot="right-icon" size="16" name="arrow-right"></u-icon>
- <view v-else slot="right-icon" @click.stop="() => {
- form.createTimeBegin = ''
- form.createTimeEnd = ''
- anewQueryMyList()
- }" style="margin-left: 20rpx;">
- <u-icon size="16" name="close-circle"></u-icon>
- </view>
-
- </u-cell>
- <!-- <tq-date-time ref="startTimeRef"
- :disEndDate="form.createTimeBegin"
- @confirm="(data) => {
- form.createTimeBegin = data
- }">
- </tq-date-time> -->
- </template>
- <!-- <template>
- <u-cell title="结束时间" :border="true" :isLink="true"
- @click="$refs.endTimeRef.show()">
- <view slot="value">
- <u-form-item label="" prop="form.endTime">
- {{ form.createTimeEnd }}
- </u-form-item>
- </view>
- </u-cell>
- <tq-date-time ref="endTimeRef"
- :disStartDate="form.createTimeEnd"
- @confirm="(data) => {
- form.createTimeEnd = data
- }">
- </tq-date-time>
- </template> -->
- <template>
- <u-cell title="选择任务状态" :border="true" :isLink="true"
- @click="$refs.selectRef.show()">
- <view slot="value">
- <u-form-item label="" prop="form.endTime">
- {{ form.exStsName }}
- </u-form-item>
- </view>
-
- <u-icon v-if="form.exStsName == ''" slot="right-icon" size="16" name="arrow-right"></u-icon>
- <view v-else slot="right-icon" @click.stop="() => {
- form.exSts = ''
- form.exStsName = ''
- anewQueryMyList()
- }" style="margin-left: 20rpx;">
- <u-icon size="16" name="close-circle"></u-icon>
- </view>
-
- </u-cell>
- <tq-select ref="selectRef"
- :columns="taskStatus"
- @confirm="(data) => {
- form.exSts = data.value
- form.exStsName = data.label
- anewQueryMyList()
- }">
- </tq-select>
- </template>
- <template v-if="curNow === 1">
- <u-cell title="车队类型" :border="true" :isLink="true"
- @click="$refs.selectOwnTypeRef.show()">
- <view slot="value">
- <u-form-item label="" prop="form.ownTypeName">
- {{ form.ownTypeName }}
- </u-form-item>
- </view>
-
- <u-icon v-if="form.ownTypeName == ''" slot="right-icon" size="16" name="arrow-right"></u-icon>
- <view v-else slot="right-icon" @click.stop="() => {
- form.ownType = ''
- form.ownTypeName = ''
- anewQueryMyList()
- }" style="margin-left: 20rpx;">
- <u-icon size="16" name="close-circle"></u-icon>
- </view>
-
- </u-cell>
- <tq-select ref="selectOwnTypeRef"
- :columns="ownTypeList"
- @confirm="(data) => {
- form.ownType = data.value
- form.ownTypeName = data.label
- anewQueryMyList()
- }">
- </tq-select>
- </template>
- <template v-if="curNow === 1">
- <u-cell title="司机" :border="true" :isLink="true"
- @click="$refs.caruserChooseRef.show()">
- <view slot="value">
- <u-form-item label="" prop="form.vehicleId">
- {{ form.driverName }}
- </u-form-item>
- </view>
-
- <u-icon v-if="form.driverName == ''" slot="right-icon" size="16" name="arrow-right"></u-icon>
- <view v-else slot="right-icon" @click.stop="() => {
- form.driverId = ''
- form.driverName = ''
- anewQueryMyList()
- }" style="margin-left: 20rpx;">
- <u-icon size="16" name="close-circle"></u-icon>
- </view>
-
- </u-cell>
- <tq-car-user ref="caruserChooseRef"
- :isGetIcon="true"
- :queryType="3"
- @confirm="(data) => {
- form.driverId = data.value
- form.driverName = data.label
- anewQueryMyList()
- }"
- @onDataLoad="">
- </tq-car-user>
- </template>
- <template>
- <u-cell title="车辆" :border="true" :isLink="true"
- @click="$refs.carChooseRef.show()">
- <view slot="value">
- <u-form-item label="" prop="form.vehicleId">
- {{ form.plate }}
- </u-form-item>
- </view>
-
- <u-icon v-if="form.plate == ''" slot="right-icon" size="16" name="arrow-right"></u-icon>
- <view v-else slot="right-icon" @click.stop="() => {
- form.vehicleId = ''
- form.plate = ''
- anewQueryMyList()
- }" style="margin-left: 20rpx;">
- <u-icon size="16" name="close-circle"></u-icon>
- </view>
-
- </u-cell>
- <tq-car-user ref="carChooseRef"
- :isGetIcon="true"
- @confirm="(data) => {
- form.vehicleId = data.value
- form.plate = data.label
- anewQueryMyList()
- }"
- @onDataLoad="">
- </tq-car-user>
- </template>
- <template>
- <!-- 重置按钮 -->
- <u-button customStyle="font-size: 24rpx;height: 64rpx;" :plain="false" size="mini" @click="resetData()">重置</u-button>
- </template>
- </u-cell-group>
- </u--form>
- </view>
- <view class="item-list-box">
- <view class="info-box" v-for="(item, index) in queryMyListdata" :key="index">
- <u-row customStyle="margin-bottom: 10px">
- <u-col span="6">
- <view class="demo-layout bg-purple-light">申请人:{{ item.applyName }}</view>
- </u-col>
- <u-col span="6">
- <view class="demo-layout bg-purple">部门:{{ item.deptName }}</view>
- </u-col>
- </u-row>
- <u-row customStyle="margin-bottom: 10px">
- <u-col span="12">
- <view class="demo-layout bg-purple-light">申请人联系电话:{{ item.applyTel }}</view>
- </u-col>
-
- </u-row>
- <u-row customStyle="margin-bottom: 10px">
- <u-col span="6">
- <view class="demo-layout bg-purple">用车类型:{{ item.matterType }}</view>
- </u-col>
- <!-- <u-col span="6">
- <view class="demo-layout bg-purple">任务状态:{{ item.exStsName }}</view>
- </u-col> -->
- </u-row>
- <u-row customStyle="margin-bottom: 10px">
- <u-col span="12">
- <view class="demo-layout bg-purple-light">预计执行时间:{{ item.startPlanTime }} — {{ item.endPlanTime
- }}
- </view>
- </u-col>
- </u-row>
- <u-row customStyle="margin-bottom: 10px" v-if="item.pointAddr">
- <u-col span="12">
- <view class="demo-layout bg-purple-light">起止点:{{ pointAddrParse(item.pointAddr) }}</view>
- </u-col>
- </u-row>
- <u-row customStyle="margin-bottom: 10px">
- <u-col span="6">
- <view class="demo-layout bg-purple-light">用车人数:{{ item.totalNum }}</view>
- </u-col>
- <u-col span="6">
- <view class="demo-layout bg-purple">任务状态:{{ item.exStsName }}</view>
- </u-col>
- </u-row>
- <view class="hide-warp" v-if="item.openOther">
- <u-row customStyle="margin-bottom: 10px">
- <u-col span="6">
- <view class="demo-layout bg-purple-light">车辆:{{ item.plate }}({{ item.ownType }})</view>
- </u-col>
- <u-col span="6">
- <view class="demo-layout bg-purple">车辆所属:{{ item.vehicleDeptName }}</view>
- </u-col>
- </u-row>
- <u-row customStyle="margin-bottom: 10px">
- <u-col span="6">
- <view class="demo-layout bg-purple-light">司机:{{ item.driverName }}({{ item.ownType }})</view>
- </u-col>
- <u-col span="6">
- <view class="demo-layout bg-purple">司机所属:{{ item.driverDeptName }}</view>
- </u-col>
- </u-row>
- <u-row customStyle="margin-bottom: 10px">
- <u-col span="12">
- <view class="demo-layout bg-purple-light">备注信息:{{ item.remark }}</view>
- </u-col>
- </u-row>
- </view>
- <view @click="item.openOther = !item.openOther" class="open-warp">
- {{ item.openOther?'收起':'展开' }}
- </view>
- <u-row customStyle="margin-bottom: 10px">
- <u-col span="12">
- <view style="display: flex; justify-content: center;">
- <u-button type="primary" icon="phone" @tap="phoneCall(item.driverTel)" :plain="true"
- color="#4573FC"
- v-if="$hasPermi('mobile:index:base:driverTask:driverPhone')"
- customStyle="width: 200rpx;height:64rpx" shape="circle"
- text="司机"></u-button>
- <u-button type="warning" icon="phone" @tap="phoneCall(item.applyTel)" :plain="true"
- color="#F7A254"
- v-if="$hasPermi('mobile:index:base:driverTask:applyPhone')"
- customStyle="width:200rpx;height:64rpx" shape="circle"
- text="申请人"></u-button>
- <u-button type="primary" icon="phone" @tap="phoneCall(item.userTel)" :plain="true"
- color="#4573FC"
- v-if="$hasPermi('mobile:index:base:driverTask:usePhone')"
- customStyle="width: 200rpx;height:64rpx" shape="circle"
- text="用车人"></u-button>
- </view>
- </u-col>
- </u-row>
-
- <u-row customStyle="margin-bottom: 10px">
- <u-col span="9" style="color: #4573FC;font-size: 28rpx;">
- <view v-for="(fitem,findex) in item.listCost" :key="findex">
- {{fitem.costName}}:{{fitem.price}} ;{{fitem.processStatusName}}
- </view>
- </u-col>
-
- <u-col span="3">
- <view
- style="color: #4573FC;display: flex;font-size: 28rpx;text-decoration: underline;justify-content: flex-end;"
- @click="goFlow(item)"
- >
- <u-icon name="plus" color="#4573FC" size="14"></u-icon>
- 费用报销
- </view>
- </u-col>
- </u-row>
- <!-- <u-button type="warning" customStyle="margin-left: 2rpx;" text="退回"
- @click="rebutConfirmation('rebut', item)"></u-button> -->
- <u-row customStyle="margin-bottom: 10px;" v-if="curNow === 0">
- <u-col span="12">
- <view style="display: flex;">
- <!-- exSts 车辆调度状态:1.未派车、2.已派车、3.已结束、4.已中止 -->
- <!-- 任务操作类型:approve.出发和结束、rebut.驳回,可用值:addSignature,approve,cancel,cc,claim,delSignature,delegate,hold,move,msg,postSignature,preSignature,read,rebut,resubmit,start,stop,submit,takeBack,turnInto,unclaim -->
- <u-button type="primary" text="出发" @click="postTaskOperate('approve', item)"
- v-if="item.exSts === '1'"></u-button>
- <u-button type="error" text="结束" @click="postTaskOperate('approve', item)"
- v-if="item.exSts === '2'"></u-button>
- <u-button type="warning" customStyle="margin-left: 2rpx;" text="退回"
- @click="rebutConfirmation('rebut', item)"
- v-if="item.exSts === '1'"></u-button>
- <u-button :plain="true" :disabled="true" text="已结束" v-if="item.exSts === '3'"></u-button>
- <u-button type="error" :plain="true" :disabled="true" text="已中止"
- v-if="item.exSts === '4'"></u-button>
- </view>
- </u-col>
- </u-row>
- </view>
- </view>
- <u-loadmore :status="status" />
- <u-toast ref="uToast" />
- <u-calendar :show="calendarShow" mode="range" :defaultDate="defaultDate" :maxDate="maxDate" minDate="2023-10-01"
- monthNum="24"
- @confirm="calendarChange" @close="calendarShow = false"></u-calendar>
- <u-modal :show="modalshow" @confirm="modalconfirm" showCancelButton @cancel="modalcancel" :title="title">
- <view class="slot-content">
- <u--textarea
- placeholder="请输入退回原因"
- border="surround"
- v-model="operateMessage"></u--textarea>
- </view>
- </u-modal>
- </view>
- </template>
- <script>
- import { drivertaskList, taskOperate } from "@/api/wfApi/index.js";
- export default {
- data() {
- return {
- calendarShow: false, // 日历
- calendarStart: this.dayjs().subtract(6, 'day').format('YYYY-MM-DD'),// 开始时间
- calendarEnd: this.dayjs().subtract(0, 'day').format('YYYY-MM-DD'), // 结束时间
- defaultDate: [this.dayjs().subtract(6, 'day').format('YYYY-MM-DD'), this.dayjs().subtract(0, 'day').format('YYYY-MM-DD')],
- maxDate: this.dayjs().add(365, 'day').format('YYYY-MM-DD'),
- list: ['我的', '全部'],
- tablist: [
- { name: '我的'},
- { name: '全部'},
- ],
- curNow: 0,
- queryMyListdata: [],
- form: {
- createTimeBegin: '',//开始时间
- createTimeEnd: '', //结束时间
- exSts: '', //车辆调度状态:
- exStsName: '',
- vehicleId: '',
- plate: '',
- driverId: '',
- driverName: '',
- ownType: '',//车队类型
- ownTypeName: '',
- },
- // 车辆调度状态:1.未派车、2.已派车、3.已结束、4.已中止
- taskStatus: [
- { label: '未开始', value: 1 },
- { label: '执行中', value: 2 },
- { label: '已结束', value: 3 },
- { label: '已终止', value: 4 },
- ],
- // 车队类型:1.内部车队、2.外部车队
- ownTypeList: [
- { label: '内部车队', value: 1 },
- { label: '外部车队', value: 2 },
- ],
- operateMessage: '',//退回原因
- modalshow: false,
- modalItem: {},
- title: '请输入退回原因',
- content: '请输入退回原因',
- pageIndex: 1,
- total: 0,
- status: 'nomore', //loading nomore loadmore
- openOther:false
- }
- },
- onShow(option) {
- this.queryMyListdata = []
- this.pageIndex = 1
- this.queryMyList();
- },
- methods: {
- resetData(){
- this.form = {
- createTimeBegin: '',//开始时间
- createTimeEnd: '', //结束时间
- exSts: '', //车辆调度状态:
- exStsName: '',
- vehicleId: '',
- plate: '',
- driverId: '',
- driverName: '',
- ownType: '',//车队类型
- ownTypeName:''
- }
- this.anewQueryMyList()
- },
- calendarChange(e) {
- console.info('选择的时间', e)
- // 修改日期
- this.form.createTimeBegin = e[0]; // 开始时间
- this.form.createTimeEnd = e[e.length - 1]; // 结束时间
- this.defaultDate = [e[0], e[e.length - 1]]
- this.calendarShow = false;
- this.anewQueryMyList();
- },
- anewQueryMyList() {
- this.pageIndex = 1;
- this.queryMyListdata = [];
- this.queryMyList();
- },
- phoneCall(e) {
- uni.makePhoneCall({
- phoneNumber: e //仅为示例
- });
- },
- pointAddrParse(e) {
- let arr = JSON.parse(e)
- let arrStg = ''
- for (let item of arr) {
- arrStg += item.address + '-'
- }
- return arrStg.slice(0, -1);
- },
- sectionChange(index) {
- this.curNow = index;
- this.anewQueryMyList()
- },
- toRealMap(item) {
- let obj = {
- routeId: item.routeId,
- classId: item.classId,
- startAndEnd: item.startAndEnd
- }
- let objst = encodeURIComponent(JSON.stringify(obj))
- uni.navigateTo({
- url: '/newdriversub/setClassPlan/details?item=' + objst
- });
- },
- async queryMyList() {
- this.loading = 'loading'
- let obj = {
- ...this.form,
- pageIndex: this.pageIndex,
- pageSize: 3,
- queryType: this.curNow + 1 //查询类型:1.本人、2.全部
- }
- for (let key in obj) {
- if (obj[key] === '') delete obj[key]
- }
- let { data, code, page } = await drivertaskList(obj)
- if (code == "0") {
- let list = data.map(item=>
- {
- return {
- ...item,
- openOther:false
- }
- }
- )
- this.queryMyListdata = this.queryMyListdata.concat(list)
- this.total = Number(page.totalCount)
- this.loading = 'loadmore'
- if (this.queryMyListdata.length >= this.total) {
- this.status = 'nomore'
- }
- console.log('数据', this.queryMyListdata)
- }
- },
- rebutConfirmation(e, item) {
- //请输入原因
- this.modalshow = true
- this.modalItem = item
- },
- modalcancel(e){
- this.modalshow = false
- this.operateMessage=''
- },
- modalconfirm(e) {
- if (this.operateMessage === '') {
- return uni.showToast({
- title: '请输入退回原因',
- icon: 'none'
- });
- } else {
- this.modalshow = false
- this.postTaskOperate('rebut', this.modalItem)
- }
- },
- // 操作
- async postTaskOperate(e, item) {
- let { data, code, msg } = await taskOperate(
- {
- taskOperate: e,
- taskId: item.taskId, //任务id
- processInstanceId: item.processInstanceId,//流程实例id
- operateMessage: this.operateMessage, //操作原因
- })
- if (code == "0") {
- this.operateMessage = ''
- uni.showToast({
- title: msg || '操作成功',
- duration: 2000
- });
- this.anewQueryMyList();
- }
- },
- async goFlow(item) {
- const {id} = item
-
- uni.navigateTo({
- url: `/pages/flow/diboot?routes=/workflow/mobile/startFlow&workflowKey=system_cost&fromKey=system_flow_veh&fromId=${id}`,
- })
-
- /* let res
-
- let isDetails = false
- let defaultTitle
- let processInstanceId
- if(type == 'technologySafe') {
- res = await getStartTechnologySafeFormInfo()
- if(item.tsProcessInstanceId) isDetails=true
- processInstanceId = item.tsProcessInstanceId
- } else if (type == 'behaviorSafe') {
- res = await getStartBehaviorSafeFormInfo()
- if(item.bsProcessInstanceId) isDetails=true
- processInstanceId = item.bsProcessInstanceId
- }
-
- let {code,data} = res
-
- if(code == 0 && data) {
-
- if(isDetails) {
-
- uni.navigateTo({
- url: `/pages/flow/diboot?routes=/workflow/mobile/dealTask&taskId=${-1}&processInstanceId=${processInstanceId}&category=${'cc'}&withDealTask=true&fromMobile=true`,
- })
- } else {
- uni.navigateTo({
- url: `/pages/flow/diboot?routes=/workflow/mobile/startFlow&id=${data}&taskId=${id}&taskType=${type}`
- })
- }
-
- } */
-
-
- }
- },
- // 触底
- onReachBottom() {
- console.log('当前条数', this.queryMyListdata.length, '总条数', this.total)
- if (this.queryMyListdata.length >= this.total) return;
- this.pageIndex++
- this.queryMyList();
- }
- }
- </script>
- <style lang="scss" scoped>
- .registrationRecord-box {
- padding: 0 0 10rpx 0;
- overflow: unset;
- .list-box {
- border-radius: 10rpx;
- background: #fff;
- // padding: 20rpx;
- position: sticky;
- // align-items: center;
- // display: flex;
- top: 0px;
- width: 100%;
- z-index: 999;
- /deep/ {
- .u-form-item__body {
- padding: 0;
- }
- }
- }
- .item-list-box {
- padding: 10rpx 0 0 0;
- // background: #fff;
- position: relative;
- .info-box {
- margin-bottom: 20rpx;
- border: none;
- width: 100%;
- // border-radius: 20rpx;
- box-shadow: 2rpx 2rpx 5rpx rgba(169, 169, 169, 0.34901960784313724);
- // height: 150rpx;
- background-color: rgba(255, 255, 255, 1);
- display: flex;
- align-items: center;
- flex-wrap: wrap;
- padding: 20rpx;
- box-sizing: border-box;
- position: relative;
- font-size: 24rpx;
- }
- }
- .slot-content {
- width: 100%;
- }
- .hide-warp{
- width: 100%;
- }
- .open-warp{
- width: 100%;
- padding: 20rpx;
- display: flex;
- justify-content: flex-end;
- color: #4573FC;
- }
- }
- </style>
|