StepsRun.vue 1.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455
  1. <template>
  2. <div class="min-w-60">
  3. <div class="steps-content">
  4. <!-- <div class="mb-2">
  5. <div class="text-x" v-for="step,i in props.steps" :key="step.id">
  6. {{ `步骤${i + 1}:` + step.description }}
  7. </div> -->
  8. <!-- </div> -->
  9. <div >
  10. <div class=" font-semibold">
  11. 执行
  12. </div>
  13. <div class="break-all mb-0.5" v-for="action,index in props.content" :key="index">
  14. {{ actionMap[action.action]?.text && actionMap[action.action].text + ':'+ action[actionMap[action.action].valueKey]}}
  15. </div>
  16. </div>
  17. <div v-if="props.finish">{{props.finish === '1' ? '执行完成' : '执行出错'}}</div>
  18. <el-progress v-else :show-text="false" class="w-full !h-0.5 overflow-hidden" :percentage="100"
  19. :indeterminate="true"
  20. :duration="2"/>
  21. </div>
  22. </div>
  23. </template>
  24. <script lang="js" setup>
  25. import { onMounted } from 'vue'
  26. import { actionMap } from '@/utils/actionMap'
  27. onMounted(() => {
  28. chrome.runtime.onMessage.addListener(async (request, sender, sendResponse) => {
  29. })
  30. })
  31. const props = defineProps({
  32. content: {
  33. type:Array,
  34. required: true
  35. },
  36. finish: {
  37. type: String,
  38. request:true
  39. },
  40. steps: {
  41. type:Array,
  42. required: true
  43. },
  44. title: {
  45. type: String,
  46. request:true
  47. }
  48. })
  49. </script>
  50. <style scoped>
  51. </style>