feat:创建新分支

charles

2024-04-29 b95cf940af8e01e4eca30b2599b029c2f645bd1e

 src/views/dashboard/components/CraftDetailModal.vue

@@ -2,18 +2,18 @@
  <div class="craft-detail-modal">
    <BaseModal v-model="modelData" :wider="true" @close="closeModal">
      <template #title>工艺详情 </template>
      <div class="modal-content">
      <div v-if="craftModel" class="modal-content">
        <el-scrollbar always class="scroller">
          <div :class="processObj.isUpdate ? 'modal-t margin_bottom_20' : 'modal-t  modal-t-two'">
          <div :class="craftModel?.isUpdate ? 'modal-t margin_bottom_20' : 'modal-t  modal-t-two'">
            <div class="modal-t-l">
              <div class="modal-t-l-t">{{ processObj.procedure }}</div>
              <div class="modal-t-l-t">{{ craftModel?.procedure }}</div>
              <div class="modal-t-l-b">
                <span v-for="(item, index) in processObj.paramsMap" :key="index"> {{ index }} : {{ item }}； </span>
                <span v-for="(item, index) in craftModel?.paramsMap" :key="index"> {{ index }} : {{ item }}； </span>
              </div>
            </div>
            <div class="modal-t-r">工艺编号：{{ processObj.number }}</div>
            <div class="modal-t-r">工艺编号：{{ craftModel?.number }}</div>
          </div>
          <div v-if="processObj.isUpdate" class="modal-b">
          <div v-if="craftModel?.isUpdate" class="modal-b">
            <div class="modal-b-t">更新设置</div>
            <template v-if="isUpdate == 1">
              <div class="modal-b-m">
@@ -23,25 +23,25 @@
                  </el-icon>
                </div>
                <div class="modal-b-m-r">
                  <span>已检查到新版本：{{ processObj.newNumber }}</span>
                  <span>已检查到新版本：{{ craftModel?.newNumber }}</span>
                  <BigButton class="btn" bg-color="#4343f5" @click="updateProcess">更新工艺</BigButton>
                </div>
              </div>
              <div class="modal-b-b">
                <div class="modal-b-b-l">
                  <div class="modal-b-b-l-t">{{ processObj.procedure }}</div>
                  <div class="modal-b-b-l-t">{{ craftModel?.procedure }}</div>
                  <div class="modal-b-b-l-b">
                    <span v-for="(item, index) in processObj.newParamsMap" :key="index">
                    <span v-for="(item, index) in craftModel?.newParamsMap" :key="index">
                      {{ index }} : {{ item }}；
                    </span>
                  </div>
                </div>
                <div class="modal-b-b-r">新版本：{{ processObj.newNumber }}</div>
                <div class="modal-b-b-r">新版本：{{ craftModel?.newNumber }}</div>
              </div>
            </template>
            <template v-else-if="isUpdate == 2">
              <div class="refresh-box">
                <template v-if="isLoading">
                <template v-if="loading">
                  <el-icon class="refresh-icon transform">
                    <Refresh />
                  </el-icon>
@@ -65,42 +65,55 @@
import { Refresh, Top } from '@element-plus/icons-vue'
import { useVModel } from '@vueuse/core'
import BigButton from '@/views/dashboard/components/BigButton.vue'
import { ref } from 'vue'
import { ref, toRefs, watch } from 'vue'
import type { CraftModel } from '@/api/craftModel'
export interface CraftDetailModalProps {
  craftModel: CraftModel
  activeArr: string[]
  modelValue: boolean
}
const props = withDefaults(defineProps<CraftDetailModalProps>(), {
  craftModel: Object,
  modelValue: false
})

const { craftModel, activeArr, modelValue } = toRefs(props)
const emit = defineEmits<{
  'update:modelValue': [show: boolean]
  close: []
  renew: [craftModel: CraftModel, true]
}>()
const modelData = useVModel(props, 'modelValue', emit)

function closeModal() {
  emit('close')
}
const processObj = {
  isUpdate: 1, //1==无下面的更新设置  2==有更新设置
  procedure: '111',
  number: 111,
  paramsMap: {
    压强: 111
  },
  newNumber: '新222',
  newParamsMap: {
    压强: 222
  }
}
// 有更新设置的初始值
const isUpdate = ref(1)
const isLoading = ref(false)
const loading = ref(false)
watch(modelData, () => {
  // 弹窗显示时获取工艺参数
  if (modelData.value) {
    getLoading()
  }
})
function getLoading() {
  for (let i in activeArr.value) {
    if (activeArr.value[i] == craftModel?.value?.number) {
      isUpdate.value = 2
      loading.value = true
      return true
    }
  }
  isUpdate.value = 1
  loading.value = false
}

function updateProcess() {
  isUpdate.value = 2
  isLoading.value = true
  if (loading.value) {
    return true
  }
  // 请求更新接口 获得数据之后isLoading.value=false;
  emit('renew', craftModel?.value, true)
}
//TODO: 工艺详情弹窗
</script>
@@ -156,6 +169,9 @@
  overflow: auto;
  width: calc(100% - 60px);
  margin: 0 auto;
  :deep(.el-scrollbar__view) {
    height: 100%;
  }
  .modal-t-two {
    height: calc(100% - 55px) !important;
  }