pref: 修改工单详情

public/theme/element-extra.css

@@ -448,3 +448,7 @@ td .el-button.el-button--mini {
   color: $--color-text-primary;
   cursor: not-allowed;
 }
+
+.el-step__description.is-finish {
+  color: #676a6c;
+}

src/i18n/langs/en.json

@@ -1169,7 +1169,7 @@
     "OpenTicket": "Open Ticket",
     "HandleTicket": "Handle Ticket",
     "FinishedTicket": "Finished Ticket",
-    "CheckViewAcceptor": "Click to view the acceptor",
+    "CheckViewAcceptor": "View more acceptor",
     "Assignees": "Assignees",
     "Close": "Close",
     "OpenStatus": "Open",

src/i18n/langs/ja.json

@@ -1220,7 +1220,7 @@
     "OpenTicket": "ワークオーダーの作成",
     "HandleTicket": "作業指示の処理",
     "FinishedTicket": "ワークオーダーの完了",
-    "CheckViewAcceptor": "クリックして受付人を表示",
+    "CheckViewAcceptor": "もっとみる見る",
     "IP": "IP",
     "Hostname": "ホスト名",
     "Asset": "資産",

src/views/tickets/RequestAssetPerm/Detail/TicketDetail.vue

@@ -121,7 +121,7 @@ export default {
         },
         {
           key: this.$tc('tickets.type'),
-          value: 'abc'
+          value: object.type.label
         },
         {
           key: this.$tc('tickets.user'),
@@ -146,27 +146,27 @@ export default {
       return [
         {
           key: this.$tc('perms.Node'),
-          value: object.apply_nodes.join(', ')
+          value: object.apply_nodes.map(item => item.value).join(', ')
         },
         {
           key: this.$tc('tickets.Asset'),
-          value: object.apply_assets.join(', ')
+          value: object.apply_assets.map(item => item.name).join(', ')
         },
         {
-          key: this.$tc('tickets.Account'),
-          value: object.apply_accounts
+          key: this.$tc('assets.Accounts'),
+          value: object.apply_accounts.join(', ')
         },
         {
           key: this.$tc('assets.Action'),
-          value: object.apply_actions
+          value: object.apply_actions.map(item => item.label).join(', ')
         },
         {
           key: this.$tc('common.DateStart'),
-          value: toSafeLocalDateStr(object.apply_date_start)
+          value: object.apply_date_start
         },
         {
           key: this.$tc('common.dateExpired'),
-          value: toSafeLocalDateStr(object.apply_date_expired)
+          value: object.apply_date_expired
         }
       ]
     },
@@ -189,27 +189,27 @@ export default {
         },
         {
           key: this.$tc('perms.Node'),
-          value: rel_snapshot.apply_nodes.join(', ')
+          value: rel_snapshot.apply_nodes.map(item => item.value).join(', ')
         },
         {
           key: this.$tc('assets.Asset'),
-          value: rel_snapshot.apply_assets.join(', ')
+          value: rel_snapshot.apply_assets.map(item => item.name).join(', ')
         },
         {
-          key: this.$tc('tickets.Account'),
-          value: rel_snapshot.apply_accounts
+          key: this.$tc('perms.Accounts'),
+          value: (rel_snapshot.apply_accounts || []).join(', ')
         },
         {
           key: this.$tc('assets.Action'),
-          value: object.apply_actions
+          value: object.apply_actions.map(item => item.label).join(', ')
         },
         {
           key: this.$tc('common.DateStart'),
-          value: toSafeLocalDateStr(object.apply_date_start)
+          value: object.apply_date_start
         },
         {
           key: this.$tc('common.dateExpired'),
-          value: toSafeLocalDateStr(object.apply_date_expired)
+          value: object.apply_date_expired
         }
       ]
     },

src/views/tickets/components/Steps.vue

@@ -3,10 +3,10 @@
     <div style="height: 540px;">
       <el-steps direction="vertical" :active="ticketSteps">
         <el-step
-          :title="`${this.$t('tickets.OpenTicket')}：${object.type_display}`"
+          :title="`${this.$t('tickets.OpenTicket')}：${object.title}`"
           :description="`${this.$t('tickets.Applicant')}：${object.rel_snapshot.applicant}`"
         >
-          <div slot="description">
+          <div slot="description" class="description">
             <div>{{ `${this.$t('tickets.Applicant')}：${object.rel_snapshot.applicant}` }}</div>
             <div>{{ `${this.$t('common.DateCreated')}:  ${toSafeLocalDateStr(object.date_created)}` }}</div>
           </div>
@@ -14,29 +14,31 @@
         <el-step
           v-for="(item, i) in process"
           :key="i"
-          :title="`${thisCopy.$t('tickets.HandleTicket')}`"
+          :title="$tc('tickets.HandleTicket')"
         >
           <div slot="description">
-            <el-tag size="medium" :type="`${thisCopy.statusMap[item.state].type}`"> {{ `${thisCopy.statusMap[item.state].title}` }} </el-tag>
-          </div>
-          <div slot="description">
-            <el-button type="text" @click="lookOver(item.assignees_display)">
-              {{ $t('tickets.CheckViewAcceptor') }}
+            <div style="padding-top: 15px">
+              <span v-for="assignee of item.assignees_display" :key="assignee" style="display: block">
+                {{ assignee }}
+              </span>
+            </div>
+            <el-button v-if="item.assignees_display.length > 5" type="text" @click="lookOver(item.assignees_display)">
+              {{ $tc('tickets.CheckViewAcceptor') }}
             </el-button>
           </div>
-          <div v-if="item.state==='closed'" slot="description">
-            <div>{{ `${thisCopy.$t('tickets.Assignee')}：${object.rel_snapshot.applicant}` }}</div>
-            <div>{{ `${thisCopy.$t('common.dateFinished')}:  ${toSafeLocalDateStr(item.approval_date)}` }}</div>
+          <div v-if="item.state.value ==='closed'" slot="description">
+            <div>{{ $t('tickets.Assignee') }}：{{ object.rel_snapshot.applicant }}</div>
+            <div>{{ $t('common.dateFinished') }}:  {{ toSafeLocalDateStr(item.approval_date) }}</div>
           </div>
-          <div v-if="item.state!=='pending' && item.state!=='closed'" slot="description">
-            <div>{{ `${thisCopy.$t('tickets.Assignee')}：${item.processor_display}` }}</div>
-            <div>{{ `${thisCopy.$t('common.dateFinished')}:  ${toSafeLocalDateStr(item.approval_date)}` }}</div>
+          <div v-if="item.state.value !=='pending' && item.state.value !=='closed'" slot="description">
+            <div> {{ $t('tickets.Assignee') }}：{{ item.processor_display }}</div>
+            <div>{{ $t('common.dateFinished') }}: {{ toSafeLocalDateStr(item.approval_date) }}</div>
           </div>
         </el-step>
         <el-step
           :title="`${this.$t('tickets.FinishedTicket')}`"
         >
-          <div v-if="thisCopy.isFinish" slot="description">
+          <div v-if="isFinish" slot="description">
             <div>{{ `${this.$t('common.dateFinished')}:  ${toSafeLocalDateStr(object.date_updated)}` }}</div>
           </div>
         </el-step>
@@ -50,6 +52,7 @@ import { formatTime, getDateTimeStamp } from '@/utils/index'
 import { toSafeLocalDateStr } from '@/utils/common'
 import IBox from '@/components/IBox'
 import { STATE_MAP } from '../const'
+
 export default {
   name: 'Steps',
   components: { IBox },
@@ -63,20 +66,19 @@ export default {
     return {
       STATUS: { open: 2, close: 3 },
       process: this.object.process_map,
-      thisCopy: this,
+      vm: this,
       statusMap: STATE_MAP,
       isFinish: false
     }
   },
   computed: {
     ticketSteps() {
-      // eslint-disable-next-line no-unused-vars
-      var countApprove = 0
+      let countApprove = 0
       // eslint-disable-next-line vue/no-side-effects-in-computed-properties
       this.process.sort((a, b) => a.approval_level - b.approval_level)
       this.process.forEach(item => {
         // eslint-disable-next-line space-before-blocks
-        if (item.state === 'approved'){
+        if (item.state === 'approved') {
           countApprove += 1
         }
       })