图库管理

src/api/product.js

@@ -17,11 +17,20 @@ export function getTechList (param) {
   })
 }
 
+// 产品列表
+export function getProductList (params) {
+  return request({
+    url: request.adornUrl(`/biz-service/product/list`),
+    method: 'get',
+    params: params
+  })
+}
+
 // 图纸列表
-export function getDrawList (param) {
+export function getDrawList (params) {
   return request({
     url: request.adornUrl(`/biz-service/drawing/list`),
     method: 'get',
-    params: param
+    params: params
   })
 }

src/views/modules/tech/draw-add-or-update.vue

@@ -0,0 +1,513 @@
+<template>
+    <div>
+      <el-dialog
+        :title="!id ? '新增': display ? '详情' : '修改'"
+        width="70%"
+        :close-on-click-modal="false"
+        :visible.sync="visible">
+        <el-form :model="dataForm" :rules="dataRule" ref="dataForm" label-width="auto">
+          <el-row class="my-row">
+            <el-col :span="8">
+              <el-form-item label="产品名称" prop="productName">
+                <el-input v-model="dataForm.productName" :disabled="display" placeholder="产品名称"></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8" style="padding-left: 20px">
+              <el-form-item label="产品规格" prop="productSpec">
+                <el-input v-model="dataForm.productSpec" :disabled="display" placeholder="产品规格"></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8" style="padding-left: 20px">
+              <el-form-item label="产品类别" prop="productType">
+                <el-select
+                  v-model="dataForm.productType"
+                  :disabled="display"
+                  remote
+                  placeholder="请选择">
+                  <el-option
+                    v-for="item in optionsType"
+                    :key="item.code"
+                    :label="item.value"
+                    :value="item.code">
+                  </el-option>
+                </el-select>
+              </el-form-item>
+            </el-col>
+          </el-row>
+          <el-row class="my-row">
+            <el-col :span="8">
+              <el-form-item label="产品来源" prop="source">
+                <el-input v-if="display" v-model="dataForm.sourceName" disabled></el-input>
+                <el-select v-else
+                  v-model="dataForm.source"
+                  :disabled="display"
+                           filterable
+                  remote
+                           :remote-method="remoteCusList"
+                  placeholder="请选择">
+                  <el-option
+                    v-for="item in optionsSource"
+                    :key="item.code"
+                    :label="item.value"
+                    :value="item.code">
+                  </el-option>
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8" style="padding-left: 20px">
+              <el-form-item label="产品工艺" prop="techId">
+                <el-input v-if="display" v-model="dataForm.techName" disabled></el-input>
+                <el-select v-else
+                  v-model="dataForm.techId"
+                  :disabled="display"
+                           filterable
+                  remote
+                           :remote-method="remoteTech"
+                  placeholder="请选择">
+                  <el-option
+                    v-for="item in optionsTech"
+                    :key="item.code"
+                    :label="item.value"
+                    :value="item.code">
+                  </el-option>
+                </el-select>
+              </el-form-item>
+            </el-col>
+          </el-row>
+          <el-row class="my-row">
+            <el-form-item label="产品图纸" prop="drawingIdList">
+              <el-upload v-if="display"
+                class="upload-demo"
+                ref="upload"
+                :multiple="true"
+                action="#"
+                accept="image/jpeg,image/gif,image/png"
+                :on-preview="handlePreview"
+                :file-list="fileList"
+                :auto-upload="false">
+              </el-upload>
+              <el-select v-else
+                v-model="dataForm.drawingIdList"
+                :disabled="display"
+                         filterable
+                         multiple
+                         remote
+                         :remote-method="remoteDraw"
+                placeholder="请选择">
+                <el-option
+                  v-for="item in optionsDraw"
+                  :key="item.code"
+                  :label="item.value"
+                  :value="item.code">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-row>
+          <el-row class="my-row">
+            <el-form-item label="备注" prop="notes">
+              <el-input v-model="dataForm.notes" :disabled="display" placeholder="备注"></el-input>
+            </el-form-item>
+          </el-row>
+          <el-row class="my-row">
+            <el-form-item label="是否组合产品" prop="displayProductList">
+              <el-switch
+                v-model="dataForm.displayProductList"
+                :disabled="display"
+                active-color="#13ce66"
+                inactive-color="#ff4949"
+                active-text="是"
+                inactive-text="否">
+              </el-switch>
+            </el-form-item>
+          </el-row>
+          <el-row v-if="dataForm.displayProductList">
+            <div class="title"><span style="color: red">*</span> 组合小产品</div>
+            <el-table
+              :data="productDetails"
+              border
+              style="width: 100%;">
+              <el-table-column
+                label="序号"
+                type="index"
+                width="50"
+                align="center">
+              </el-table-column>
+              <el-table-column
+                prop="productName"
+                header-align="center"
+                align="center"
+                label="产品名称">
+              </el-table-column>
+              <el-table-column
+                prop="productSpec"
+                header-align="center"
+                align="center"
+                label="规格">
+              </el-table-column>
+              <el-table-column
+                prop="cnt"
+                header-align="center"
+                align="center"
+                label="数量"
+                width="170">
+                <template slot-scope="scope">
+                  <el-input-number v-model="scope.row.cnt" :disabled="display" :min="1" style="width: 140px;"/>
+                </template>
+              </el-table-column>
+              <el-table-column
+                prop="unitName"
+                header-align="center"
+                align="center"
+                label="单位">
+              </el-table-column>
+              <el-table-column
+                prop="notes"
+                header-align="center"
+                align="center"
+                label="备注">
+              </el-table-column>
+            </el-table>
+            <el-row style="text-align: center; margin-top: 10px;">
+              <el-button v-show="!display" type="primary" icon="el-icon-plus" @click="addProduct"></el-button>
+            </el-row>
+          </el-row>
+          <el-row>
+            <div class="title"><span style="color: red">*</span> 产品配料清单</div>
+            <el-table
+              :data="materialList"
+              border
+              style="width: 100%;">
+              <el-table-column
+                label="序号"
+                type="index"
+                width="50"
+                align="center">
+              </el-table-column>
+              <el-table-column
+                prop="materialName"
+                header-align="center"
+                align="center"
+                label="物品名称">
+              </el-table-column>
+              <el-table-column
+                prop="specifications"
+                header-align="center"
+                align="center"
+                label="规格">
+              </el-table-column>
+              <el-table-column
+                prop="cnt"
+                header-align="center"
+                align="center"
+                label="数量"
+                width="170">
+                <template slot-scope="scope">
+                  <el-input-number v-model="scope.row.cnt" :disabled="display" :min="1" style="width: 140px;"/>
+                </template>
+              </el-table-column>
+              <el-table-column
+                prop="unitName"
+                header-align="center"
+                align="center"
+                label="单位">
+              </el-table-column>
+              <el-table-column
+                prop="notes"
+                header-align="center"
+                align="center"
+                label="备注">
+              </el-table-column>
+            </el-table>
+            <el-row style="text-align: center; margin-top: 10px;">
+              <el-button v-show="!display" type="primary" icon="el-icon-plus" @click="addMaterial"></el-button>
+            </el-row>
+          </el-row>
+        </el-form>
+        <span slot="footer" class="dialog-footer">
+          <el-button @click="visible = false">取消</el-button>
+          <el-button v-if="!display" type="primary" @click="dataFormSubmit()">确定</el-button>
+        </span>
+      </el-dialog>
+      <!-- 图片预览 -->
+      <el-dialog title="图片预览" :visible.sync="previewVisible" width="50%">
+        <img :src="previewPath" :alt="previewName" style="width:100%;height:100%" />
+      </el-dialog>
+      <template-chose v-if="productListVisible" ref="productList" @addItem="addProductItem" />
+      <templateChoseMaterial v-if="materialListVisible" ref="materialList" @addItem="addMaterialItem"/>
+    </div>
+</template>
+
+<script>
+  import templateChose from '../product/template-chose'
+  import templateChoseMaterial from '../product/template-chose-material'
+  import { getDictList } from '@/api/dict'
+  import { getProductDetail, getTechList, getDrawList } from '@/api/product'
+  import { uploadUrl, downloadUrl } from '@/api/file'
+  import { getCusList } from '@/api/cus'
+
+  export default {
+    name: 'draw-add-or-update',
+    components: {templateChose, templateChoseMaterial},
+    computed: {
+      orgId: {
+        get () { return this.$store.state.user.orgId }
+      }
+    },
+    watch: {
+      'dataForm.isCompose' (value) {
+        this.dataForm.displayProductList = value === '1'
+      }
+    },
+    data () {
+      return {
+        productListVisible: false,
+        materialListVisible: false,
+        visible: false,
+        display: false,
+        optionsType: [],
+        optionsTech: [],
+        optionsSource: [],
+        optionsDraw: [],
+        fileList: [],
+        dataList: [],
+        id: 0,
+        productDetails: [],
+        materialList: [],
+        dataForm: {
+          displayProductList: false
+        },
+        uploadUrl: uploadUrl,
+        previewPath: '',
+        previewName: '',
+        previewVisible: false,
+        dataRule: {
+          productName: [{ required: true, message: '产品名称不能为空', trigger: 'blur' }],
+          productSpec: [{ required: true, message: '产品规格不能为空', trigger: 'blur' }],
+          productType: [{ required: true, message: '产品类别不能为空', trigger: 'change' }],
+          source: [{ required: true, message: '产品来源不能为空', trigger: 'change' }],
+          techId: [{ required: true, message: '产品工艺不能为空', trigger: 'change' }],
+          drawingIdList: [{ required: true, message: '产品图纸不能为空', trigger: 'change' }]
+        }
+      }
+    },
+    methods: {
+      async init (id, display) {
+        this.fileList = []
+        this.dataForm = {}
+        this.productDetails = []
+        this.materialList = []
+        this.optionsSource = []
+        this.optionsTech = []
+        this.optionsDraw = []
+        this.visible = true
+        this.id = id || 0
+        this.display = display
+        // 获取产品类别
+        await getDictList({type: 'product_type'}).then(({data}) => {
+          if (data) {
+            this.optionsType = data
+          }
+        })
+        // 产品工艺
+        if (!id) return
+        await getProductDetail(this.id).then(({data}) => {
+          if (data && data.code === '200') {
+            this.dataForm = data.data
+            // 组合小产品
+            data.data.composeProductMaterialList.forEach((item) => {
+              this.productDetails.push(item)
+            })
+            // 产品配料清单
+            data.data.productMaterialList.forEach((item) => {
+              this.materialList.push(item)
+            })
+            // 产品来源
+            if (data.data.source) {
+              this.optionsSource = [{
+                code: data.data.source,
+                value: data.data.sourceName
+              }]
+            }
+            // 产品工艺
+            if (data.data.techId) {
+              this.optionsTech = [{
+                code: data.data.techId,
+                value: data.data.techName
+              }]
+            }
+            // 产品图纸
+            if (data.data.proDrawings) {
+              this.dataForm.drawingIdList = []
+              data.data.proDrawings.forEach((item) => {
+                if (item.attachList) {
+                  item.attachList.forEach((item1) => {
+                    this.fileList.push({
+                      name: item1.fileName,
+                      url: item1.url,
+                      id: item1.url
+                    })
+                  })
+                }
+                this.optionsDraw.push({
+                  code: item.drawingId,
+                  value: item.drawingName
+                })
+                this.dataForm.drawingIdList.push(item.drawingId)
+              })
+            }
+          }
+        })
+      },
+      handlePreview (file) {
+        if (file && file.url) {
+          // 获取文件路径
+          this.previewPath = downloadUrl + file.url
+          this.previewName = file.name
+          this.previewVisible = true
+        }
+      },
+      // 产品来源（客户）列表
+      async remoteCusList (query) {
+        if (!query) {
+          query = ''
+        }
+        await getCusList({'customerName': query}).then(({data}) => {
+          if (data && data.code === '200') {
+            this.optionsSource = []
+            data.data.records.forEach((item) => {
+              this.optionsSource.push({
+                code: item.customerId,
+                value: item.customerName
+              })
+            })
+          }
+        }
+      )
+      },
+      // 产品工艺
+      async remoteTech (query) {
+        if (!query) {
+          query = ''
+        }
+        await getTechList().then(({data}) => {
+          if (data && data.code === '200') {
+            this.optionsTech = []
+            data.data.records.forEach((item) => {
+              this.optionsTech.push({
+                code: item.customerId,
+                value: item.customerName
+              })
+            })
+          }
+        })
+      },
+      // 图纸
+      async remoteDraw (query) {
+        if (!query) {
+          query = ''
+        }
+        await getDrawList({'keyword': query}).then(({data}) => {
+          if (data && data.code === '200') {
+            this.optionsDraw = []
+            data.data.records.forEach((item) => {
+              this.optionsDraw.push({
+                code: item.drawingId,
+                value: item.drawingName
+              })
+            })
+          }
+        })
+      },
+      // 添加组合产品
+      addProduct () {
+        this.productListVisible = true
+        this.$nextTick(() => {
+          this.$refs.productList.init()
+        })
+      },
+      addProductItem (item) {
+        this.productDetails.push({
+          productId: item.productId,
+          productName: item.productName,
+          productSpec: item.productSpec,
+          cnt: 1,
+          unitName: item.unitName,
+          notes: item.notes
+        })
+      },
+      addMaterial () {
+        this.materialListVisible = true
+        this.$nextTick(() => {
+          this.$refs.materialList.init()
+        })
+      },
+      addMaterialItem (item) {
+        this.materialList.push({
+          materialId: item.materialId,
+          materialName: item.materialName,
+          specifications: item.specifications,
+          cnt: item.cnt,
+          unitName: item.unitName,
+          notes: item.notes
+        })
+      },
+      validateField (type) {
+        this.$refs.dataForm.validateField(type)
+      },
+      // 表单提交
+      dataFormSubmit () {
+        this.$refs['dataForm'].validate((valid) => {
+          if (valid) {
+            // 组合小产品
+            this.dataForm.composeProductMaterialList = []
+            const b1 = this.dataForm.displayProductList
+            this.dataForm.isCompose = b1 === true ? '1' : '0'
+            if (this.dataForm.isCompose === '1' && this.productDetails.length > 0) {
+              this.productDetails.forEach((item) => {
+                this.dataForm.composeProductMaterialList.push({
+                  cnt: item.cnt,
+                  materialId: item.productId,
+                  notes: item.notes
+                })
+              })
+            }
+            // 产品配料清单
+            this.dataForm.productMaterialList = []
+            if (this.materialList.length > 0) {
+              this.materialList.forEach((item) => {
+                this.dataForm.productMaterialList.push({
+                  cnt: item.cnt,
+                  materialId: item.materialId,
+                  notes: item.notes
+                })
+              })
+            }
+            this.$http({
+              url: this.$http.adornUrl(`/biz-service/product/save`),
+              method: 'post',
+              data: this.$http.adornData({...this.dataForm, orgId: this.orgId})
+            }).then(({data}) => {
+              if (data && data.code === '200') {
+                this.$message({
+                  message: '操作成功',
+                  type: 'success',
+                  duration: 1500,
+                  onClose: () => {
+                    this.visible = false
+                    this.$emit('refreshDataList')
+                  }
+                })
+              } else {
+                this.$message.error(data.msg)
+              }
+            })
+          }
+        })
+      }
+    }
+  }
+</script>
+
+<style scoped>
+
+</style>

src/views/modules/tech/draw-management.vue

@@ -1,11 +1,253 @@
 <!-- 图库管理 -->
 <template>
-
+  <div class="draw-management">
+    <el-form :inline="true" :model="dataForm" @keyup.enter.native="search()">
+      <el-form-item label="名称">
+        <el-input v-model="dataForm.keyword" placeholder="产品名称" clearable/>
+      </el-form-item>
+      <el-form-item label="创建日期">
+        <el-date-picker
+          v-model="dataForm.date"
+          value-format="yyyy-MM-dd"
+          type="daterange"
+          range-separator="至"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期">
+        </el-date-picker>
+      </el-form-item>
+      <el-form-item label="对应产品">
+        <el-select
+          v-model="dataForm.productId"
+          filterable
+          clearable
+          remote
+          :remote-method="remoteProducts"
+          placeholder="请选择">
+          <el-option
+            v-for="item in optionsProducts"
+            :key="item.code"
+            :label="item.value"
+            :value="item.code">
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item>
+        <el-button @click="search()">查询</el-button>
+        <el-button type="primary" @click="addOrUpdateHandle(0, false)">上传图纸</el-button>
+      </el-form-item>
+    </el-form>
+    <el-table
+      :data="dataList"
+      border
+      v-loading="dataListLoading"
+      style="width: 100%;">
+      <el-table-column
+        label="序号"
+        type="index"
+        width="50"
+        align="center">
+      </el-table-column>
+      <el-table-column
+        prop="drawingCode"
+        header-align="center"
+        align="center"
+        min-width="100"
+        label="图纸编码">
+      </el-table-column>
+      <el-table-column
+        prop="drawingName"
+        header-align="center"
+        align="center"
+        min-width="120"
+        label="图纸名称">
+      </el-table-column>
+      <el-table-column
+        prop="productName"
+        header-align="center"
+        align="center"
+        label="对应产品">
+      </el-table-column>
+      <el-table-column
+        prop="source"
+        header-align="center"
+        align="center"
+        min-width="200"
+        :show-overflow-tooltip="true"
+        label="来源">
+      </el-table-column>
+      <el-table-column
+        prop="createTime"
+        header-align="center"
+        align="center"
+        min-width="160"
+        label="创建时间">
+      </el-table-column>
+      <el-table-column
+        prop="creatorName"
+        header-align="center"
+        align="center"
+        min-width="100"
+        label="上传者">
+      </el-table-column>
+      <el-table-column
+        prop="notes"
+        header-align="center"
+        align="center"
+        min-width="180"
+        :show-overflow-tooltip="true"
+        label="备注">
+      </el-table-column>
+      <el-table-column
+        fixed="right"
+        header-align="center"
+        align="center"
+        width="150"
+        label="操作">
+        <template slot-scope="scope">
+          <el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.drawingId, true)">查看</el-button>
+          <el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.drawingId, false)">编辑</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    <el-pagination
+      @size-change="sizeChangeHandle"
+      @current-change="currentChangeHandle"
+      :current-page="pageIndex"
+      :page-sizes="[10, 20, 50, 100]"
+      :page-size="pageSize"
+      :total="totalPage"
+      layout="total, sizes, prev, pager, next, jumper">
+    </el-pagination>
+    <!-- 弹窗, 新增 / 修改 -->
+    <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update>
+  </div>
 </template>
 
 <script>
+  import AddOrUpdate from './draw-add-or-update'
+  import { getDrawList, getProductList } from '@/api/product'
   export default {
-    name: 'draw-management'
+    name: 'draw-management',
+    comments: {
+      AddOrUpdate
+    },
+    data () {
+      return {
+        addOrUpdateVisible: false,
+        dataForm: {
+          keyword: ''
+        },
+        optionsProducts: [],
+        dataList: [],
+        pageIndex: 1,
+        pageSize: 10,
+        totalPage: 0,
+        dataListLoading: false,
+        dataListSelections: []
+      }
+    },
+    created () {
+      this.getDataList()
+    },
+    methods: {
+      // 查询
+      search () {
+        this.pageIndex = 1
+        this.getDataList()
+      },
+      // 获取数据列表
+      getDataList () {
+        this.addOrUpdateVisible = false
+        this.dataListLoading = true
+        let params = {
+          'current': this.pageIndex,
+          'size': this.pageSize,
+          'keyword': this.dataForm.keyword,
+          'createTime': this.dataForm.createTime ? this.dataForm.createTime : null,
+          'productId': this.dataForm.productId ? this.dataForm.productId : null
+        }
+        getDrawList(params).then(({data}) => {
+          if (data && data.code === '200') {
+            this.dataList = data.data.records
+            this.totalPage = Number(data.data.total)
+          } else {
+            this.dataList = []
+            this.totalPage = 0
+          }
+          this.dataListLoading = false
+        })
+      },
+      // 每页数
+      sizeChangeHandle (val) {
+        this.pageSize = val
+        this.pageIndex = 1
+        this.getDataList()
+      },
+      // 当前页
+      currentChangeHandle (val) {
+        this.pageIndex = val
+        this.getDataList()
+      },
+      // 多选
+      selectionChangeHandle (val) {
+        this.dataListSelections = val
+      },
+      // 新增 / 修改
+      addOrUpdateHandle (id, display) {
+        this.addOrUpdateVisible = true
+        this.$nextTick(() => {
+          this.$refs.addOrUpdate.init(id, display)
+        })
+      },
+      // 删除
+      deleteHandle (id) {
+        if (!id) return
+        let ids = []
+        ids.push(id)
+        this.$confirm(`确定删除?`, '提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        }).then(() => {
+          this.$http({
+            url: this.$http.adornUrl(`/biz-service/drawing/delete`),
+            method: 'DELETE',
+            data: ids
+          }).then(({data}) => {
+            if (data && data.code === '200') {
+              this.$message({
+                message: '操作成功',
+                type: 'success',
+                duration: 1500,
+                onClose: () => {
+                  this.getDataList()
+                }
+              })
+            } else {
+              this.$message.error(data.msg)
+            }
+          })
+        }).catch(() => {})
+      },
+      async remoteProducts (query) {
+        if (!query) return
+        let params = {
+          'productName': query
+        }
+        await getProductList(params).then(({data}) => {
+          this.optionsProducts = []
+          if (data && data.code === '200') {
+            data.data.records.forEach((item) => {
+              this.optionsProducts.push({
+                code: item.productId,
+                value: item.productName,
+                id: item.productId
+              })
+            })
+          }
+        })
+      }
+    }
   }
 </script>
 

src/views/modules/tech/product-management.vue

@@ -146,6 +146,7 @@
 <script>
   import AddOrUpdate from './product-add-or-update'
   import { getDictList } from '@/api/dict'
+  import { getProductList } from '@/api/product'
   export default {
     name: 'product-management',
     components: {
@@ -187,16 +188,13 @@
       getDataList () {
         this.dataListLoading = true
         this.addOrUpdateVisible = false
-        this.$http({
-          url: this.$http.adornUrl('/biz-service/product/list'),
-          method: 'get',
-          params: this.$http.adornParams({
-            'current': this.pageIndex,
-            'size': this.pageSize,
-            'productName': this.dataForm.productName ? this.dataForm.productName : null,
-            'productType': this.dataForm.productType ? this.dataForm.productType : null
-          })
-        }).then(({data}) => {
+        let params = {
+          'current': this.pageIndex,
+          'size': this.pageSize,
+          'productName': this.dataForm.productName ? this.dataForm.productName : null,
+          'productType': this.dataForm.productType ? this.dataForm.productType : null
+        }
+        getProductList(params).then(({data}) => {
           if (data && data.code === '200') {
             this.dataList = data.data.records
             this.totalPage = Number(data.data.total)