拉代码

haoxuan

2023-11-02 5c6875454a126cd2a68bcbd2b63ed4902224487b

拉代码

 src/api/craftModel.ts

New file
@@ -0,0 +1,19 @@
export interface ParamsMap {
  [keyProp: string]: string
}

export interface CraftModel {
  ID: number
  CreatedAt: string
  UpdatedAt: string
  DeletedAt: string
  number: string
  product: string
  procedure: string
  Params: string
  paramsMap: ParamsMap
  deviceId: string
  isUpdate: boolean
  newParamsMap: string
  newNumber: string
}

 src/api/index.ts

@@ -2,6 +2,7 @@
import type { CraftParamsResponse, TasksGroupByChannel } from './task'
import type { PLCResponse } from './plc'
import type { Devices } from './device'
import type { CraftModel } from './craftModel'

export interface BaseResponse<T = any> {
  code: number
@@ -105,3 +106,38 @@
    method: 'get'
  })
}

export interface CraftModelListParams {
  procedureId: number
  page: number
  pageSize: number
  number: string
}

/**
 * 获取工艺模型列表
 * @param params
 */
export function apiGetCraftModelList(params: CraftModelListParams) {
  return request<BaseResponse<CraftModel[]>>({
    url: '/v1/processModel/list',
    method: 'get',
    params
  })
}

export interface UpdateCraftPrams {
  procedureId: number
}

/**
 * 更新工艺模型
 * @param params
 */
export function updateCraftParams(params: UpdateCraftPrams) {
  return request<BaseResponse>({
    url: '/v1/task/updateProcessParams',
    method: 'post',
    data: params
  })
}

 src/api/task.ts

@@ -105,6 +105,6 @@
}

export interface CraftParamsResponse {
  number: string
  Number: string
  Params: CraftParam[]
}

 src/stores/craftModel.ts

New file
@@ -0,0 +1,24 @@
import { ref, computed } from 'vue'
import { defineStore } from 'pinia'
import type { CraftModel } from '@/api/craftModel'
import { apiGetCraftModelList } from '@/api'
import { useTasksStore } from '@/stores/tasks'

export const useCraftModelStore = defineStore('craftModel', () => {
  const craftModelList = ref<CraftModel[]>()
  const taskStore = useTasksStore()
  function getCraftModelList() {
    if (taskStore.activeTask?.Procedure.ID) {
      apiGetCraftModelList({
        procedureId: taskStore.activeTask?.Procedure.ID,
        page: 1,
        pageSize: 999,
        number: taskStore.activeTask?.Procedure?.processModelNumber
      }).then((res) => {
        craftModelList.value = res.data ?? []
      })
    }
  }

  return { craftModelList, getCraftModelList }
})

 src/stores/tasks.ts

@@ -123,22 +123,6 @@
    activeTask.value = task
  }

  const requestParamsMap = ref<{
    [channel: number]: TaskListParams
  }>({})
  function getParamsByChannel(channel: number) {
    return (
      requestParamsMap.value[channel] ?? {
        type: 1,
        offset: 0,
        limit: 3
      }
    )
  }

  function setParamsByChannel(channel: number, params: TaskListParams) {
    requestParamsMap.value[channel] = params
  }
  return {
    channels,
    getChannels,
@@ -146,9 +130,6 @@
    activeTask,
    reload,
    setActiveTask,
    requestParamsMap,
    getParamsByChannel,
    setParamsByChannel,
    moreChannelTasksBtn,
    foldChannelTasksBtn
  }

 src/views/dashboard/components/ColorInfo.vue

@@ -1,26 +1,33 @@
<template>
  <div class="color-info">
    <div v-if="type == 1" class="color-one">
      加工数({{ order.unit }})
      <span>{{ order.finishNumber || 0 }}</span>
      加工数({{ activeTask?.Order?.unit ?? '--' }})
      <span>{{ plcInfo?.finishNumber ?? 0 }}</span>
    </div>
    <div v-else class="color-two">
      目标({{ order.unit }})
      <span> {{ order.amount || 0 }}</span>
      目标({{ activeTask?.Order?.unit ?? '--' }})
      <span> {{ plcInfo?.totalNumber ?? 0 }}</span>
    </div>
  </div>
</template>
<script setup lang="ts">
import { toRefs } from 'vue'
import type { Order } from '@/api/task'
import { usePLCStore } from '@/stores/plc'
import { storeToRefs } from 'pinia'
import { useTasksStore } from '@/stores/tasks'

export interface ColorInfoProps {
  order: Order
  type?: Number
  /** 1加工数 2目标数*/
  type?: 1 | 2
}

const props = defineProps<ColorInfoProps>()
const { order, type } = toRefs(props)
const { type } = toRefs(props)

const plcStore = usePLCStore()
const { plcInfo } = storeToRefs(plcStore)
const taskStore = useTasksStore()
const { activeTask } = storeToRefs(taskStore)
</script>

<style scoped lang="scss">

 src/views/dashboard/components/CraftDetailModal.vue

New file
@@ -0,0 +1,35 @@
<template>
  <div class="craft-detail-modal">
    <BaseModal v-model="modelData" :wider="true" @close="closeModal">
      <template #title>工艺详情 </template>
      <div class="modal-content">
        <el-scrollbar always class="scroller">
          <div class="trouble"></div>
        </el-scrollbar>
      </div>
    </BaseModal>
  </div>
</template>
<script setup lang="ts">
import { useVModel } from '@vueuse/core'

export interface CraftDetailModalProps {
  modelValue: boolean
}
const props = withDefaults(defineProps<CraftDetailModalProps>(), {
  modelValue: false
})
const emit = defineEmits<{
  'update:modelValue': [show: boolean]
  close: []
}>()
const modelData = useVModel(props, 'modelValue', emit)

function closeModal() {
  emit('close')
}

//TODO: 工艺详情弹窗
</script>

<style scoped lang="scss"></style>

 src/views/dashboard/components/DashboardTitle.vue

@@ -1,6 +1,6 @@
<template>
  <div class="dashboard-title">
    <div class="title-text">智能工作台 — {{ deviceStore?.devices?.currentDeviceID ?? '' }}</div>
    <div class="title-text">智能工作台 — {{ deviceStore?.deviceInfo?.currentDeviceID ?? '' }}</div>
    <div class="title-status">
      <div class="connection-info" @click="openSelectDeviceModal">
        <el-icon size="30" color="red">

 src/views/dashboard/components/ProcessInfo.vue

@@ -3,26 +3,39 @@
    <div class="item-l-bng">
      <img src="~@/assets/images/process-model.png" />
    </div>
    <div class="item-r">
      <div class="item-r-t font_weight">{{ process.number }}</div>
      <div class="item-r-b">{{ process.product }}</div>
      <div class="item-r-b">{{ process.procedure }}</div>
    <div class="item-r" @click="onDetailClick">
      <div class="item-r-t font_weight">{{ craftModel.number }}</div>
      <div class="item-r-b">产品: {{ craftModel.product }}</div>
      <div class="item-r-b">工艺: {{ craftModel.procedure }}</div>
    </div>
    <div v-if="process.isUpdate" class="tip-r">
    <div v-if="craftModel.isUpdate" class="tip-r">
      <img src="~@/assets/images/process-tip.png" />
    </div>
    <div v-if="process.isUpdate" class="tip-current">当前使用</div>
    <div v-if="craftModel.isUpdate" class="tip-current">当前使用</div>
    <div class="btn">
      <el-button type="primary" class="color_organge"> 更新工艺 </el-button>
      <el-button type="primary" class="color_organge" @click="onUpdateClick"> 更新工艺 </el-button>
    </div>
  </div>
</template>
<script setup lang="ts">
import { toRefs } from 'vue'
import type { CraftModel } from '@/api/craftModel'
const props = defineProps<{
  process: { product: '产品名称'; number: '111'; procedure: '工艺名称'; isUpdate: true }
  craftModel: CraftModel
}>()
const { process } = toRefs(props)
const { craftModel } = toRefs(props)

const emit = defineEmits<{
  update: [craftModel: CraftModel]
  detail: [craftModel: CraftModel]
}>()

function onDetailClick() {
  emit('detail', craftModel)
}
function onUpdateClick() {
  emit('update', craftModel)
}
</script>

<style scoped lang="scss">

 src/views/dashboard/components/TaskControlModal.vue

File was deleted

 src/views/dashboard/index.vue

File was deleted