物料详情的弹框开发一半

haoxuan

2023-11-02 4757e21f5477d10934c8e26d28e19bbafaa7196f

 src/views/dashboard/components/InputOutMaterialInfo.vue

@@ -1,5 +1,5 @@
<template>
  <div class="input-out-material-info">
  <div class="input-out-material-info" @click="materialInfoClick">
    <div class="card-t">
      <div class="card-t-t card_drop">
        <el-popover :width="200" placement="top-start" trigger="click">
@@ -35,12 +35,13 @@
      </div>
    </div>
  </div>
  <MaterialDetails v-model="showModal"></MaterialDetails>
</template>
<script setup lang="ts">
import type { inputMaterial } from '@/api/task'
import MaterialDetails from '@/views/dashboard/components/MaterialDetails.vue'
import { Right } from '@element-plus/icons-vue'
import { toRefs } from 'vue'

import { ref, toRefs } from 'vue'
export interface InputOutMaterialInfoProps {
  item: inputMaterial
  background?: string
@@ -50,6 +51,11 @@
  background: '#ffcc00'
})
const { item, background } = toRefs(props)
const showModal = ref(false)

function materialInfoClick() {
  showModal.value = true
}
</script>

<style scoped lang="scss">
@@ -70,6 +76,7 @@
  margin-right: 10px;
  margin-bottom: 10px;
  position: relative;
  cursor: pointer;

  .card_drop {
    width: 100%;