From 3a6c66847607e5266738dc9636c83a6a9c576ce3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=99=BD=E8=8F=9C?=
 <43331987+JiaLiBai@users.noreply.github.com>
Date: Mon, 30 Jun 2025 18:39:41 +0800
Subject: [PATCH] =?UTF-8?q?=E5=B7=A5=E5=8D=95=E7=AE=A1=E7=90=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/ems/ticket/index.vue | 437 ++++++++++-----------------------
 1 file changed, 131 insertions(+), 306 deletions(-)

diff --git a/src/views/ems/ticket/index.vue b/src/views/ems/ticket/index.vue
index 9466105..0441a52 100644
--- a/src/views/ems/ticket/index.vue
+++ b/src/views/ems/ticket/index.vue
@@ -1,333 +1,158 @@
 <template>
-  <div class="app-container">
-    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
-      <el-form-item label="工单号" prop="ticketNo">
-        <el-input
-          v-model="queryParams.ticketNo"
-          placeholder="请输入工单号"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="工单标题" prop="title">
-        <el-input
-          v-model="queryParams.title"
-          placeholder="请输入工单标题"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="完成时间" prop="completeTime">
-        <el-date-picker clearable
-          v-model="queryParams.completeTime"
-          type="date"
-          value-format="yyyy-MM-dd"
-          placeholder="请选择完成时间">
-        </el-date-picker>
-      </el-form-item>
-      <el-form-item label="处理人ID" prop="workUserId">
-        <el-input
-          v-model="queryParams.workUserId"
-          placeholder="请输入处理人ID"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item>
-        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
-        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
-      </el-form-item>
-    </el-form>
-
-    <el-row :gutter="10" class="mb8">
-      <el-col :span="1.5">
-        <el-button
-          type="primary"
-          plain
-          icon="el-icon-plus"
-          size="mini"
-          @click="handleAdd"
-          v-hasPermi="['system:ticket:add']"
-        >新增</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="success"
-          plain
-          icon="el-icon-edit"
-          size="mini"
-          :disabled="single"
-          @click="handleUpdate"
-          v-hasPermi="['system:ticket:edit']"
-        >修改</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="danger"
-          plain
-          icon="el-icon-delete"
-          size="mini"
-          :disabled="multiple"
-          @click="handleDelete"
-          v-hasPermi="['system:ticket:remove']"
-        >删除</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="warning"
-          plain
-          icon="el-icon-download"
-          size="mini"
-          @click="handleExport"
-          v-hasPermi="['system:ticket:export']"
-        >导出</el-button>
-      </el-col>
-      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
-    </el-row>
-
-    <el-table v-loading="loading" :data="ticketList" @selection-change="handleSelectionChange">
-      <el-table-column type="selection" width="55" align="center" />
-      <el-table-column label="${comment}" align="center" prop="id" />
-      <el-table-column label="工单号" align="center" prop="ticketNo" />
-      <el-table-column label="提交用户ID" align="center" prop="userId" />
-      <el-table-column label="工单标题" align="center" prop="title" />
-      <el-table-column label="问题描述" align="center" prop="content" />
-      <el-table-column label="图片URL数组" align="center" prop="images" />
-      <el-table-column label="1待处理 2处理中 3已完成" align="center" prop="status" />
-      <el-table-column label="完成时间" align="center" prop="completeTime" width="180">
-        <template slot-scope="scope">
-          <span>{{ parseTime(scope.row.completeTime, '{y}-{m}-{d}') }}</span>
-        </template>
+  <div class="ems-dashboard-editor-container" style="background-color: #ffffff" v-loading="loading">
+    <el-button type="primary" @click="addTicket" native-type="button">新增</el-button>
+    <el-table
+      class="common-table"
+      :data="tableData"
+      stripe
+      max-height="500px"
+      style="width: 100%;margin-top: 25px">
+      <el-table-column
+        prop="gdh"
+        label="工单号">
       </el-table-column>
-      <el-table-column label="处理人ID" align="center" prop="workUserId" />
-      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+      <el-table-column
+        prop="title"
+        label="工单标题"
+      >
+      </el-table-column>
+      <el-table-column
+        prop="question"
+        min-width="300"
+        show-overflow-tooltip
+        label="问题描述">
+      </el-table-column>
+      <el-table-column
+        prop="handleStatus"
+        label="处理状态">
+      </el-table-column>
+      <el-table-column
+        prop="submitName"
+        label="提交人">
+      </el-table-column>
+      <el-table-column
+        prop="handleName"
+        label="处理人">
+      </el-table-column>
+      <el-table-column
+        prop="submitTime"
+        label="提交时间">
+      </el-table-column>
+      <el-table-column
+        fixed="right"
+        label="操作"
+        width="150">
         <template slot-scope="scope">
           <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-edit"
-            @click="handleUpdate(scope.row)"
-            v-hasPermi="['system:ticket:edit']"
-          >修改</el-button>
+            @click="editTicket(scope.row.gdh)"
+            type="warning"
+            size="mini">
+            编辑
+          </el-button>
           <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-delete"
-            @click="handleDelete(scope.row)"
-            v-hasPermi="['system:ticket:remove']"
-          >删除</el-button>
+            @click="deleteTicket(scope.row)"
+            type="danger"
+            size="small">
+            废弃
+          </el-button>
         </template>
       </el-table-column>
     </el-table>
-
-    <pagination
-      v-show="total>0"
-      :total="total"
-      :page.sync="queryParams.pageNum"
-      :limit.sync="queryParams.pageSize"
-      @pagination="getList"
-    />
-
-    <!-- 添加或修改工单主对话框 -->
-    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
-      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
-        <el-form-item label="工单号" prop="ticketNo">
-          <el-input v-model="form.ticketNo" placeholder="请输入工单号" />
-        </el-form-item>
-        <el-form-item label="工单标题" prop="title">
-          <el-input v-model="form.title" placeholder="请输入工单标题" />
-        </el-form-item>
-        <el-form-item label="问题描述">
-          <editor v-model="form.content" :min-height="192"/>
-        </el-form-item>
-        <el-form-item label="完成时间" prop="completeTime">
-          <el-date-picker clearable
-            v-model="form.completeTime"
-            type="date"
-            value-format="yyyy-MM-dd"
-            placeholder="请选择完成时间">
-          </el-date-picker>
-        </el-form-item>
-        <el-form-item label="处理人ID" prop="workUserId">
-          <el-input v-model="form.workUserId" placeholder="请输入处理人ID" />
-        </el-form-item>
-      </el-form>
-      <div slot="footer" class="dialog-footer">
-        <el-button type="primary" @click="submitForm">确 定</el-button>
-        <el-button @click="cancel">取 消</el-button>
-      </div>
-    </el-dialog>
+    <add-ticket ref="addTicket" :mode="mode"/>
   </div>
 </template>
 
 <script>
-import { listTicket, getTicket, delTicket, addTicket, updateTicket } from "@/api/ems/ticket"
-
+// import {getSingleSiteBaseInfo} from '@/api/ems/zddt'
+import AddTicket from './AddTicket.vue'
 export default {
   name: "Ticket",
+  components: {AddTicket},
   data() {
     return {
-      // 遮罩层
-      loading: true,
-      // 选中数组
-      ids: [],
-      // 非单个禁用
-      single: true,
-      // 非多个禁用
-      multiple: true,
-      // 显示搜索条件
-      showSearch: true,
-      // 总条数
-      total: 0,
-      // 工单主表格数据
-      ticketList: [],
-      // 弹出层标题
-      title: "",
-      // 是否显示弹出层
-      open: false,
-      // 查询参数
-      queryParams: {
-        pageNum: 1,
-        pageSize: 10,
-        ticketNo: null,
-        userId: null,
-        title: null,
-        content: null,
-        images: null,
-        status: null,
-        completeTime: null,
-        workUserId: null
-      },
-      // 表单参数
-      form: {},
-      // 表单校验
-      rules: {
-        ticketNo: [
-          { required: true, message: "工单号不能为空", trigger: "blur" }
-        ],
-        userId: [
-          { required: true, message: "提交用户ID不能为空", trigger: "blur" }
-        ],
-        title: [
-          { required: true, message: "工单标题不能为空", trigger: "blur" }
-        ],
-        content: [
-          { required: true, message: "问题描述不能为空", trigger: "blur" }
-        ],
-        status: [
-          { required: true, message: "1待处理 2处理中 3已完成不能为空", trigger: "change" }
-        ],
-        createTime: [
-          { required: true, message: "创建时间不能为空", trigger: "blur" }
-        ],
-      }
+      mode:'',//新增、修改工单
+      editTicketId:'',
+      loading:false,
+      tableData:[
+        {gdh:'0001',title:'工单一',question:'问题描述问题描述问题描述问题描述问题描述问题描述问题描述问题描述问题描述问题描述问题描述问题描述问题描述',handleStatus:'处理完成',submitName:'张三',handleName:'李四',submitTime:'2025/06/20'}
+      ]
     }
   },
-  created() {
-    this.getList()
-  },
-  methods: {
-    /** 查询工单主列表 */
-    getList() {
-      this.loading = true
-      listTicket(this.queryParams).then(response => {
-        this.ticketList = response.rows
-        this.total = response.total
-        this.loading = false
-      })
+  methods:{
+    addTicket(){
+      this.mode = 'add';
+      this.$refs.addTicket.dialogTableVisible = true;
     },
-    // 取消按钮
-    cancel() {
-      this.open = false
-      this.reset()
+    editTicket(id){
+      this.mode = 'add';
+      this.editTicketId = id
+      this.$refs.addTicket.dialogTableVisible = true;
     },
-    // 表单重置
-    reset() {
-      this.form = {
-        id: null,
-        ticketNo: null,
-        userId: null,
-        title: null,
-        content: null,
-        images: null,
-        status: null,
-        createTime: null,
-        completeTime: null,
-        createBy: null,
-        updateBy: null,
-        updateTime: null,
-        workUserId: null
-      }
-      this.resetForm("form")
-    },
-    /** 搜索按钮操作 */
-    handleQuery() {
-      this.queryParams.pageNum = 1
-      this.getList()
-    },
-    /** 重置按钮操作 */
-    resetQuery() {
-      this.resetForm("queryForm")
-      this.handleQuery()
-    },
-    // 多选框选中数据
-    handleSelectionChange(selection) {
-      this.ids = selection.map(item => item.id)
-      this.single = selection.length!==1
-      this.multiple = !selection.length
-    },
-    /** 新增按钮操作 */
-    handleAdd() {
-      this.reset()
-      this.open = true
-      this.title = "添加工单主"
-    },
-    /** 修改按钮操作 */
-    handleUpdate(row) {
-      this.reset()
-      const id = row.id || this.ids
-      getTicket(id).then(response => {
-        this.form = response.data
-        this.open = true
-        this.title = "修改工单主"
-      })
-    },
-    /** 提交按钮 */
-    submitForm() {
-      this.$refs["form"].validate(valid => {
-        if (valid) {
-          if (this.form.id != null) {
-            updateTicket(this.form).then(response => {
-              this.$modal.msgSuccess("修改成功")
-              this.open = false
-              this.getList()
-            })
+    deleteTicket(row){
+      console.log('表格行数据',row)
+      this.$confirm(`确认要废弃工单${row.title}吗?`, {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        showClose:false,
+        closeOnClickModal:false,
+        type: 'warning',
+        beforeClose: (action, instance, done) => {
+          if (action === 'confirm') {
+            instance.confirmButtonLoading = true;
+            setTimeout(() => {
+              // todo 调用接口如果关机成功 调用done方法 否则不关闭弹窗
+              done();
+              // setTimeout(() => {
+              instance.confirmButtonLoading = false;
+              // }, 300);
+            }, 3000);
           } else {
-            addTicket(this.form).then(response => {
-              this.$modal.msgSuccess("新增成功")
-              this.open = false
-              this.getList()
-            })
+            done();
           }
         }
-      })
-    },
-    /** 删除按钮操作 */
-    handleDelete(row) {
-      const ids = row.id || this.ids
-      this.$modal.confirm('是否确认删除工单主编号为"' + ids + '"的数据项？').then(function() {
-        return delTicket(ids)
       }).then(() => {
-        this.getList()
-        this.$modal.msgSuccess("删除成功")
-      }).catch(() => {})
-    },
-    /** 导出按钮操作 */
-    handleExport() {
-      this.download('ticket/export', {
-        ...this.queryParams
-      }, `ticket_${new Date().getTime()}.xlsx`)
+        //只有在废弃成功的情况下会走到这里
+        this.$message({
+          type: 'success',
+          message: '废弃成功!'
+        });
+        //调用接口 更新表格数据
+      }).catch(() => {
+        //取消关机
+      });
+    }
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.ems-content-container{
+  display: flex;
+  padding:24px;
+  padding-right: 0;
+  .map-container{
+    flex:auto;
+  }
+  .zd-msg-container{
+    width: 500px;
+    padding: 24px;
+    .single-zd-name{
+      font-weight: 500;
+      line-height: 23px;
+      color: #FFBD00;
+      font-size: 16px;
+      margin-bottom: 24px;
+    }
+    .single-square-box-container{
+      height: 78px;
+      box-sizing: border-box;
+      margin-bottom: 10px;
+    }
+    .single-zd-info-container{
+      font-size: 12px;
+      margin-top: 10px;
+      color:#666666;
     }
   }
 }
-</script>
+</style>