ahdevicemgt-ui/src/views/purchase/arrival/index.vue

<template>
    <!-- 往来单位管理页面 -->
    <div class="app-container">
        <PageHeader
          v-if="isShowComponent !== 'Index'"
          :pageContent="pageContent"
          @goBack="goBack"
        />
        <!-- 列表 -->
        <TableModel
          :formLabel="formLabel"
          :columnsList="columnsList"
          :request-api="queryPurchaseArrivalListApi"
          ref="tableRef"
          v-if="isShowComponent === 'Index'"
        >
            <template slot="btn" slot-scope="{ queryParams }">
                <el-button type="primary" @click="isShowComponent = 'add-arrival'"
                    >设备到货新增</el-button
                >
                <el-button @click="handleExportData(queryParams, 'base/masupplier/export', '物资厂家清单')"
                    >导出</el-button
                >
            </template>

            <template slot="handle" slot-scope="{ data }">
                <el-button
                  type="primary"
                  size="mini"
                  @click="seeDetail(data)"
                >查看</el-button
                >
                <el-button
                  type="success"
                  size="mini"
                  @click="handleSubmit(data.id)"
                  v-if="data.status === 47"
                >提交</el-button
                >

                <el-button
                    type="primary"
                    size="mini"
                    @click="handleEditData(data)"
                    >编辑</el-button
                >
                <el-button
                    type="danger"
                    size="mini"
                    @click="handleDeleteData(data.id, delArrivalApi)"
                    >删除</el-button
                >
                <el-button
                  type="warning"
                  size="mini"
                  @click="handleNotice(data)"
                  v-if="data.status === 49"
                >通知</el-button
                >
            </template>
<!--            <template slot="picUrl" slot-scope="{ data }">
              <h4
                style="color: #02A7F0; cursor: pointer"
                v-if="data.picUrl === '' || data.picUrl === null"
                @click="handleEditData(data)"
              >上传</h4>
              <h4
                style="color: #02A7F0; cursor: pointer"
                v-else
                @click="openUrl(data.picUrl)"
              >查看</h4>
            </template>-->
          <template slot="purchaseNum" slot-scope="{ data }">
            {{ data.purchaseNum / storageDex }}
          </template>
          <template slot="purchasePrice" slot-scope="{ data }">
            {{ data.purchasePrice / priceDex }}
          </template>
          <template slot="notaxPrice" slot-scope="{ data }">
            {{ data.notaxPrice / priceDex }}
          </template>
          <template slot="status" slot-scope="{ data }">
            <span style="color: #D9001B">
              {{ data.statusName }}
            </span>
          </template>
        </TableModel>

        <!-- 新增以及修改时的弹框 -->
        <DialogModel
            :dialogConfig="dialogConfig"
            @closeDialogOuter="closeDialogOuter"
        >
            <template slot="outerContent">
                <!-- 新增以及修改数据的表单组件 -->
                <FormArrival
                    @closeDialog="closeDialog"
                    :editParams="editParams"
                />
            </template>
        </DialogModel>

        <add-arrival
          v-if="isShowComponent === 'add-arrival'"
          :send-range="factoryRange"
          :send-cascader="cascaderRange"
        >

        </add-arrival>

        <see-detail
          v-if="isShowComponent === 'see-detail'"
          :edit-params="detailParams"
        >

        </see-detail>

        <DialogModel
          :dialogConfig="dialogConfigNotice"
          @closeDialogOuter="closeDialogOuterNotice"
        >
          <template slot="outerContent">
            <!-- 新增以及修改数据的表单组件 -->
            <TableNotice
              @closeDialog="closeDialog"
              :editParams="editParams"
            />
          </template>
        </DialogModel>

    </div>
</template>

<script>
import PageHeader from '@/components/pageHeader'
import { columnsList, dialogConfig, formLabel, queryStatusSelData } from './config'
import { dialogConfigNotice } from './config-notice'
import { commonMixin } from '../mixins/common'
import FormArrival from './components/form-arrival.vue'
import AddArrival from './components/add-arrival.vue'
import SeeDetail from './components/see-detail.vue'
import TableNotice from './components/table-notice.vue'
import {
  queryPurchaseArrivalListApi,
  queryTypeListApi,
  submitArrivalApi,
  delArrivalApi
} from '@/api/purchase/arrival'
import {
  querySupplierListApi
} from '@/api/material/masupplier'
export default {
    name: 'purchaseArrivalManage',
    mixins: [commonMixin], // 混入公共方法和数据
    components: { FormArrival, PageHeader, AddArrival, SeeDetail, TableNotice },
    created() {
      queryStatusSelData()
      // 查询厂家
      querySupplierListApi().then(res => {
        this.factoryRange = res.rows.map(item => {
          return {
            label: item.name,
            value: item.id
          }
        })
      }).catch(err => {})
      // 查询物资规格
      queryTypeListApi().then(res => {
        res.data.forEach(lv1 => {
          if(!lv1.children) {
            lv1.disabled = true
          } else {
            lv1.children.forEach(lv2 => {
              if(!lv2.children) {
                lv2.disabled = true
              } else {
                lv2.children.forEach(lv3 => {
                  if(!lv3.children) {
                    lv3.disabled = true
                  }
                })
              }
            })
          }
        })
        this.cascaderRange = res.data
      }).catch(err => {})
    },
    methods: {
      queryPurchaseArrivalListApi,
      delArrivalApi,
      // 查看详情
      seeDetail(data) {
        console.log(data)
        this.detailParams = data
        this.isShowComponent = 'see-detail'
      },
      // 提交按钮
      handleSubmit(id) {
        let idList = []
        idList.push(id)
        submitArrivalApi(idList).then(res => {
          console.log(res)
          this.$modal.msgSuccess('提交成功')
          this.$refs.tableRef.getTableList()
        }).catch(err => {})
      },
      goBack() {
        this.isShowComponent = 'Index'
      }
    },
    data() {
        return {
            isShowComponent: 'Index',
            pageContent: '设备到货新增',
            formLabel,
            columnsList,
            dialogConfig,
            dialogConfigNotice,
            addDialogTitle: '新建到货管理', // 新建时弹框标题
            editDialogTitle: '修改到货管理', // 修改时弹框标题
            factoryRange: [],
            cascaderRange: [],
            storageDex: 1000,
            priceDex: 100,
            detailParams: undefined,
            // 通知弹框

        }
    },
}
</script>