375 lines
20 KiB
HTML
375 lines
20 KiB
HTML
<link rel="stylesheet" href="/plugins/addon/idcsmart_ticket/template/admin/css/order.css" />
|
|
<!-- =======内容区域======= -->
|
|
|
|
<div id="content" class="template hasCrumb" v-cloak>
|
|
<com-config>
|
|
<!-- crumb -->
|
|
<div class="com-crumb">
|
|
<span>{{lang.user_manage}}</span>
|
|
<t-icon name="chevron-right"></t-icon>
|
|
<a :href="`${baseUrl}/client.htm`" v-permission="'auth_user_list_view'">{{lang.user_list}}</a>
|
|
<t-icon name="chevron-right" v-permission="'auth_user_list_view'"></t-icon>
|
|
<span class="cur">{{lang.auto_order}}</span>
|
|
</div>
|
|
<t-card class="list-card-container">
|
|
<div class="com-h-box">
|
|
<ul class="common-tab">
|
|
<li v-permission="'auth_user_detail_personal_information_view'">
|
|
<a :href="`${baseUrl}/client_detail.htm?id=${id}`">{{lang.personal}}</a>
|
|
</li>
|
|
<li v-permission="'auth_user_detail_host_info_view'">
|
|
<a :href="`${baseUrl}/client_host.htm?id=${id}`">{{lang.product_info}}</a>
|
|
</li>
|
|
<li v-permission="'auth_user_detail_order_view'">
|
|
<a :href="`${baseUrl}/client_order.htm?id=${id}`">{{lang.order_manage}}</a>
|
|
</li>
|
|
<li v-permission="'auth_user_detail_transaction_view'">
|
|
<a :href="`${baseUrl}/client_transaction.htm?id=${id}`">{{lang.flow}}</a>
|
|
</li>
|
|
<li v-permission="'auth_user_detail_operation_log'">
|
|
<a :href="`${baseUrl}/client_log.htm?id=${id}`">{{lang.operation}}{{lang.log}}</a>
|
|
</li>
|
|
<li
|
|
v-if="$checkPermission('auth_user_detail_notification_log_sms_notification') || $checkPermission('auth_user_detail_notification_log_email_notification')">
|
|
<a
|
|
:href="`${baseUrl}/${($checkPermission('auth_user_detail_notification_log_sms_notification') ? 'client_notice_sms' : 'client_notice_email')}.htm?id=${id}`">{{lang.notice_log}}</a>
|
|
</li>
|
|
<li class="active">
|
|
<a>{{lang.auto_order}}</a>
|
|
</li>
|
|
<li v-if="hasRecommend">
|
|
<a
|
|
:href="`${baseUrl}/plugin/idcsmart_recommend/client_recommend.htm?id=${id}`">{{lang.data_export_tip9}}</a>
|
|
</li>
|
|
<li v-permission="'auth_user_detail_info_record_view'">
|
|
<a :href="`${baseUrl}/client_records.htm?id=${id}`">{{lang.info_records}}</a>
|
|
</li>
|
|
</ul>
|
|
<!-- 顶部右侧选择用户 -->
|
|
<com-choose-user :cur-info="clientDetail" @changeuser="changeUser" class="com-clinet-choose">
|
|
</com-choose-user>
|
|
</div>
|
|
<div class="flex mb24" style="justify-content: flex-end; gap: 16px;">
|
|
<t-select v-model="params.host_id" :placeholder="lang.tailorism" clearable @change="getUserOrderList()"
|
|
@clear="getUserOrderList()" style="width: 240px;">
|
|
<t-option v-for="item in hostArr" :value="item.id" :label="item.product_name" :key="item.id"></t-option>
|
|
</t-select>
|
|
</div>
|
|
<t-table class="list-table" :data="userOrderData" :columns="userOrderColumns" @row-click="rowClick" hover
|
|
:loading="userOrderTableloading" row-key="id" size="small">
|
|
<template #id="slotProps">
|
|
<span>{{slotProps.row.id}}</span>
|
|
</template>
|
|
<template #title="slotProps">
|
|
<span class="order-name" @click="userOrderReply(slotProps.row)">{{slotProps.row.newTitle}}</span>
|
|
</template>
|
|
<template #name="slotProps">
|
|
<span>{{slotProps.row.name ? slotProps.row.name : '--'}}</span>
|
|
</template>
|
|
<template #user="slotProps">
|
|
<span @click.stop="goclient_detail(slotProps.row)"><span
|
|
:style="{background: slotProps.row.client_level ? slotProps.row.client_level : '', color: calcColor(slotProps.row.client_level)}"
|
|
class="user-name">{{slotProps.row.username}}</span> {{slotProps.row.admin_name ? ' (' +
|
|
slotProps.row.admin_name + ')' : "--"}}</span>
|
|
</template>
|
|
<template #last_reply_time="slotProps">
|
|
{{ slotProps.row.last_reply_time == 0 ? '--' : formatDate(slotProps.row.last_reply_time) }}
|
|
</template>
|
|
<template #status="slotProps">
|
|
<t-tag :style="{background:slotProps.row.color, color: calcColor(slotProps.row.color)}" variant="light">
|
|
{{slotProps.row.status}}
|
|
</t-tag>
|
|
</template>
|
|
|
|
<template #operation="slotProps">
|
|
<t-button :title="lang.turn_order" shape="circle" variant="text"
|
|
@click.stop="internalOrderForward(slotProps.row)" v-permission="'auth_user_detail_ticket_transfer_ticket'">
|
|
<t-icon name="enter" size="small" style="color:var(--td-brand-color)" />
|
|
</t-button>
|
|
<template v-if="showIdcsmartTicketInternal">
|
|
<t-button v-permission="'auth_plugin_addon_ticket_add'" :title="lang.order_ow_new_rder" shape="circle"
|
|
variant="text" @click.stop="goAddorder(slotProps.row)">
|
|
<t-icon name="file-add" size="small" style="color:var(--td-brand-color)" />
|
|
</t-button>
|
|
</template>
|
|
<t-button :title="lang.order_new_close" shape="circle" variant="text"
|
|
@click.stop="userOrderResolved(slotProps.row)" v-permission="'auth_user_detail_ticket_close_ticket'">
|
|
<t-icon name="close-circle" size="small" style="color:var(--td-brand-color)" />
|
|
</t-button>
|
|
</template>
|
|
</t-table>
|
|
<com-pagination v-if="total" :total="total" :page="params.page" :limit="params.limit" @page-change="changePage">
|
|
</com-pagination>
|
|
</t-card>
|
|
<!-- 转内部弹窗 -->
|
|
<t-dialog :header="lang.order_turn_inside" :footer="false" placement="center" width="600px"
|
|
:visible.sync="turnInsideDialogVisible" destroy-on-close>
|
|
<t-form :data="turnInsideFormData" :rules="turnInsideFormRules" ref="turnInsideForm" label-align="left"
|
|
:label-width="80" @submit="turnInsideFormSubmit">
|
|
<!-- 标题 -->
|
|
<t-form-item :label="lang.order_title" name="title">
|
|
<t-input v-model="turnInsideFormData.title" clearable></t-input>
|
|
</t-form-item>
|
|
<!-- 工单类型 -->
|
|
<t-form-item :label="lang.order_name" name="ticket_type_id">
|
|
<t-select v-model="turnInsideFormData.ticket_type_id" @change="orderTypeChange" clearable filterable
|
|
style="width:100%">
|
|
<t-option v-for="(item, index) in orderTypeOptions" :value="item.id" :label="item.name" :key="index">
|
|
{{ item.name }}
|
|
</t-option>
|
|
</t-select>
|
|
</t-form-item>
|
|
<!-- 紧急程度 -->
|
|
<t-form-item :label="lang.order_priority" name="priority">
|
|
<t-select v-model="turnInsideFormData.priority" clearable filterable style="width:100%">
|
|
<t-option v-for="(item, index) in priorityOptions" :value="item.id" :label="item.name" :key="index">
|
|
{{ item.name }}
|
|
</t-option>
|
|
</t-select>
|
|
</t-form-item>
|
|
<!-- 关联用户-->
|
|
<t-form-item :label="lang.order_client" name="client_id">
|
|
<t-select v-model="turnInsideFormData.client_id" @change="clientChange" clearable filterable
|
|
style="width:100%">
|
|
<t-option v-for="(item, index) in clientOptions" :value="item.id" :label="item.username" :key="index">
|
|
{{ item.username }}
|
|
</t-option>
|
|
</t-select>
|
|
</t-form-item>
|
|
<!-- 关联产品 -->
|
|
<t-form-item :label="lang.order_hosts" name="host_ids">
|
|
<t-select v-model="turnInsideFormData.host_ids" @change="hostChange" clearable multiple style="width:100%">
|
|
<t-option v-for="(item, index) in hostOptions" :value="item.id" :label="item.product_name" :key="index">
|
|
{{ item.product_name }}
|
|
</t-option>
|
|
</t-select>
|
|
</t-form-item>
|
|
<!-- 指定部门 -->
|
|
<t-form-item :label="lang.order_designated_department" name="admin_role_id">
|
|
<t-select v-model="turnInsideFormData.admin_role_id" @change="departmentChange" clearable filterable
|
|
style="width:100%">
|
|
<t-option v-for="(item, index) in departmentOptions" :value="item.id" :label="item.name" :key="index">
|
|
{{ item.name }}
|
|
</t-option>
|
|
</t-select>
|
|
</t-form-item>
|
|
<!-- 指定人员 -->
|
|
<t-form-item :label="lang.order_designated_person" name="admin_id">
|
|
<t-select v-model="turnInsideFormData.admin_id" @change="adminChange" clearable filterable style="width:100%">
|
|
<t-option v-for="(item, index) in adminsOptions" :value="item.id" :label="item.name" :key="index">
|
|
{{ item.name }}
|
|
</t-option>
|
|
</t-select>
|
|
</t-form-item>
|
|
<!-- 问题描述 -->
|
|
<t-form-item :label="lang.order_content" name="content">
|
|
<t-textarea v-model="turnInsideFormData.content"></t-textarea>
|
|
</t-form-item>
|
|
<!-- 上传附件 -->
|
|
<t-form-item class="order-upload-wrapper" :label="lang.order_attachment" name="attachment">
|
|
<t-upload theme="custom" v-model="turnInsideFormData.attachment" :action="uploadUrl" :headers="uploadHeaders"
|
|
:format-response="uploadFormatResponse" show-upload-progress @progress="uploadProgress"
|
|
@success="uploadSuccess" multiple :max="0">
|
|
<t-button theme="default" class="upload-btn">
|
|
<t-icon name="upload" size="small" style="color:#999999"></t-icon>
|
|
<span>{{lang.attachment}}</span>
|
|
</t-button>
|
|
<span>{{uploadTip}}</span>
|
|
</t-upload>
|
|
<div class='list-custom'>
|
|
<span v-for="(item, index) in turnInsideFormData.attachment" :key="index" style="margin:10px">
|
|
{{ item.name }}
|
|
<t-icon name="close-circle-filled" @click="removeAttachment(item, index)"></t-icon>
|
|
</span>
|
|
</div>
|
|
</t-form-item>
|
|
|
|
<t-form-item class="turn-inside-dialog-footer">
|
|
<t-button theme="primary" type="submit" :loading="submitLoading">{{lang.hold}}</t-button>
|
|
<t-button theme="default" type="reset" @click="turnInsideDialogClose">{{lang.cancel}}</t-button>
|
|
</t-form-item>
|
|
</t-form>
|
|
</t-dialog>
|
|
<!-- 工单类型管理弹窗 -->
|
|
<t-dialog :header="lang.order_type_mgt" :footer="false" :visible.sync="orderTypeMgtDialogVisible" width="60%"
|
|
@close="orderTypeMgtClose" :close-btn="false" :close-on-overlay-click="false" :close-on-esc-keydown="false">
|
|
<t-table row-key="id" size="small" :loading="orderTypeMgtTableloading" :data="orderTypeMgtData"
|
|
:columns="orderTypeMgtColumns" bordered>
|
|
<template #index="slotProps">
|
|
{{slotProps.rowIndex+1}}
|
|
</template>
|
|
<template #name="slotProps">
|
|
<t-input v-model="slotProps.row.name" :bordered="false" clearable
|
|
v-if="slotProps.row.status==='edit'||slotProps.row.status==='add'"></t-input>
|
|
<span v-else>{{slotProps.row.name}}</span>
|
|
</template>
|
|
<template #role_name="slotProps">
|
|
<t-select v-if="slotProps.row.status==='edit'||slotProps.row.status==='add'"
|
|
v-model="slotProps.row.admin_role_id" clearable style="width:100%">
|
|
<t-option v-for="(item, index) in departmentOptions" :value="item.id" :label="item.name" :key="index">
|
|
{{ item.name }}
|
|
</t-option>
|
|
</t-select>
|
|
<div v-else>
|
|
<div v-for="(item, index) in departmentOptions" :key="index">
|
|
<span v-if="item.id === slotProps.row.admin_role_id">{{ item.name }}</span>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
<template #operation="slotProps">
|
|
<div v-if="slotProps.row.status==='edit'||slotProps.row.status==='add'">
|
|
<!-- 保存 -->
|
|
<t-button shape="circle" class="icon-save" variant="text"
|
|
@click="orderTypeMgtSave(slotProps.row)"></t-button>
|
|
<!-- 取消 -->
|
|
<t-button shape="circle" variant="text" @click="orderTypeMgtCancel(slotProps.row)">
|
|
<t-icon name="close-rectangle" size="small" style="color:var(--td-brand-color)" />
|
|
</t-button>
|
|
</div>
|
|
<div v-else>
|
|
<!-- 编辑 -->
|
|
<t-button shape="circle" variant="text" @click="orderTypeMgtEdit(slotProps.row)">
|
|
<t-icon name="edit-1" size="small" style="color:var(--td-brand-color)" />
|
|
</t-button>
|
|
<!-- 删除 -->
|
|
<t-button shape="circle" variant="text" @click="orderTypeMgtDelete(slotProps.row)">
|
|
<t-icon name="delete" size="small" style="color:var(--td-brand-color)" />
|
|
</t-button>
|
|
</div>
|
|
</template>
|
|
</t-table>
|
|
<t-button variant="outline" class="order-type-add-btn" @click="newOrderType()">{{lang.order_new}}</t-button>
|
|
<t-button theme="default" class="order-type-close-btn" @click="orderTypeMgtClose()">{{lang.close}}</t-button>
|
|
</t-dialog>
|
|
<!-- 新建工单弹窗 -->
|
|
<t-dialog :header="lang.order_new_rder" :footer="false" placement="center" width="600px"
|
|
:visible.sync="addOrderDialogVisible" destroy-on-close>
|
|
<t-form :data="addOrderFormData" :rules="addOrderFormRules" ref="addOrderForm" label-align="left"
|
|
:label-width="80" @submit="addOrderFormSubmit">
|
|
<!-- 标题 -->
|
|
<t-form-item :label="lang.order_title" name="title">
|
|
<t-input v-model="addOrderFormData.title" clearable></t-input>
|
|
</t-form-item>
|
|
<!-- 工单类型 -->
|
|
<t-form-item :label="lang.order_name" name="ticket_type_id">
|
|
<t-select v-model="addOrderFormData.ticket_type_id" @change="orderTypeChange" clearable filterable
|
|
style="width:100%">
|
|
<t-option v-for="(item, index) in orderTypeOptions" :value="item.id" :label="item.name" :key="index">
|
|
{{ item.name }}
|
|
</t-option>
|
|
</t-select>
|
|
</t-form-item>
|
|
<!-- 紧急程度 -->
|
|
<!-- <t-form-item :label="lang.order_priority" name="priority">
|
|
<t-select v-model="addOrderFormData.priority" clearable filterable style="width:100%">
|
|
<t-option v-for="(item, index) in priorityOptions" :value="item.id" :label="item.name" :key="index">
|
|
{{ item.name }}
|
|
</t-option>
|
|
</t-select>
|
|
</t-form-item> -->
|
|
<!-- 关联用户-->
|
|
<t-form-item :label="lang.order_client" name="client_id">
|
|
<t-select v-model="addOrderFormData.client_id" @change="clientChange" clearable filterable style="width:100%">
|
|
<t-option v-for="(item, index) in clientOptions" :value="item.id" :label="item.username" :key="index">
|
|
{{ item.username }}
|
|
</t-option>
|
|
</t-select>
|
|
</t-form-item>
|
|
<!-- 关联产品 -->
|
|
<t-form-item :label="lang.order_hosts" name="host_ids">
|
|
<t-select v-model="addOrderFormData.host_ids" @change="hostChange" clearable multiple style="width:100%">
|
|
<t-option v-for="(item, index) in hostOptions" :value="item.id" :label="item.product_name" :key="index">
|
|
{{ item.product_name }}
|
|
</t-option>
|
|
</t-select>
|
|
</t-form-item>
|
|
<!-- 指定部门 -->
|
|
<!-- <t-form-item :label="lang.order_designated_department" name="admin_role_id">
|
|
<t-select v-model="addOrderFormData.admin_role_id" @change="departmentChange" clearable filterable style="width:100%">
|
|
<t-option v-for="(item, index) in departmentOptions" :value="item.id" :label="item.name" :key="index">
|
|
{{ item.name }}
|
|
</t-option>
|
|
</t-select>
|
|
</t-form-item> -->
|
|
<!-- 指定人员 -->
|
|
<!-- <t-form-item :label="lang.order_designated_person" name="admin_id">
|
|
<t-select v-model="addOrderFormData.admin_id" @change="adminChange" clearable filterable style="width:100%">
|
|
<t-option v-for="(item, index) in adminsOptions" :value="item.id" :label="item.name" :key="index">
|
|
{{ item.name }}
|
|
</t-option>
|
|
</t-select>
|
|
</t-form-item> -->
|
|
<!-- 问题描述 -->
|
|
<t-form-item :label="lang.order_content" name="content">
|
|
<t-textarea v-model="addOrderFormData.content"></t-textarea>
|
|
</t-form-item>
|
|
<!-- 上传附件 -->
|
|
<t-form-item class="order-upload-wrapper" :label="lang.order_attachment" name="attachment">
|
|
<t-upload theme="custom" v-model="addOrderFormData.attachment" :action="uploadUrl" :headers="uploadHeaders"
|
|
:format-response="uploadFormatResponse" show-upload-progress @progress="uploadProgress"
|
|
@success="uploadSuccess" multiple :max="0">
|
|
<t-button theme="default" class="upload-btn">
|
|
<t-icon name="upload" size="small" style="color:#999999"></t-icon>
|
|
<span>{{lang.attachment}}</span>
|
|
</t-button>
|
|
<span>{{uploadTip}}</span>
|
|
</t-upload>
|
|
<div class='list-custom'>
|
|
<span v-for="(item, index) in addOrderFormData.attachment" :key="index" style="margin:10px">
|
|
{{ item.name }}
|
|
<t-icon name="close-circle-filled" @click="removeAttachment(item, index)"></t-icon>
|
|
</span>
|
|
</div>
|
|
</t-form-item>
|
|
|
|
<t-form-item class="turn-inside-dialog-footer">
|
|
<t-button theme="primary" type="submit" :loading="submitLoading">{{lang.hold}}</t-button>
|
|
<t-button theme="default" type="reset" @click="addOrderDialogClose">{{lang.cancel}}</t-button>
|
|
</t-form-item>
|
|
</t-form>
|
|
</t-dialog>
|
|
<!-- 转发弹窗 -->
|
|
<t-dialog :header="lang.order_forward" :footer="false" :visible.sync="forwardDialogVisible" destroy-on-close>
|
|
<t-form :data="forwardFormData" :rules="forwardFormRules" ref="forwardForm" label-align="left" :label-width="80"
|
|
@submit="forwardFormSubmit">
|
|
<!-- 指定部门 -->
|
|
<!-- <t-form-item :label="lang.order_designated_department" name="admin_role_id">
|
|
<t-select v-model="forwardFormData.admin_role_id" @change="departmentChange" clearable filterable style="width:100%">
|
|
<t-option v-for="(item, index) in departmentOptions" :value="item.id" :label="item.name" :key="index">
|
|
{{ item.name }}
|
|
</t-option>
|
|
</t-select>
|
|
</t-form-item> -->
|
|
<!-- 工单部门 -->
|
|
<t-form-item :label="lang.order_designated_department" name="ticket_type_id">
|
|
<t-select clearable v-model="forwardFormData.ticket_type_id" :keys="{ label: 'name', value: 'id' }"
|
|
:options="orderTypeOptions" @change="changeType"></t-select>
|
|
</t-form-item>
|
|
<!-- 指定人员 -->
|
|
<t-form-item :label="lang.order_designated_person" name="admin_id">
|
|
<t-select v-model="forwardFormData.admin_id" @change="adminChange" clearable filterable style="width:100%">
|
|
<t-option v-for="(item, index) in adminsOptions" :value="item.id" :label="item.name" :key="index">
|
|
{{ item.name }}
|
|
</t-option>
|
|
</t-select>
|
|
</t-form-item>
|
|
<!-- 备注 -->
|
|
<t-form-item :label="lang.order_designated_reson" name="notes">
|
|
<t-textarea v-model="forwardFormData.notes"></t-textarea>
|
|
</t-form-item>
|
|
|
|
<t-form-item class="turn-inside-dialog-footer">
|
|
<t-button theme="primary" type="submit" :loading="submitLoading">{{lang.hold}}</t-button>
|
|
<t-button theme="default" type="reset" @click="forwardDialogClose">{{lang.cancel}}</t-button>
|
|
</t-form-item>
|
|
</t-form>
|
|
</t-dialog>
|
|
<audio id="audio_tip" muted src="/plugins/addon/idcsmart_ticket/template/admin/media/tip.wav"></audio>
|
|
</com-config>
|
|
</div>
|
|
<script src="/{$template_catalog}/template/{$themes}/components/comChooseUser/comChooseUser.js"></script>
|
|
<script src="/plugins/addon/idcsmart_ticket/template/admin/js/lang.js"></script>
|
|
<script src="/plugins/addon/idcsmart_ticket/template/admin/api/client.js"></script>
|
|
<script src="/plugins/addon/idcsmart_ticket/template/admin/api/order.js"></script>
|
|
<script src="/plugins/addon/idcsmart_ticket/template/admin/js/client_ticket.js"></script>
|