|
@@ -0,0 +1,385 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <el-button size="small" type="primary" @click="onShow" >{{title}}</el-button>
|
|
|
+ <el-drawer
|
|
|
+ title="添加商品"
|
|
|
+ :visible.sync="dialogFormVisible"
|
|
|
+ size="90%"
|
|
|
+ direction="rtl"
|
|
|
+ :show-close="false"
|
|
|
+ append-to-body
|
|
|
+ @close="onClose">
|
|
|
+ <div class="drawer__panel">
|
|
|
+ <div class="flex-between" >
|
|
|
+ <span class="header-title">选择报价单:</span>
|
|
|
+ <el-popover
|
|
|
+ placement="bottom"
|
|
|
+ width="800"
|
|
|
+ trigger="click"
|
|
|
+ v-model="queryShow"
|
|
|
+ @show="queryQuotationData">
|
|
|
+ <el-table :data="quotationData" @row-click="rowClick">
|
|
|
+ <el-table-column
|
|
|
+ prop="status"
|
|
|
+ label="状态"
|
|
|
+ width="180">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="billno"
|
|
|
+ label="单号"
|
|
|
+ width="180">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="submitby"
|
|
|
+ label="提交人"
|
|
|
+ width="180">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="submitdate"
|
|
|
+ label="提交时间">
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <el-input slot="reference" readonly type="text" placeholder="选择报价单" style="width:200px" size="small" v-model="billno"></el-input>
|
|
|
+ </el-popover>
|
|
|
+ </div>
|
|
|
+ <el-divider style="margin-top: -30px;"></el-divider>
|
|
|
+ <div class="top-margin">
|
|
|
+ <el-select v-model="sa_brandid" placeholder="选择品牌" size="small" clearable class="inline-24" @change="brandChange" :disabled="querySa_brandid > 0">
|
|
|
+ <el-option
|
|
|
+ v-for="item in options.brands"
|
|
|
+ :key="item.sa_brandid"
|
|
|
+ :label="item.brandname"
|
|
|
+ :value="item.sa_brandid">
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ <el-cascader
|
|
|
+ placeholder="选择分类" size="small"
|
|
|
+ v-model="itemclassid"
|
|
|
+ :options="options.itemclass"
|
|
|
+ :props="{ checkStrictly: true,children:'subdep',label:'itemclassname',value:'itemclassid' }"
|
|
|
+ clearable @change="classChange"></el-cascader>
|
|
|
+ </div>
|
|
|
+ <div class="top-margin">
|
|
|
+ <uploadAllData
|
|
|
+ class="inline-16"
|
|
|
+ :total="total"
|
|
|
+ @handlePullApi="handlePullApi"
|
|
|
+ @handleUploadApi="handleUploadApi"
|
|
|
+ @onSuccess="onSuccess"
|
|
|
+ ></uploadAllData>
|
|
|
+ <el-button :disabled="items.length === 0" :type="items.length > 0?'primary':''" size="small" class="inline-24 bottom-margin" @click="batchAdd">添加选中商品</el-button>
|
|
|
+ <el-input style="width:200px;" placeholder="商品名称/编码/品号" :suffix-icon="params.content.where.condition?params.content.where.condition.length > 0?'':'':'el-icon-search'" v-model="params.content.where.condition" @keyup.native.enter="listData(params.content.pageNumber = 1)" @clear="listData(params.content.pageNumber = 1)" size="small" class="input-with-select inline-24 layout_search__panel bottom-margin" clearable>
|
|
|
+ </el-input>
|
|
|
+ <el-select v-model="itemstandard" placeholder="选择标准" size="small" clearable class="inline-24 bottom-margin" @change="queryChange">
|
|
|
+ <el-option
|
|
|
+ v-for="item in options.itemstandards"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.value"
|
|
|
+ :value="item.value">
|
|
|
+ <span style="float: left">{{ item.value }}</span>
|
|
|
+ <span style="float: right; color: #8492a6; font-size: 12px">{{ item.remarks?item.remarks:'暂无描述' }}</span>
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ <el-select v-model="itemmaterial" placeholder="选择材质" size="small" clearable class="inline-24 bottom-margin" @change="queryChange">
|
|
|
+ <el-option
|
|
|
+ v-for="item in options.itemmaterials"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.value"
|
|
|
+ :value="item.value">
|
|
|
+ <span style="float: left">{{ item.value }}</span>
|
|
|
+ <span style="float: right; color: #8492a6; font-size: 12px">{{ item.remarks?item.remarks:'暂无描述' }}</span>
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ <el-input style="width:200px;" placeholder="型号" :suffix-icon="params.content.where.model?params.content.where.model.length > 0?'':'':'el-icon-search'" v-model="params.content.where.model" @keyup.native.enter="listData(params.content.pageNumber = 1)" @clear="listData(params.content.pageNumber = 1)" size="small" class="bottom-margin input-with-select inline-24 layout_search__panel" clearable>
|
|
|
+ </el-input>
|
|
|
+ <el-input style="width:200px;" placeholder="规格" :suffix-icon="params.content.where.spec?params.content.where.spec.length > 0?'':'':'el-icon-search'" v-model="params.content.where.spec" @keyup.native.enter="listData(params.content.pageNumber = 1)" @clear="listData(params.content.pageNumber = 1)" size="small" class="bottom-margin input-with-select inline-24 layout_search__panel" clearable>
|
|
|
+ </el-input>
|
|
|
+ </div>
|
|
|
+ <div >
|
|
|
+ <tableTemp :data="list" :layout="tablecolsAdd" :opwidth="200" :custom="true" height="calc(100vh - 370px)" @checkboxCallBack="checkboxCallBack" fixedName="amount,isoffer,operation">
|
|
|
+ <template v-slot:customcol="scope">
|
|
|
+ <div v-if="scope.column.columnname === 'discountrate'">
|
|
|
+ <span v-if="scope.column.data.discountDifferenceAmount < 0" style="color: red">
|
|
|
+ {{Math.round(((scope.column.data[scope.column.columnname])*100)*100)/100}}
|
|
|
+ </span>
|
|
|
+ <span v-else style="color: #44d50c">
|
|
|
+ {{Math.round(((scope.column.data[scope.column.columnname])*100)*100)/100}}
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ <div v-else-if="scope.column.columnname === 'mindiscountrate'">
|
|
|
+ <span>{{Math.round(((scope.column.data[scope.column.columnname])*100)*100)/100}}</span>
|
|
|
+ </div>
|
|
|
+ <div v-else-if="scope.column.columnname === 'marketprice'">
|
|
|
+ <span>{{tool.formatAmount(scope.column.data[scope.column.columnname],2)}}</span>
|
|
|
+ </div>
|
|
|
+ <div v-else-if="scope.column.columnname === 'price'">
|
|
|
+ <span v-if="scope.column.data.discountDifferenceAmount < 0" style="color: red">
|
|
|
+ {{tool.formatAmount(scope.column.data[scope.column.columnname],2)}}
|
|
|
+ </span>
|
|
|
+ <span v-else style="color: #44d50c">
|
|
|
+ {{tool.formatAmount(scope.column.data[scope.column.columnname],2)}}
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ <div v-else-if="scope.column.columnname === 'discountDifferenceAmount'">
|
|
|
+ <span v-if="scope.column.data.discountDifferenceAmount < 0" style="color: red">
|
|
|
+ {{tool.formatAmount(scope.column.data[scope.column.columnname],2)}}
|
|
|
+ </span>
|
|
|
+ <span v-else style="color: #44d50c">
|
|
|
+ {{tool.formatAmount(scope.column.data[scope.column.columnname],2)}}
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ <div v-else-if="scope.column.columnname === 'amount'">
|
|
|
+ <span v-if="scope.column.data.discountDifferenceAmount < 0" style="color: red">
|
|
|
+ {{tool.formatAmount(scope.column.data[scope.column.columnname],2)}}
|
|
|
+ </span>
|
|
|
+ <span v-else style="color: #44d50c">
|
|
|
+ {{tool.formatAmount(scope.column.data[scope.column.columnname],2)}}
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ <div v-else-if="scope.column.columnname === 'isoffer'">
|
|
|
+ <span v-if="scope.column.data.discountDifferenceAmount < 0">
|
|
|
+ <span style="color: red">
|
|
|
+ 是
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ <span v-else>
|
|
|
+ <span>
|
|
|
+ 否
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ <p v-else>{{scope.column.data[scope.column.columnname]}}</p>
|
|
|
+ </template>
|
|
|
+ <template v-slot:opreation="scope">
|
|
|
+ <el-button type="text" size="mini" @click="addProduct(scope)">添 加</el-button>
|
|
|
+ </template>
|
|
|
+ </tableTemp>
|
|
|
+ <div class="container normal-panel" style="text-align:right">
|
|
|
+ <el-pagination
|
|
|
+ background
|
|
|
+ @size-change="handleSizeChange"
|
|
|
+ @current-change="handleCurrentChange"
|
|
|
+ :current-page="params.content.pageNumber"
|
|
|
+ :page-sizes="[20, 50, 100, 200]"
|
|
|
+ :page-size="100"
|
|
|
+ layout="total,sizes, prev, pager, next, jumper"
|
|
|
+ :total="total">
|
|
|
+ </el-pagination>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-drawer>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import tableTemp from './table'
|
|
|
+import uploadAllData from '@/components/uploadAllData/index'
|
|
|
+
|
|
|
+export default {
|
|
|
+ name: "index",
|
|
|
+ props:["data","tradefield","discountrate","title","tablecolsAdd","sa_projectid","querySa_brandid"],
|
|
|
+ components:{tableTemp,uploadAllData},
|
|
|
+ data(){
|
|
|
+ return {
|
|
|
+ billno:'',
|
|
|
+ dialogFormVisible:false,
|
|
|
+ queryShow:false,
|
|
|
+ sa_brandid:'',
|
|
|
+ itemclassid:'',
|
|
|
+ itemstandard:'',
|
|
|
+ itemmaterial:'',
|
|
|
+ list:[],
|
|
|
+ total:0,
|
|
|
+ options:{
|
|
|
+ brands:[],
|
|
|
+ itemclass:[],
|
|
|
+ itemstandards:[],
|
|
|
+ itemmaterials:[]
|
|
|
+ },
|
|
|
+ items:[],
|
|
|
+ quotationParams:{
|
|
|
+ "id": 20221222151302,
|
|
|
+ "content": {
|
|
|
+ "sa_projectid": '',
|
|
|
+ "pageNumber": 1,
|
|
|
+ "pageSize": 20,
|
|
|
+ "where": {
|
|
|
+ "condition": ""
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+ params:{
|
|
|
+ "id": 20221123162902,
|
|
|
+ "content": {
|
|
|
+ "sa_contractid": this.$route.query.id,
|
|
|
+ "sa_quotedpriceid":'',
|
|
|
+ "pageNumber": 1,
|
|
|
+ "pageSize": 100,
|
|
|
+ "nocache":true,
|
|
|
+ "where": {
|
|
|
+ "condition": ""
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+ quotationData:[]
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods:{
|
|
|
+ onShow(){
|
|
|
+ this.dialogFormVisible = true
|
|
|
+ this.$store.dispatch('optiontypeselect','itemstandards').then(res=>{
|
|
|
+ this.options.itemstandards = res.data
|
|
|
+ })
|
|
|
+ this.$store.dispatch('optiontypeselect','itemmaterial').then(res=>{
|
|
|
+ this.options.itemmaterials = res.data
|
|
|
+ })
|
|
|
+ this.querySa_brandid !== '' ?this.sa_brandid = this.querySa_brandid : this.sa_brandid = ''
|
|
|
+ this.queryBrands()
|
|
|
+ this.queryClass()
|
|
|
+ /*this.listData()*/
|
|
|
+ },
|
|
|
+ /*获取报价单*/
|
|
|
+ async queryQuotationData(){
|
|
|
+ this.quotationParams.content.sa_projectid = this.data.sa_projectid
|
|
|
+ const res = await this.$api.requested(this.quotationParams)
|
|
|
+ console.log(res,'报价单')
|
|
|
+ this.quotationData = res.data
|
|
|
+ },
|
|
|
+ /*选择报价单*/
|
|
|
+ rowClick(val){
|
|
|
+ console.log(val,'选择的报价单')
|
|
|
+ this.billno = val.billno
|
|
|
+ this.queryShow = false
|
|
|
+ this.params.content.sa_quotedpriceid = val.sa_quotedpriceid
|
|
|
+ this.listData()
|
|
|
+ },
|
|
|
+ /*可添加商品*/
|
|
|
+ async listData(){
|
|
|
+ console.log(this.tradefield,'领域')
|
|
|
+ this.params.content.where.tradefield = this.tradefield
|
|
|
+ const res = await this.$api.requested(this.params)
|
|
|
+ this.list = res.data
|
|
|
+ this.total = res.total
|
|
|
+ },
|
|
|
+ /*获取品牌*/
|
|
|
+ async queryBrands () {
|
|
|
+ const res = await this.$api.requested({
|
|
|
+ "id": "20220924163702",
|
|
|
+ "content": {
|
|
|
+ "pageSize":1000,
|
|
|
+ "where":{
|
|
|
+ "condition":""
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.options.brands = res.data
|
|
|
+ },
|
|
|
+ brandChange(){
|
|
|
+ this.params.content.where.sa_brandid = this.sa_brandid
|
|
|
+ this.listData()
|
|
|
+ this.queryClass()
|
|
|
+ },
|
|
|
+ /*获取分类*/
|
|
|
+ async queryClass () {
|
|
|
+ const res = await this.$api.requested({
|
|
|
+ "id":"20220922110403",
|
|
|
+ "content":{
|
|
|
+ "sa_brandid":this.sa_brandid !== '' ? this.sa_brandid : 0
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.options.itemclass = res.data[0].ttemclass
|
|
|
+
|
|
|
+ },
|
|
|
+ classChange(){
|
|
|
+ this.params.content.where.itemclassid = this.itemclassid[this.itemclassid.length -1]
|
|
|
+ this.listData()
|
|
|
+ },
|
|
|
+ queryChange(){
|
|
|
+ this.params.content.where.standards = this.itemstandard
|
|
|
+ this.params.content.where.material = this.itemmaterial
|
|
|
+ this.listData()
|
|
|
+ },
|
|
|
+ /*拉取数据*/
|
|
|
+ handlePullApi (pullApi) {
|
|
|
+ pullApi.content = JSON.parse(JSON.stringify(this.params.content))
|
|
|
+ pullApi.id = this.params.id
|
|
|
+ /*pullApi.content.sa_projectid = this.$route.query.id*/
|
|
|
+ },
|
|
|
+ /*上传数据*/
|
|
|
+ handleUploadApi (uploadApi,data) {
|
|
|
+ this.$emit('uploadData',uploadApi,data)
|
|
|
+ },
|
|
|
+ /*勾选*/
|
|
|
+ checkboxCallBack(val){
|
|
|
+ this.items = val
|
|
|
+ },
|
|
|
+ /*批量添加*/
|
|
|
+ batchAdd(){
|
|
|
+ console.log(this.items,'item')
|
|
|
+ this.$emit('addSuccess',this.items)
|
|
|
+ },
|
|
|
+ /*添加商品*/
|
|
|
+ addProduct(val){
|
|
|
+ console.log(val,'添加商品')
|
|
|
+ this.items = val
|
|
|
+ this.$emit('addProduct',this.items.data)
|
|
|
+ },
|
|
|
+ onSuccess () {
|
|
|
+ console.log('成功')
|
|
|
+ this.listData()
|
|
|
+ },
|
|
|
+ onClose(){
|
|
|
+ this.dialogFormVisible = false
|
|
|
+ this.$emit("closeDrawer")
|
|
|
+ },
|
|
|
+ handleSizeChange(val) {
|
|
|
+ // console.log(`每页 ${val} 条`);
|
|
|
+ this.params.content.pageSize = val
|
|
|
+ this.listData()
|
|
|
+ },
|
|
|
+ handleCurrentChange(val) {
|
|
|
+ // console.log(`当前页: ${val}`);
|
|
|
+ this.params.content.pageNumber = val
|
|
|
+ this.listData()
|
|
|
+ },
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+ .top-margin{
|
|
|
+ margin-top: 20px;
|
|
|
+ }
|
|
|
+ .bottom-margin{
|
|
|
+ margin-bottom: 20px;
|
|
|
+ }
|
|
|
+ /deep/ input::-webkit-input-placeholder {
|
|
|
+ color: #58585d;
|
|
|
+ }
|
|
|
+ /deep/ input::-moz-input-placeholder {
|
|
|
+ color: #58585d;
|
|
|
+ }
|
|
|
+ /deep/ input::-ms-input-placeholder {
|
|
|
+ color: #58585d;
|
|
|
+ }
|
|
|
+ .header-title {
|
|
|
+ font-size:14px;
|
|
|
+ margin-right:10px;
|
|
|
+ position: relative;
|
|
|
+ margin-left: 10px;
|
|
|
+ color: #000000;
|
|
|
+ }
|
|
|
+ .header-title::before {
|
|
|
+ display: inline-block;
|
|
|
+ content: '*';
|
|
|
+ color: red;
|
|
|
+ position: absolute;
|
|
|
+ left: -10px;
|
|
|
+ }
|
|
|
+</style>
|