gitlab上面的wms转移到公司git

charles

2024-08-06 5ecb7958c96d3f0b6d47b79aff7eb306c2cf690f

 src/views/productManage/product/index.vue

@@ -1,46 +1,29 @@
<template>
  <div class="rightContent">
    <div class="top">
      <SearchCommonView
        :add-title="'新建'"
        :placeholder="'请输入产品名称'"
        :amount-view="false"
        :search-task-map="searchTaskMap"
        @addCommonClick="addBtnClick"
        @searchClick="searchClick"
        @delSelectClick="delSelectClick"
      />
      <SearchCommonView :add-title="'新建'" :placeholder="'请输入产品名称'" :amount-view="false" :search-task-map="searchTaskMap" @addCommonClick="addBtnClick" @searchClick="searchClick" @delSelectClick="delSelectClick">
        <template slot="leftButton">
          <el-upload class="upload-demo" action="/api-wms/v1/product/inputProduct" :headers="{ Authorization: 'Bearer ' + token }" accept=".xls,.xlsx" :on-success="onSuccess" :on-error="onError" :limit="1" :show-file-list="false">
            <el-button size="small" type="primary" style="margin-left: 10px">导入</el-button>
          </el-upload>
        </template>
        <template slot="leftButton">
          <el-button size="small" type="text" style="margin-left: 10px" @click="downloadInputFormatCilck">模板下载</el-button>
        </template>
      </SearchCommonView>
    </div>
    <div class="list-view">
      <div class="icon-switch">
        <div class="icon-view">
          <span
            class="icon-label"
            @click="selIconSwitchClick('2')"
            :class="{ whiteBackgroud: isIconIndex === '1', blueBackgroud: isIconIndex === '2' }"
            style="margin-left: 5px"
            ><i class="el-icon-s-unfold"></i
          ></span>
          <span
            class="icon-label"
            @click="selIconSwitchClick('1')"
            :class="{ blueBackgroud: isIconIndex === '1', whiteBackgroud: isIconIndex === '2' }"
            ><i class="el-icon-menu"></i
          ></span>
          <span class="icon-label" @click="selIconSwitchClick('2')" :class="{ whiteBackgroud: isIconIndex === '1', blueBackgroud: isIconIndex === '2' }" style="margin-left: 5px"><i class="el-icon-s-unfold"></i></span>
          <span class="icon-label" @click="selIconSwitchClick('1')" :class="{ blueBackgroud: isIconIndex === '1', whiteBackgroud: isIconIndex === '2' }"><i class="el-icon-menu"></i></span>
        </div>
      </div>
      <!-- 图表形式 -->
      <div v-if="isIconIndex === '1'" class="product-view">
        <div class="product-box" v-for="item in tableList.tableInfomation" :key="item.id" @click="showDetail(item)">
          <div class="left">
            <el-image
              v-if="item.attachmentList?.length > 0"
              style="width: 60px; height: 80px"
              :src="item.attachmentList[0].FileUrl"
              :preview-src-list="item.srcList"
              :z-index="9999"
              @click.stop="imgClick"
            ></el-image>
            <el-image v-if="item.attachmentList?.length > 0" style="width: 60px; height: 80px" :src="item.attachmentList[0].FileUrl" :preview-src-list="item.srcList" :z-index="9999" @click.stop="imgClick"></el-image>
            <div v-else class="img-view">
              <i class="el-icon-picture-outline"></i>
            </div>
@@ -65,13 +48,16 @@
      <div v-if="isIconIndex === '2'" class="product-list">
        <TableCommonView ref="tableListRef" :table-list="tableList" @selTableCol="selTableCol">
          <template slot="tableButton">
            <el-table-column label="操作" width="90" align="center">
            <el-table-column label="操作" width="140" align="center">
              <template slot-scope="scope">
                <span @click.stop="showDetail(scope.row)" class="cursor_pointer" style="margin-right: 10px">
                  <span style="color: #2a78fb">查看</span>
                </span>
                <span @click.stop="editRow(scope.row)" class="cursor_pointer">
                  <span style="color: #2a78fb">编辑</span>
                </span>
                <span @click.stop="deleteRow(scope.row)" class="cursor_pointer">
                  <span style="color: #2a78fb; margin-left: 10px">删除</span>
                </span>
              </template>
            </el-table-column>
@@ -83,60 +69,78 @@
      </div>
    </div>
    <!-- 新建/编辑 -->
    <AddProductDialog v-if="editConfig.visible" :edit-common-config="editConfig" />
    <AddProductDialog ref="addProductRef" v-if="editConfig.visible" :edit-common-config="editConfig" />
  </div>
</template>

<script>
import pageMixin from "@/components/makepager/pager/mixin/pageMixin"
import { getProductList } from "@/api/product/product"
  import pageMixin from '@/components/makepager/pager/mixin/pageMixin'
  import { getProductList, deleteProduct, downloadInputFormat } from '@/api/product/product'
// import DetailProduct from "@/views/productManage/product/DetailProduct"
import AddProductDialog from "@/views/productManage/product/AddProductDialog"

  import AddProductDialog from '@/views/productManage/product/AddProductDialog'
  import { queryAttributeApi } from '@/api/product/attributeManage.js'
  import Cookies from 'js-cookie'
  import FileSaver from 'file-saver';
  import _ from 'lodash'
export default {
  name: "PruductManage",
    attributeList: [],
    name: 'PruductManage',
  props: {},
  components: { AddProductDialog },
  mixins: [pageMixin],
  computed: {},
  data() {
    return {
        token: Cookies.get('token'),
      tableList: {},
      showcol: ["内部编码",'产品规格', "负责人", "产品标签", "成本", "在库数量", "预测数量", "计量单位"],
        showcol: ['内部编码', '产品规格', '负责人', '产品标签', '成本', '在库数量', '预测数量', '计量单位'],
      searchOptions: [],
      commonDetail: {
        visible: false,
        title: "新建",
        infomation: {}
          title: '新建',
          infomation: {},
      },
      editConfig: {
        visible: false,
        title: "新建",
          title: '新建',
        infomation: {},
        autoEdit: false
          autoEdit: false,
          attributeList: [],
      },
      isIconIndex: "2", // 1 图标 2 列表
      url: "https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg",
        isIconIndex: '2', // 1 图标 2 列表
        url: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
      pageSizes: [15, 30],
      keyWord: "",
        keyWord: '',
      categoryId: null,
      searchTaskMap: []
        searchTaskMap: [],
    }
  },
  created() {
    this.setTable()
    let query = this.$route.query
    if (query) {
      console.log("ssssss")
        //console.log("ssssss")
      this.categoryId = query.id ? Number(query.id) : null
      this.pagerOptions.currPage = 1
      this.searchTaskMap = query.id ? [{ categoryId: this.categoryId, title: query.categoryName }] : []
    }
    this.getData()
      this.queryAttribute()
  },
  methods: {
      async queryAttribute() {
        const params = {
          page: 0,
          pageSize: 0,
          entityType: 1,
        }
        const { code, data } = await queryAttributeApi(params)
        if (code == 200) {
          this.attributeList = data
        }
      },
    setTable() {
      if (this.isIconIndex === "1") {
        if (this.isIconIndex === '1') {
        this.pageSizes = [30, 60]
        this.pagerOptions.pageSize = 30
      }
@@ -146,7 +150,7 @@
        selectIndex: true,
        showcol: this.showcol,
        allcol: [],
        tableColumn: this.setTableColumn(this.showcol)
          tableColumn: this.setTableColumn(this.showcol),
      }
      let allcol = []
      for (let i = 0; i < this.tableList.tableColumn.length; i++) {
@@ -160,76 +164,76 @@
    setTableColumn(showcol) {
      let tableColumn = [
        {
          label: "产品编码",
          prop: "id",
            label: '产品编码',
            prop: 'id',
          isShowColumn: true,
          default: true
            default: true,
        },
        {
          label: "产品名称",
          prop: "name",
            label: '产品名称',
            prop: 'name',
          isShowColumn: true,
          default: true
            default: true,
        },
        {
          label: "产品规格",
          prop: "specs",
          isShowColumn: showcol.includes("产品规格"),
          default: false
            label: '产品规格',
            prop: 'specs',
            isShowColumn: showcol.includes('产品规格'),
            default: false,
        },
        {
          label: "内部编码",
          prop: "internalReference",
          isShowColumn: showcol.includes("内部编码"),
          default: false
            label: '内部编码',
            prop: 'internalReference',
            isShowColumn: showcol.includes('内部编码'),
            default: false,
        },
        {
          label: "负责人",
          prop: "principal",
            label: '负责人',
            prop: 'principal',
          isShowColumn: true,
          default: true
            default: true,
        },
        {
          label: "产品标签",
          prop: "productTagName",
          isShowColumn: showcol.includes("产品标签"),
          default: false
            label: '产品标签',
            prop: 'productTagName',
            isShowColumn: showcol.includes('产品标签'),
            default: false,
        },
        {
          label: "条码",
          prop: "barcode",
          isShowColumn: showcol.includes("条码"),
          default: false
            label: '条码',
            prop: 'barcode',
            isShowColumn: showcol.includes('条码'),
            default: false,
        },
        {
          label: "销售价格",
          prop: "salePrice",
          isShowColumn: showcol.includes("销售价格"),
          default: false
            label: '销售价格',
            prop: 'salePrice',
            isShowColumn: showcol.includes('销售价格'),
            default: false,
        },
        {
          label: "成本",
          prop: "cost",
          isShowColumn: showcol.includes("成本"),
          default: false
            label: '成本',
            prop: 'cost',
            isShowColumn: showcol.includes('成本'),
            default: false,
        },
        {
          label: "产品类别",
          prop: "categoryName",
          isShowColumn: showcol.includes("产品类别"),
          default: false
            label: '产品类别',
            prop: 'categoryName',
            isShowColumn: showcol.includes('产品类别'),
            default: false,
        },
        {
          label: "产品类型",
          prop: "model",
          isShowColumn: showcol.includes("产品类型"),
          default: false
            label: '产品类型',
            prop: 'model',
            isShowColumn: showcol.includes('产品类型'),
            default: false,
        },
        {
          label: "在库数量",
          prop: "amount",
          isShowColumn: showcol.includes("在库数量"),
          default: false
            label: '在库数量',
            prop: 'amount',
            isShowColumn: showcol.includes('在库数量'),
            default: false,
        },
        // {
        //   label: "预测数量",
@@ -239,11 +243,11 @@
        //   status: true
        // },
        {
          label: "计量单位",
          prop: "unit",
          isShowColumn: showcol.includes("计量单位"),
          default: false
        }
            label: '计量单位',
            prop: 'unit',
            isShowColumn: showcol.includes('计量单位'),
            default: false,
          },
      ]
      return tableColumn
    },
@@ -257,14 +261,14 @@
        keyWord: this.keyWord,
        categoryId: this.categoryId ? this.categoryId : null,
        page: this.pagerOptions.currPage,
        pageSize: this.pagerOptions.pageSize
          pageSize: this.pagerOptions.pageSize,
      }).then((res) => {
        if (res.code === 200) {
          const list = res.data.map((item) => {
            let srcList = []
            if (item.attachmentList?.length > 0) {
              item.attachmentList.forEach((ele) => {
                if (ele.fileType === "picture") {
                  if (ele.fileType === 'picture') {
                  srcList.push(ele.FileUrl)
                }
              })
@@ -274,7 +278,7 @@

            return {
              ...item,
              srcList
                srcList,
            }
          })
          this.tableList.tableInfomation = list || []
@@ -291,34 +295,37 @@
    },
    // 新建
    addBtnClick() {
      this.editConfig.title = "新建"
        this.editConfig.title = '新建'
      this.editConfig.infomation = {
        purchaseTypeList:[]
          purchaseTypeList: [],
      }
      this.editConfig.visible = true
        this.editConfig.attributeList = JSON.parse(JSON.stringify(this.attributeList))
    },
    // 详情
    showDetail(row) {
      console.log(row)
      this.editConfig.autoEdit = false
      this.editConfig.title = "编辑"
      let imageSrc = row.attachmentList?.length > 0 ? row.attachmentList[0].FileUrl : ""
        this.editConfig.title = '查看'
        let imageSrc = row.attachmentList?.length > 0 ? row.attachmentList[0].FileUrl : ''
      this.editConfig.infomation = { ...row, imageSrc: imageSrc }
      this.editConfig.visible = true
        this.editConfig.attributeList = row.attributes || []
    },
    // 编辑
    editRow(row) {
      this.editConfig.autoEdit = true
      this.editConfig.title = "编辑"
      let imageSrc = row.attachmentList?.length > 0 ? row.attachmentList[0].FileUrl : ""
        this.editConfig.title = '编辑'
        let imageSrc = row.attachmentList?.length > 0 ? row.attachmentList[0].FileUrl : ''
      this.editConfig.infomation = { ...row, imageSrc: imageSrc,moreUnitList:row.moreUnitList?row.moreUnitList:[] }
      this.editConfig.visible = true
        this.editConfig.attributeList = row.attributes || []
    },
    // 切换列表展现形式
    selIconSwitchClick(value) {
      this.pagerOptions.currPage = 1
      this.isIconIndex = value
      if (value === "1") {
        if (value === '1') {
        this.pageSizes = [30, 60]
        this.pagerOptions.pageSize = 30
      } else {
@@ -332,8 +339,58 @@
      this.categoryId = 0
      this.getData()
    },
    imgClick() {}
      imgClick() {},

      //删除
      deleteRow(row) {
        this.$confirm('此操作将永久删除该产品, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning',
        })
          .then(() => {
            deleteProduct({
              id: row.id,
            }).then((res) => {
              if (res.code == 200) {
                this.$message({
                  type: 'success',
                  message: '删除成功!',
                })
                this.getData()
              } else {
                this.$message.error('删除时出错，请稍后重试或联系管理员...')
  }
            })
          })
          .catch(() => {})
      },

      onSuccess(res, file, fileList) {
        if (res.code == 200) {
          this.$message({
            type: 'success',
            message: '导入成功!',
          })
          this.getData()
        } else {
          this.$message.error(res.msg)
        }
      },
      onError(err, file, fileList) {
        this.$message.error('导入时出错，请稍后重试或联系管理员...')
      },
      downloadInputFormatCilck: _.debounce(function () {
        downloadInputFormat({
        }).then((res) => {
          if (res) {
            console.log(res);
            FileSaver.saveAs(res, '产品导入模板.xlsx');
            this.$message.success('下载成功！')
          }
        })
      }, 1000),
    },
}
</script>