293 lines
17 KiB
HTML
293 lines
17 KiB
HTML
<link rel="stylesheet" href="/plugins/addon/idcsmart_ticket/template/admin/css/order.css" />
|
||
<link rel="stylesheet" href="/plugins/addon/idcsmart_ticket/template/admin/css/common/viewer.min.css">
|
||
<style>
|
||
.t-layout__footer {
|
||
display: none;
|
||
}
|
||
</style>
|
||
<!-- =======内容区域======= -->
|
||
<div id="content" class="template" v-cloak>
|
||
<com-config class="ticket_detail">
|
||
<t-loading attach="#content" size="small" :loading="pageLoading"></t-loading>
|
||
<div class="detail-box" ref="scrollDiv">
|
||
<div class="left-list-box">
|
||
<div class="left-top">
|
||
<t-divider class="reply-divider" align="left">{{lang.order_text26}}</t-divider>
|
||
<t-list class="reply-list">
|
||
<t-list-item v-for="(item, index) in replyList" :key="index">
|
||
<div class="reply-item">
|
||
<div class="reply-top" v-if="orderDetailData.post_admin_id > 0 && item.id == 0">
|
||
<span class="reply-user red-text">{{lang.order_text28 }}</span>
|
||
<span class="user-name" :class="item.client_id ? 'link-style' : ''"
|
||
@click="goClientPage(item.client_id)">{{item.type === 'Client' ? item.client_name : item.type ===
|
||
'Admin' ? item.admin_name : item.name ? item.name : '--'}}</span>
|
||
</div>
|
||
<div class="reply-top" v-else>
|
||
<span class="reply-user"
|
||
:class="item.type === 'Client' ? 'green-text' : item.type === 'Admin' ? 'red-text' : 'pink-text'">{{item.type
|
||
=== 'Client' ? lang.order_text27 : item.type === 'Admin' ? lang.order_text28 : lang.order_text29
|
||
}}</span>
|
||
<span class="user-name" :class="item.client_id ? 'link-style' : ''"
|
||
@click="goClientPage(item.client_id)">{{item.type === 'Client' ? item.client_name : item.type ===
|
||
'Admin' ? item.admin_name : item.name ? item.name : '--'}}</span>
|
||
<span class="time-div"><span>{{formatDate(item.create_time)}}</span></span>
|
||
</div>
|
||
<div class="reply-main">
|
||
<div class="peply-wide" @mouseover="mouseOver(item)" @mouseleave="mouseLeave(item)">
|
||
<div class="reply-middle"
|
||
:class="item.type === 'Client' ? 'green-bg' : item.type === 'Admin' ? 'blue-bg' : 'pink-bg'">
|
||
<div v-html="item.content" @click="hanldeImage($event)" class="replu-conten"></div>
|
||
</div>
|
||
<div class="btns">
|
||
<template v-if="item.type === 'notes'">
|
||
<div class="text-btn" v-permission="'auth_user_ticket_detail_create_notes'"
|
||
v-show="item.isShowBtn && item.id != 0 && orderDetailData.can_operate !== 0">
|
||
<t-button :disabled="orderDetailData.can_operate === 0" shape="circle" class="edit-btn"
|
||
variant="text" @click="editItem(item)">
|
||
<t-icon name="edit-1" size="small" style="color:#1862DC" />
|
||
</t-button>
|
||
<t-button :disabled="orderDetailData.can_operate === 0" shape="circle" variant="text"
|
||
@click="deleteItem(item)">
|
||
<t-icon name="delete" size="small" style="color:#FF0000" />
|
||
</t-button>
|
||
</div>
|
||
</template>
|
||
<template v-else>
|
||
<div class="text-btn" v-permission="'auth_user_ticket_detail_reply_ticket'"
|
||
v-show="item.isShowBtn && item.id != 0 && orderDetailData.can_operate !== 0">
|
||
<t-button :disabled="orderDetailData.can_operate === 0" shape="circle" class="edit-btn"
|
||
variant="text" @click="editItem(item)">
|
||
<t-icon name="edit-1" size="small" style="color:#1862DC" />
|
||
</t-button>
|
||
<t-button :disabled="orderDetailData.can_operate === 0" shape="circle" variant="text"
|
||
@click="deleteItem(item)">
|
||
<t-icon name="delete" size="small" style="color:#FF0000" />
|
||
</t-button>
|
||
</div>
|
||
</template>
|
||
</div>
|
||
</div>
|
||
<div class="reply-bottom">
|
||
<div v-if="item.attachment && item.attachment.length > 0">
|
||
<div class="reply-list-attachment-item" v-for="(f,i) in item.attachment" :key="i"
|
||
@click="clickFile(f)">
|
||
<span :title="f.name">
|
||
<t-icon name="file-paste" size="small" style="color:#9696A3"></t-icon>{{f.name}}
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</t-list-item>
|
||
</t-list>
|
||
</div>
|
||
<div class="left-bottom relply-input">
|
||
<com-tinymce ref="comTinymce" height="200"></com-tinymce>
|
||
</div>
|
||
<div class="btn-box">
|
||
<div v-if="isEditing">
|
||
<t-button :disabled="orderDetailData.can_operate === 0" class="ok-btn" @click="handelEdit"
|
||
:loading="editLoding">{{lang.order_text32}}</t-button>
|
||
<t-button :disabled="orderDetailData.can_operate === 0" theme="default" class="canle-btn"
|
||
@click="cancelEdit">{{lang.order_text33}}</t-button>
|
||
</div>
|
||
<div v-else-if="isAddNotes">
|
||
<div>
|
||
<t-button class="ok-btn" :disabled="orderDetailData.can_operate === 0" @click="handelAddNotes"
|
||
:loading="addNotesLing"
|
||
v-if="$checkPermission('auth_user_ticket_detail_create_notes')">{{lang.order_text30}}</t-button>
|
||
<t-button :disabled="orderDetailData.can_operate === 0" theme="default" class="canle-btn"
|
||
@click="cancelAddNotes">{{lang.order_text33}}</t-button>
|
||
</div>
|
||
</div>
|
||
<div v-else>
|
||
<div class="btn-left">
|
||
<t-upload v-model="attachmentList" :action="uploadUrl" :headers="uploadHeaders" multiple
|
||
:auto-upload="true" :format-response="formatResponse" class="file">
|
||
<t-button class="upload"><t-icon name="upload"></t-icon>{{lang.order_text99}}</t-button>
|
||
</t-upload>
|
||
<t-button :disabled="orderDetailData.can_operate === 0" class="send-btn" @click="submitReply"
|
||
:loading="sendLoading"
|
||
v-if="$checkPermission('auth_user_ticket_detail_reply_ticket')">{{lang.order_text34}}</t-button>
|
||
<t-button theme="default" @click="goList">{{lang.order_text35}}</t-button>
|
||
</div>
|
||
</div>
|
||
<div class="left">
|
||
<template v-if="!isAddNotes">
|
||
<t-button :disabled="orderDetailData.can_operate === 0" class="add-btn" @click="addNotes"
|
||
v-show="!isEditing"
|
||
v-if="$checkPermission('auth_user_ticket_detail_create_notes')">{{lang.order_text30}}
|
||
</t-button>
|
||
<t-button :disabled="orderDetailData.can_operate === 0" theme="primary" variant="outline" @click="replayVisible = true"
|
||
v-if="$checkPermission('auth_user_ticket_detail_use_prereply')">{{lang.order_text31}}
|
||
</t-button>
|
||
</template>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="right-form-box">
|
||
<div class="order-detail-box">
|
||
<t-divider class="reply-divider" align="left">{{lang.order_detail}}</t-divider>
|
||
<div class="right-wide">
|
||
<div class="log-btn mt-15" @click="handelLog" v-permission="'auth_user_ticket_detail_ticket_log'">
|
||
{{lang.order_text21}}
|
||
</div>
|
||
<div class="info-title">{{lang.order_text15}}：<span class="info-item">#{{orderDetailData.ticket_num}}-
|
||
<span v-if="orderDetailData.downstream_delivery === 1">{{lang.order_text78}}</span><span
|
||
v-if="orderDetailData.upstream_ticket_id > 0">{{lang.order_text79}}</span>{{orderDetailData.title}}
|
||
</span></div>
|
||
<div class="info-title" @click="goUserPagr">{{lang.order_text18}}：<span
|
||
class="blue-text">#{{orderDetailData.client_id}} - {{orderDetailData.username}}</span>
|
||
</div>
|
||
<div class="info-title">{{lang.order_text19}}：<span class="info-item">{{ orderDetailData.create_time ?
|
||
formatDate(orderDetailData.create_time) : '--'}}</span></div>
|
||
<div class="info-title">{{lang.order_text20}}：<span
|
||
class="info-item">{{orderDetailData.distanceTime}}</span>
|
||
</div>
|
||
<div class="product-info" v-for="(item,index) in product_obj_list" :key="item.id">
|
||
<div class="product-item">
|
||
<span class="info-title">{{lang.order_text102}}：</span>
|
||
<span @click="goProductDetail(item)" class="host-item">{{item.product_name}}</span>
|
||
</div>
|
||
<div class="product-item">
|
||
<span class="info-title">{{lang.order_text103}}：</span>
|
||
<span>{{item.name || '--'}}</span>
|
||
</div>
|
||
|
||
<div class="product-item" v-if="orderDetailData.node_num">
|
||
<span class="info-title">{{lang.order_text107}}：</span>
|
||
<span>{{orderDetailData.node_num}}</span>
|
||
</div>
|
||
<div class="product-item" v-else>
|
||
<span class="info-title">{{lang.order_text104}}：</span>
|
||
<span v-if="item.ip_num > 0">{{item.dedicate_ip}}
|
||
<span v-if="item.ip_num > 1">{{item.ip_num - 1}}
|
||
</span>
|
||
<svg class="common-look" @click="copyIp(item)">
|
||
<use xlink:href="#icon-copy">
|
||
</use>
|
||
</svg>
|
||
</span>
|
||
<span v-else>--</span>
|
||
</div>
|
||
<div class="product-item">
|
||
<span class="info-title">{{lang.order_text105}}：</span>
|
||
<span>{{currency_prefix}}{{item.first_payment_amount}}</span>
|
||
</div>
|
||
<div class="product-item">
|
||
<span class="info-title">{{lang.order_text106}}：</span>
|
||
<span>{{formatDate(item.due_time)}}</span>
|
||
</div>
|
||
</div>
|
||
<div class="select-box">
|
||
<div class="left-btn">
|
||
<div class="mt-15">
|
||
<span class="info-title">{{lang.order_text22}}：</span>
|
||
<t-select v-if="orderDetailData.can_operate !== 0" :disabled="orderDetailData.can_operate === 0"
|
||
class="select-240" :max="1" @change="hostChange" :min-collapsed-num="1" clearable
|
||
:placeholder="lang.order_text24" clearable v-model="params.listStr" :options="hostList"
|
||
:keys="{ label: 'showName', value: 'id'}" :scroll="{ type: 'virtual' }"
|
||
:popup-props="{ overlayInnerStyle: { height: '300px' } }">
|
||
</t-select>
|
||
<template v-else>
|
||
<span class="host-div" v-if="product_obj_list !==0">
|
||
<span v-for="(item,index) in product_obj_list" :key="item.id" class="host-item"
|
||
@click="goProductDetail(item)">
|
||
{{item.showName}}
|
||
<span v-if="(index !== product_obj_list.length - 1) && product_obj_list.length !== 1">、</span>
|
||
</span>
|
||
</span>
|
||
<span class="host-div" v-else>
|
||
<span class="host-item">--</span>
|
||
</span>
|
||
</template>
|
||
</div>
|
||
<div class="mt-15">
|
||
<span class="info-title">{{lang.order_text65}}：</span>
|
||
<t-select class="select-240" :placeholder="lang.please_search_order_type" clearable
|
||
v-model="params.ticket_type" :keys="{ label: 'name', value: 'id' }"
|
||
:options="orderTypeList"></t-select>
|
||
</div>
|
||
<div class="mt-15">
|
||
<span class="info-title">{{lang.order_text25}}：</span>
|
||
<t-select :disabled="orderDetailData.can_operate === 0" class="select-240 no-mar"
|
||
:placeholder="lang.please_search_order_status" clearable v-model="params.status"
|
||
:keys="{ label: 'name', value: 'id'}" :options="order_status_options"></t-select>
|
||
</div>
|
||
<div class="save-btn">
|
||
<t-button @click="handelEditOrderStatus" :loading="editLoding"
|
||
v-permission="'auth_user_ticket_detail_save_ticket'">{{lang.order_text13}}</t-button>
|
||
</div>
|
||
</div>
|
||
<t-button v-if="orderDetailData.delivery_operate !== 0"
|
||
@click="deliveryVisible = true">{{delivery_operate_type[orderDetailData.delivery_operate]}}</t-button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="order-forwards" v-if="orderDetailData?.forwards?.length > 0">
|
||
<t-divider class="reply-divider" align="left">{{lang.order_text108}}</t-divider>
|
||
<div class="order-forwards-list">
|
||
<t-steps layout="vertical" theme="dot" :current="orderDetailData?.forwards?.length" readonly>
|
||
<t-step-item v-for="(item, index) in orderDetailData.forwards" :key="index">
|
||
<template #content>
|
||
<div class="order-forwards-item">
|
||
<div class="order-forwards-top">
|
||
<span class="order-forwards-name">{{item.nickname}}-{{item.forward_nickname}}</span>
|
||
<span class="order-forwards-time">{{formatDate(item.create_time)}}</span>
|
||
</div>
|
||
<div class="order-forwards-notes">{{lang.order_text29}}：{{item.notes || '--'}}</div>
|
||
</div>
|
||
</template>
|
||
</t-step-item>
|
||
</t-steps>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- 删除弹窗 -->
|
||
<t-dialog :visible.sync="deleteVisible" :header="lang.order_text36" :body="lang.order_text37"
|
||
@confirm="handelDelete" @close="deleteVisible = false">
|
||
</t-dialog>
|
||
<!-- 传递弹窗 -->
|
||
<t-dialog theme="danger" :visible.sync="deliveryVisible"
|
||
:header="lang.order_text84 + delivery_operate_type[orderDetailData.delivery_operate] + '?'">
|
||
<template slot="footer">
|
||
<t-button theme="primary" @click="handelDeliveryOperate" :loading="deliveryLoading">{{lang.sure}}</t-button>
|
||
<t-button theme="default" @click="deliveryVisible = false">{{lang.cancel}}</t-button>
|
||
</template>
|
||
</t-dialog>
|
||
<!-- 日志记录弹窗 -->
|
||
<t-dialog :header="lang.order_text21" placement="center" :visible.sync="logVisible" width="800" :footer="false">
|
||
<t-table :pagination="pagination" @page-change="onPageChange" row-key="index" :data="logList" :columns="columns">
|
||
<template #description="slotProps">
|
||
<div class="description-box" v-html="slotProps.row.description"></div>
|
||
</template>
|
||
<template #create_time="slotProps">
|
||
<div>{{formatDate(slotProps.row.create_time)}}</div>
|
||
</template>
|
||
</t-table>
|
||
</t-dialog>
|
||
<!-- 预设回复弹窗 -->
|
||
<t-dialog :header="lang.order_text38" :placement="top" :close-btn="false" :confirm-btn="null" :top="'20%'"
|
||
:visible.sync="replayVisible" width="1300">
|
||
<div class="replay-box">
|
||
<div class="replay-item" @click="usePrePlay(item)" v-for="item in prereplyList" :key="item.id"
|
||
v-html="item.content"></div>
|
||
</div>
|
||
</t-dialog>
|
||
<div>
|
||
<img id="viewer" :src="preImg" alt="">
|
||
</div>
|
||
</com-config>
|
||
</div>
|
||
<!-- =======页面独有======= -->
|
||
<script src="/plugins/addon/idcsmart_ticket/template/admin/js/lang.js"></script>
|
||
|
||
<script src="/plugins/addon/idcsmart_ticket/template/admin/api/order.js"></script>
|
||
<script src="/plugins/addon/idcsmart_ticket/template/admin/js/ticket_detail.js"></script>
|
||
<script src="/tinymce/tinymce.min.js"></script>
|
||
<script src="/plugins/addon/idcsmart_ticket/template/admin/js/common/viewer.min.js"></script>
|
||
<script src="/plugins/addon/idcsmart_ticket/template/admin/js/xss.js"></script>
|
||
<script src="/{$template_catalog}/template/{$themes}/components/comTinymce/comTinymce.js"></script>
|