Skip to content

肖康 / cloudSystem

Go to a project
Commit 19eef856 by LJM
Options

js

parent c3f4c8df
Inline Side-by-side
Showing with 1283 additions and 0 deletions
src/assets/css/store/goodslist.less 0 → 100644
.store-con {
background: #FFFFFF;
border-radius: 4px;
border: 1px solid #E5EBF6;
padding: 20px;
.search-btn {
cursor: pointer;
width: 76px;
height: 37px;
line-height: 37px;
background: #1969F9;
border-radius: 2px;
font-size: 14px;
color: #fff;
text-align: center;
&:hover {
background: #0050E0;
}
}
.btn-nav {
margin-top: 11px;
margin-bottom: 22px;
.update {
width: 66px;
height: 26px;
line-height: 26px;
text-align: center;
background: #FFEEDD;
border: 1px solid #FF870D;
border-radius: 2px;
color: #FF870D;
font-size: 14px;
cursor: pointer;
width: 66px;
i {
margin-left: 3px;
}
&:hover {
background: #FCA955;
color: #fff;
}
}
.dcg {
width: 66px;
height: 26px;
border-radius: 2px;
text-align: center;
line-height: 26px;
border: 1px solid #1969F9;
background: #E5EEFF;
color: #1969F9;
margin-left: 10px;
font-size: 14px;
transition: all 0.5s;
&:hover {
background: #1969F9;
cursor: pointer;
color: #fff;
}
&.heti {
width: 56px;
background: #fff;
&:hover {
background: #E5EEFF;
color: #1969F9;
}
}
&.xjk {
position: relative;
left: -11px;
border-left: 1px solid #1969F9;
&:hover {
border-left: 1px solid #1969F9;
}
}
}
}
.updatebox {
position: relative;
.selectdw {
height: 36px;
width: 36px;
position: absolute;
top: 1px;
right: 2px;
.el-select {
width: 36px;
border-left: 1px solid #C0C4CC;
input {
border: 0px;
padding: 0px;
height: 36px;
width: 36px;
font-size: 14px;
color: #333;
text-align: center;
}
.el-input__prefix, .el-input__suffix {
display: none !important;
}
}
}
}
.price-more {
.more-search-btn {
width: 70px;
height: 26px;
background: #F1F4FA;
border-radius: 2px;
border: 1px solid #BEC9DF;
font-size: 12px;
color: #1969F9;
text-align: center;
transition: all 0.5s;
position: relative;
cursor: pointer;
&:hover {
border: 1px solid #1969F9;
}
}
}
}
.bestGoodsList-dialog {
table {
width: 100%;
tr {
.required {
color: red;
}
th {
position: relative;
padding: 9px 15px;
min-height: 20px;
line-height: 20px;
font-size: 12px;
border-width: 1px;
border-style: solid;
border-color: #eee;
color: #5f5f5f;
white-space: nowrap;
}
td {
position: relative;
padding: 9px 15px;
min-height: 20px;
line-height: 20px;
font-size: 12px;
border-width: 1px;
border-style: solid;
border-color: #eee;
color: #5f5f5f;
.el-select {
width: 88px;
}
.el-input__inner {
padding-left: 4px !important;
font-size: 12px !important;
}
}
}
}
.add {
margin-top: 20px;
color: #409EFF;
cursor: pointer;
}
}
.batch-layer {
width: 100%;
.batch-box {
flex: 0 0 33.3%;
border-bottom: 1px solid #eee;
.title {
width: 100%;
height: 30px;
border-bottom: 1px solid #eee;
i {
cursor: pointer;
}
}
.content {
padding-top: 8px;
padding-bottom: 8px;
border-bottom: 1px solid #eee;
border-right: 1px solid #eee;
width: 100%;
.period-list {
height: 240px;
flex-wrap: wrap;
padding: 0 7px;
li {
width: 36px;
height: 30px;
line-height: 30px;
color: #666;
cursor: pointer;
font-size: 13px;
transition: all 0.4s ease-in-out;
&:hover, &.curr {
color: #FFF;
background-color: #409EFF;
}
}
}
.year-list {
height: 240px;
flex-wrap: wrap;
padding: 0 7px;
li {
flex: 0 0 33.3%;
height: 30px;
line-height: 30px;
color: #666;
cursor: pointer;
font-size: 13px;
margin: 10px 0;
transition: all 0.4s ease-in-out;
&:hover, &.curr {
color: #FFF;
background-color: #409EFF;
}
}
}
}
.footer-btn {
padding-right: 10px;
height: 44px;
justify-content: flex-end;
border-right: 1px solid #eee;
}
}
}
\ No newline at end of file
src/assets/css/store/goodslist.min.css 0 → 100644
.store-con {
background: #FFFFFF;
border-radius: 4px;
border: 1px solid #E5EBF6;
padding: 20px;
}
.store-con .search-btn {
cursor: pointer;
width: 76px;
height: 37px;
line-height: 37px;
background: #1969F9;
border-radius: 2px;
font-size: 14px;
color: #fff;
text-align: center;
}
.store-con .search-btn:hover {
background: #0050E0;
}
.store-con .btn-nav {
margin-top: 11px;
margin-bottom: 22px;
}
.store-con .btn-nav .update {
height: 26px;
line-height: 26px;
text-align: center;
background: #FFEEDD;
border: 1px solid #FF870D;
border-radius: 2px;
color: #FF870D;
font-size: 14px;
cursor: pointer;
width: 66px;
}
.store-con .btn-nav .update i {
margin-left: 3px;
}
.store-con .btn-nav .update:hover {
background: #FCA955;
color: #fff;
}
.store-con .btn-nav .dcg {
width: 66px;
height: 26px;
border-radius: 2px;
text-align: center;
line-height: 26px;
border: 1px solid #1969F9;
background: #E5EEFF;
color: #1969F9;
margin-left: 10px;
font-size: 14px;
transition: all 0.5s;
}
.store-con .btn-nav .dcg:hover {
background: #1969F9;
cursor: pointer;
color: #fff;
}
.store-con .btn-nav .dcg.heti {
width: 56px;
background: #fff;
}
.store-con .btn-nav .dcg.heti:hover {
background: #E5EEFF;
color: #1969F9;
}
.store-con .btn-nav .dcg.xjk {
position: relative;
left: -11px;
border-left: 1px solid #1969F9;
}
.store-con .btn-nav .dcg.xjk:hover {
border-left: 1px solid #1969F9;
}
.store-con .updatebox {
position: relative;
}
.store-con .updatebox .selectdw {
height: 36px;
width: 36px;
position: absolute;
top: 1px;
right: 2px;
}
.store-con .updatebox .selectdw .el-select {
width: 36px;
border-left: 1px solid #C0C4CC;
}
.store-con .updatebox .selectdw .el-select input {
border: 0px;
padding: 0px;
height: 36px;
width: 36px;
font-size: 14px;
color: #333;
text-align: center;
}
.store-con .updatebox .selectdw .el-select .el-input__prefix,
.store-con .updatebox .selectdw .el-select .el-input__suffix {
display: none !important;
}
.store-con .price-more .more-search-btn {
width: 70px;
height: 26px;
background: #F1F4FA;
border-radius: 2px;
border: 1px solid #BEC9DF;
font-size: 12px;
color: #1969F9;
text-align: center;
transition: all 0.5s;
position: relative;
cursor: pointer;
}
.store-con .price-more .more-search-btn:hover {
border: 1px solid #1969F9;
}
.bestGoodsList-dialog table {
width: 100%;
}
.bestGoodsList-dialog table tr .required {
color: red;
}
.bestGoodsList-dialog table tr th {
position: relative;
padding: 9px 15px;
min-height: 20px;
line-height: 20px;
font-size: 12px;
border-width: 1px;
border-style: solid;
border-color: #eee;
color: #5f5f5f;
white-space: nowrap;
}
.bestGoodsList-dialog table tr td {
position: relative;
padding: 9px 15px;
min-height: 20px;
line-height: 20px;
font-size: 12px;
border-width: 1px;
border-style: solid;
border-color: #eee;
color: #5f5f5f;
}
.bestGoodsList-dialog table tr td .el-select {
width: 88px;
}
.bestGoodsList-dialog table tr td .el-input__inner {
padding-left: 4px !important;
font-size: 12px !important;
}
.bestGoodsList-dialog .add {
margin-top: 20px;
color: #409EFF;
cursor: pointer;
}
.batch-layer {
width: 100%;
}
.batch-layer .batch-box {
flex: 0 0 33.3%;
border-bottom: 1px solid #eee;
}
.batch-layer .batch-box .title {
width: 100%;
height: 30px;
border-bottom: 1px solid #eee;
}
.batch-layer .batch-box .title i {
cursor: pointer;
}
.batch-layer .batch-box .content {
padding-top: 8px;
padding-bottom: 8px;
border-bottom: 1px solid #eee;
border-right: 1px solid #eee;
width: 100%;
}
.batch-layer .batch-box .content .period-list {
height: 240px;
flex-wrap: wrap;
padding: 0 7px;
}
.batch-layer .batch-box .content .period-list li {
width: 36px;
height: 30px;
line-height: 30px;
color: #666;
cursor: pointer;
font-size: 13px;
transition: all 0.4s ease-in-out;
}
.batch-layer .batch-box .content .period-list li:hover,
.batch-layer .batch-box .content .period-list li.curr {
color: #FFF;
background-color: #409EFF;
}
.batch-layer .batch-box .content .year-list {
height: 240px;
flex-wrap: wrap;
padding: 0 7px;
}
.batch-layer .batch-box .content .year-list li {
flex: 0 0 33.3%;
height: 30px;
line-height: 30px;
color: #666;
cursor: pointer;
font-size: 13px;
margin: 10px 0;
transition: all 0.4s ease-in-out;
}
.batch-layer .batch-box .content .year-list li:hover,
.batch-layer .batch-box .content .year-list li.curr {
color: #FFF;
background-color: #409EFF;
}
.batch-layer .batch-box .footer-btn {
padding-right: 10px;
height: 44px;
justify-content: flex-end;
border-right: 1px solid #eee;
}
/*# sourceMappingURL=goodslist.min.css.map */
\ No newline at end of file
src/assets/css/store/goodslist.min.css.map 0 → 100644
{"version":3,"sources":["goodslist.less"],"names":[],"mappings":"AAAA;EACE,mBAAA;EACA,kBAAA;EACA,yBAAA;EACA,aAAA;;AAJF,UAME;EACE,eAAA;EACA,WAAA;EACA,YAAA;EACA,iBAAA;EACA,mBAAA;EACA,kBAAA;EACA,eAAA;EACA,WAAA;EACA,kBAAA;;AAEA,UAXF,YAWG;EACC,mBAAA;;AAlBN,UAsBE;EACE,gBAAA;EACA,mBAAA;;AAxBJ,UAsBE,SAIE;EAEE,YAAA;EACA,iBAAA;EACA,kBAAA;EACA,mBAAA;EACA,yBAAA;EACA,kBAAA;EACA,cAAA;EACA,eAAA;EACA,eAAA;EACA,WAAA;;AArCN,UAsBE,SAIE,QAaE;EACE,gBAAA;;AAGF,UArBJ,SAIE,QAiBG;EAEC,mBAAA;EACA,WAAA;;AA9CR,UAsBE,SA6BE;EACE,WAAA;EACA,YAAA;EACA,kBAAA;EACA,kBAAA;EACA,iBAAA;EACA,yBAAA;EACA,mBAAA;EACA,cAAA;EACA,iBAAA;EACA,eAAA;EACA,oBAAA;;AAEA,UA1CJ,SA6BE,KAaG;EACC,mBAAA;EACA,eAAA;EACA,WAAA;;AAGF,UAhDJ,SA6BE,KAmBG;EACC,WAAA;EACA,gBAAA;;AAEA,UApDN,SA6BE,KAmBG,KAIE;EACC,mBAAA;EACA,cAAA;;AAIJ,UA1DJ,SA6BE,KA6BG;EACC,kBAAA;EACA,WAAA;EACA,8BAAA;;AAEA,UA/DN,SA6BE,KA6BG,IAKE;EACC,8BAAA;;AAtFV,UA4FE;EACE,kBAAA;;AA7FJ,UA4FE,WAGE;EACE,YAAA;EACA,WAAA;EAEA,kBAAA;EACA,QAAA;EACA,UAAA;;AArGN,UA4FE,WAGE,UAQE;EACE,WAAA;EACA,8BAAA;;AAzGR,UA4FE,WAGE,UAQE,WAIE;EACE,WAAA;EACA,YAAA;EACA,YAAA;EACA,WAAA;EACA,eAAA;EACA,WAAA;EACA,kBAAA;;AAlHV,UA4FE,WAGE,UAQE,WAeE;AAtHR,UA4FE,WAGE,UAQE,WAeqB;EACjB,wBAAA;;AAvHV,UA8HE,YACE;EACE,WAAA;EACA,YAAA;EACA,mBAAA;EACA,kBAAA;EACA,yBAAA;EACA,eAAA;EACA,cAAA;EACA,kBAAA;EACA,oBAAA;EACA,kBAAA;EACA,eAAA;;AAEA,UAdJ,YACE,iBAaG;EACC,yBAAA;;AAQR,qBACE;EACE,WAAA;;AAFJ,qBACE,MAGE,GACE;EACE,UAAA;;AANR,qBACE,MAGE,GAKE;EACE,kBAAA;EACA,iBAAA;EACA,gBAAA;EACA,iBAAA;EACA,eAAA;EACA,iBAAA;EACA,mBAAA;EACA,kBAAA;EACA,cAAA;EACA,mBAAA;;AAnBR,qBACE,MAGE,GAkBE;EACE,kBAAA;EACA,iBAAA;EACA,gBAAA;EACA,iBAAA;EACA,eAAA;EACA,iBAAA;EACA,mBAAA;EACA,kBAAA;EACA,cAAA;;AA/BR,qBACE,MAGE,GAkBE,GAWE;EACE,WAAA;;AAlCV,qBACE,MAGE,GAkBE,GAeE;EACE,4BAAA;EACA,0BAAA;;AAvCV,qBA6CE;EACE,gBAAA;EACA,cAAA;EACA,eAAA;;AAIJ;EACE,WAAA;;AADF,YAGE;EACE,eAAA;EACA,6BAAA;;AALJ,YAGE,WAIE;EACE,WAAA;EACA,YAAA;EACA,6BAAA;;AAVN,YAGE,WAIE,OAKE;EACE,eAAA;;AAbR,YAGE,WAeE;EACE,gBAAA;EACA,mBAAA;EACA,6BAAA;EACA,4BAAA;EAEA,WAAA;;AAxBN,YAGE,WAeE,SAQE;EACE,aAAA;EACA,eAAA;EACA,cAAA;;AA7BR,YAGE,WAeE,SAQE,aAKE;EACE,WAAA;EACA,YAAA;EACA,iBAAA;EACA,WAAA;EACA,eAAA;EACA,eAAA;EACA,gCAAA;;AAEA,YArCR,WAeE,SAQE,aAKE,GASG;AAAQ,YArCjB,WAeE,SAQE,aAKE,GASY;EACR,WAAA;EACA,yBAAA;;AA1CZ,YAGE,WAeE,SA6BE;EACE,aAAA;EACA,eAAA;EACA,cAAA;;AAlDR,YAGE,WAeE,SA6BE,WAKE;EACE,eAAA;EACA,YAAA;EACA,iBAAA;EACA,WAAA;EACA,eAAA;EACA,eAAA;EACA,cAAA;EACA,gCAAA;;AAEA,YA3DR,WAeE,SA6BE,WAKE,GAUG;AAAQ,YA3DjB,WAeE,SA6BE,WAKE,GAUY;EACR,WAAA;EACA,yBAAA;;AAhEZ,YAGE,WAmEE;EACE,mBAAA;EACA,YAAA;EACA,yBAAA;EACA,4BAAA","file":"goodslist.min.css"}
\ No newline at end of file
src/views/Store/goodslist.vue 0 → 100644
<template>
<section class="store pagex">
<div class="store-con">
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item label="型号">
<el-autocomplete v-model="formInline.goods_name" :trigger-on-focus="false" @keyup.enter.native="onSubmit" :fetch-suggestions="querySearchAsync" placeholder="请输入型号"></el-autocomplete>
</el-form-item>
<el-form-item label="品牌">
<el-autocomplete v-model="formInline.brand_name" :trigger-on-focus="false" @keyup.enter.native="onSubmit" :fetch-suggestions="querySearchAsyncBrand" placeholder="请输入品牌"></el-autocomplete>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit">搜索</el-button>
</el-form-item>
</el-form>
<div class="btn-nav clr">
<el-button type="primary" @click="addBestgoodsChange">新增</el-button>
<el-button type="primary" @click="updateBestgoods">修改</el-button>
<el-button type="danger" @click="delBestgoods">删除</el-button>
<el-button type="primary">参与询价</el-button>
<el-button type="primary">不参与询价</el-button>
</div>
<div class="data-box">
<el-table :data="list" border style="width: 100%" @selection-change="handleSelectionChange">
<el-table-column fixed type="selection" width="37"></el-table-column>
<el-table-column prop="goods_name" label="型号" :show-overflow-tooltip="true"></el-table-column>
<el-table-column prop="brand_name" label="品牌" :show-overflow-tooltip="true"></el-table-column>
<el-table-column prop="start_order_number" label="起订量" width="120" :show-overflow-tooltip="true"></el-table-column>
<el-table-column prop="currency_str" label="币种" width="120" :show-overflow-tooltip="true"></el-table-column>
<el-table-column prop="price_origin" label="价格" width="120" :show-overflow-tooltip="true"></el-table-column>
<el-table-column prop="batch" label="批次" width="120" :show-overflow-tooltip="true"></el-table-column>
<el-table-column prop="stock_number" label="库存" width="120" :show-overflow-tooltip="true"></el-table-column>
<el-table-column prop="join_inquiry_str" label="状态" width="120" :show-overflow-tooltip="true">
<template slot-scope="scope">
<el-tag :type="scope.row.join_inquiry === 1 ? 'success' : 'primary'" disable-transitions>{{scope.row.join_inquiry_str}}</el-tag>
</template>
</el-table-column>
<el-table-column prop="create_time" label="创建时间" width="160" :show-overflow-tooltip="true"></el-table-column>
</el-table>
<el-pagination layout="prev, pager, next,jumper" :page-size="limit" :total="total" @current-change="handleCurrentChange" :current-page="page"></el-pagination>
</div>
</div>
<Menu/>
<el-dialog title="新增优势货源" :close-on-click-modal="false" :visible.sync="addBestgoods.dialogVisible" width="1000px">
<div class="dialog-form bestGoodsList-dialog">
<table>
<tbody>
<tr>
<th align="left" width="150">
<em class="required">*</em>
<span>型号</span>
</th>
<th align="left" width="200">
<em class="required">*</em>
<span>品牌</span>
</th>
<th align="left" width="50">
<em class="required">*</em>
<span>起订量</span>
</th>
<th align="left">
<span>币种</span>
</th>
<th align="left" width="80">
<span>价格</span>
</th>
<th align="left" width="90">
<span>批次</span>
</th>
<th align="left" width="50">
<span>库存</span>
</th>
<th align="left" width="50">
<span>操作</span>
</th>
</tr>
<tr v-for="(item,index) in addBestgoodsParam">
<td>
<el-autocomplete v-model="addBestgoodsParam[index].goods_name" :trigger-on-focus="false" :fetch-suggestions="querySearchAsync" placeholder="型号"></el-autocomplete>
</td>
<td>
<el-autocomplete v-model="addBestgoodsParam[index].brand_name" :trigger-on-focus="false" :fetch-suggestions="querySearchAsyncBrand" placeholder="品牌"></el-autocomplete>
</td>
<td>
<el-input v-model="addBestgoodsParam[index].start_order_number" placeholder="个"></el-input>
</td>
<td>
<el-select v-model="addBestgoodsParam[index].currency" placeholder="请选择">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option>
</el-select>
</td>
<td>
<el-input v-model="addBestgoodsParam[index].price_origin" placeholder="0.00000"></el-input>
</td>
<td>
<el-popover placement="bottom" width="800" trigger="click" v-model="visible[index]">
<div class="row batch-layer">
<div class="batch-box verCenter">
<div class="title row bothSide verCenter">
<i class="el-icon-arrow-left" @click="prevChange"></i>
<span>年份</span>
<i class="el-icon-arrow-right" @click="nextChange"></i>
</div>
<div class="content row">
<ul class="row year-list">
<li class="row rowCenter verCenter" v-for="(v,indexY) in year" :class="{curr:yearIndex==indexY}" @click="tabChange(indexY,1)">{{v}}年</li>
</ul>
</div>
<div class="footer-btn row verCenter">
<el-button size="mini" round @click="clear(1,index)">清空</el-button>
<el-button size="mini" round @click="confirm(1,year[yearIndex],index)">确定</el-button>
</div>
</div>
<div class="batch-box verCenter">
<div class="title row rowCenter verCenter">
<span>第一周期</span>
</div>
<div class="content row">
<ul class="row period-list">
<li class="row rowCenter verCenter" v-for="(v,indexY) in period" :class="{curr:periodIndex==indexY}" @click="tabChange(indexY,2)">{{v}}</li>
</ul>
</div>
<div class="footer-btn row verCenter">
<el-button size="mini" round @click="clear(1,index)">清空</el-button>
<el-button size="mini" round @click="confirm(2,period[periodIndex],index)">确定</el-button>
</div>
</div>
<div class="batch-box verCenter">
<div class="title row rowCenter verCenter">
<span>第二周期</span>
</div>
<div class="content row">
<ul class="row period-list">
<li class="row rowCenter verCenter" v-for="(v,indexY) in period" :class="{curr:periodIndexTwo==indexY}" @click="tabChange(indexY,3)">{{v}}</li>
</ul>
</div>
<div class="footer-btn row verCenter">
<el-button size="mini" round @click="clear(1,index)">清空</el-button>
<el-button size="mini" round @click="confirm(3,period[periodIndexTwo],index)">确定</el-button>
</div>
</div>
</div>
<el-input slot="reference" :readonly="readonly" v-model="addBestgoodsParam[index].batch" placeholder="批次" @click.native="batchChange(index)"></el-input>
</el-popover>
</td>
<td>
<el-input v-model="addBestgoodsParam[index].stock_number" placeholder="个"></el-input>
</td>
<td>
<el-button type="danger" @click="reduceRow(index)">删除</el-button>
</td>
</tr>
</tbody>
</table>
<i class="el-icon-plus add" @click="addRow">增加行</i>
</div>
<div slot="footer" class="dialog-footer">
<el-button @click="addBestgoods.dialogVisible = false">取 消</el-button>
<el-button type="primary" @click="addBestgoodsSubmit">确 定</el-button>
</div>
</el-dialog>
<el-dialog title="修改优势货源" :close-on-click-modal="false" :visible.sync="addBestgoods.dialogVisibleUpdate" width="1000px">
<div class="dialog-form bestGoodsList-dialog">
<table>
<tbody>
<tr>
<th align="left" width="150">
<em class="required">*</em>
<span>型号</span>
</th>
<th align="left" width="200">
<em class="required">*</em>
<span>品牌</span>
</th>
<th align="left" width="50">
<em class="required">*</em>
<span>起订量</span>
</th>
<th align="left">
<span>币种</span>
</th>
<th align="left" width="80">
<span>价格</span>
</th>
<th align="left" width="90">
<span>批次</span>
</th>
<th align="left" width="50">
<span>库存</span>
</th>
</tr>
<tr v-for="(item,index) in updateBestgoodsParam">
<td>
<el-autocomplete v-model="updateBestgoodsParam[index].goods_name" :trigger-on-focus="false" :fetch-suggestions="querySearchAsync" placeholder="型号"></el-autocomplete>
</td>
<td>
<el-autocomplete v-model="updateBestgoodsParam[index].brand_name" :trigger-on-focus="false" :fetch-suggestions="querySearchAsyncBrand" placeholder="品牌"></el-autocomplete>
</td>
<td>
<el-input v-model="updateBestgoodsParam[index].start_order_number" placeholder="个"></el-input>
</td>
<td>
<el-select v-model="updateBestgoodsParam[index].currency" placeholder="请选择">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option>
</el-select>
</td>
<td>
<el-input v-model="updateBestgoodsParam[index].price_origin" placeholder="0.00000"></el-input>
</td>
<td>
<el-popover placement="bottom" width="800" trigger="click" v-model="visibleUpdate[index]">
<div class="row batch-layer">
<div class="batch-box verCenter">
<div class="title row bothSide verCenter">
<i class="el-icon-arrow-left" @click="prevChange"></i>
<span>年份</span>
<i class="el-icon-arrow-right" @click="nextChange"></i>
</div>
<div class="content row">
<ul class="row year-list">
<li class="row rowCenter verCenter" v-for="(v,indexY) in year" :class="{curr:yearIndex==indexY}" @click="tabChange(indexY,1)">{{v}}年</li>
</ul>
</div>
<div class="footer-btn row verCenter">
<el-button size="mini" round @click="clear(2,index)">清空</el-button>
<el-button size="mini" round @click="confirmUpdate(1,year[yearIndex],index)">确定</el-button>
</div>
</div>
<div class="batch-box verCenter">
<div class="title row rowCenter verCenter">
<span>第一周期</span>
</div>
<div class="content row">
<ul class="row period-list">
<li class="row rowCenter verCenter" v-for="(v,indexY) in period" :class="{curr:periodIndex==indexY}" @click="tabChange(indexY,2)">{{v}}</li>
</ul>
</div>
<div class="footer-btn row verCenter">
<el-button size="mini" round @click="clear(2,index)">清空</el-button>
<el-button size="mini" round @click="confirmUpdate(2,period[periodIndex],index)">确定</el-button>
</div>
</div>
<div class="batch-box verCenter">
<div class="title row rowCenter verCenter">
<span>第二周期</span>
</div>
<div class="content row">
<ul class="row period-list">
<li class="row rowCenter verCenter" v-for="(v,indexY) in period" :class="{curr:periodIndexTwo==indexY}" @click="tabChange(indexY,3)">{{v}}</li>
</ul>
</div>
<div class="footer-btn row verCenter">
<el-button size="mini" round @click="clear(2,index)">清空</el-button>
<el-button size="mini" round @click="confirmUpdate(3,period[periodIndexTwo],index)">确定</el-button>
</div>
</div>
</div>
<el-input slot="reference" :readonly="readonly" v-model="updateBestgoodsParam[index].batch" placeholder="批次" @click.native="batchChange(index)"></el-input>
</el-popover>
</td>
<td>
<el-input v-model="updateBestgoodsParam[index].stock_number" placeholder="个"></el-input>
</td>
</tr>
</tbody>
</table>
</div>
<div slot="footer" class="dialog-footer">
<el-button @click="addBestgoods.dialogVisibleUpdate = false">取 消</el-button>
<el-button type="primary" @click="updateBestgoodsSubmit">确 定</el-button>
</div>
</el-dialog>
</section>
</template>
<script>
import Vue from 'vue';
import Menu from "@/components/menu.vue";
import {Form, FormItem, Select, Option, Input, DatePicker, Button, Dropdown, DropdownMenu, DropdownItem, Table, TableColumn, Message, MessageBox,Dialog, Pagination, Tooltip, Autocomplete, Popover, Tag} from 'element-ui'
Vue.prototype.$message = Message
Vue.prototype.$confirm = MessageBox.confirm;
Vue.use(Button).use(Form).use(Select).use(Option).use(Input).use(FormItem).use(Dialog).use(Tooltip).use(Autocomplete).use(Popover).use(Tag)
Vue.use(DatePicker).use(Dropdown).use(DropdownMenu).use(DropdownItem).use(TableColumn).use(Table).use(Pagination)
export default {
name: "list",
data() {
return {
total: 0,
page: 1,
limit: 10,
list: [],
visible: [false],//批次弹窗
visibleUpdate: [false],//更新批次弹窗
readonly: true,
yearIndex: -1,//年份
periodIndex: -1,//第一周期
periodIndexTwo: -1,//第二周期
year: ['2010', '2011', '2012', '2013', '2014', '2015', '2016', '2017', '2018', '2019', '2020', '2021', '2022', '2023', '2024'],
period: ['01', '02', '03', '04', '05', '06', '07', '08', '09', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24', '25', '26', '27', '28', '29', '30', '31', '32', '33', '34', '35', '36', '37', '38', '39', '40', '41', '42', '43', '44', '45', '46', '47', '48', '49', '50', '51', '52', '53', '54'],
options: [
{
value: '1',
label: '人民币'
}, {
value: '2',
label: '美元'
}, {
value: '3',
label: '港币'
}, {
value: '4',
label: '欧元'
}, {
value: '5',
label: '英磅'
},
],
addBestgoods: {
dialogVisible: false, //新增优势货源
dialogVisibleUpdate: false //修改优势货源
},
addBestgoodsParam: [
{
goods_name: "",
brand_name: "",
start_order_number: "",
currency: '1',
price_origin: "",
batch: "",
stock_number: "",
join_inquiry: ""
}
],
updateBestgoodsParam: [],
formInline: {
goods_name: '',
brand_name: '',
join_inquiry: ''
},
multipleSelection: []
};
},
created() {
this.getData()
},
methods: {
//新增优势货源弹窗
addBestgoodsChange() {
this.addBestgoods.dialogVisible = true;
},
//修改优势货源弹窗
updateBestgoods() {
if (this.multipleSelection.length != 1) {
this.$message({
message: '请勾选一条数据',
type: 'warning'
});
return false;
}
this.updateBestgoodsParam.push({
best_goods_id: this.multipleSelection[0].id,
goods_name: this.multipleSelection[0].goods_name,
brand_name: this.multipleSelection[0].brand_name,
start_order_number: this.multipleSelection[0].start_order_number,
currency: this.multipleSelection[0].currency.toString(),
price_origin: this.multipleSelection[0].price_origin,
batch: this.multipleSelection[0].batch,
stock_number: this.multipleSelection[0].stock_number,
join_inquiry: this.multipleSelection[0].join_inquiry
});
this.addBestgoods.dialogVisibleUpdate = true;
},
//增加行
addRow() {
this.addBestgoodsParam.push({
goods_name: "",
brand_name: "",
start_order_number: "",
currency: "1",
price_origin: "",
batch: "",
stock_number: "",
join_inquiry: ""
})
this.visible.push(false);
},
//删除行
reduceRow(index) {
this.addBestgoodsParam.splice(index, 1)
this.visible.splice(index, 1)
},
//前进年份
prevChange() {
this.yearIndex = -1;
let starYear = this.year[0];
let arr = [];
for (let i = 0; i < 15; i++) {
arr.push(starYear - (i + 1))
}
this.year = arr.sort();
},
//后退年份
nextChange() {
this.yearIndex = -1;
let starYear = this.year[this.year.length - 1] * 1;
let arr = [];
for (let i = 0; i < 15; i++) {
arr.push(starYear + (i + 1))
}
this.year = arr;
},
//批次选择
batchChange() {
},
//新增优势货源提交
addBestgoodsSubmit() {
var self = this;
for (let i = 0; i < this.addBestgoodsParam.length; i++) {
if (!this.addBestgoodsParam[i].goods_name) {
this.$message({
message: '请输入第' + (i + 1) + '行型号',
type: 'warning'
});
return false;
}
if (!this.addBestgoodsParam[i].brand_name) {
this.$message({
message: '请输入第' + (i + 1) + '行品牌',
type: 'warning'
});
return false;
}
if (!this.addBestgoodsParam[i].start_order_number) {
this.$message({
message: '请输入第' + (i + 1) + '行起订量',
type: 'warning'
});
return false;
}
}
this.$http('post', "/api/bestgoods/addBestgoods", {add_json: JSON.stringify(this.addBestgoodsParam)}).then(res => {
if (res.code === 0) {
this.$message({
message: res.msg,
type: 'success',
duration: 2000,
onClose() {
self.addBestgoods.dialogVisible = false;
self.getData();
}
});
} else {
this.$message({
message: res.msg,
type: 'warning'
});
}
})
},
//修改优势货源提交
updateBestgoodsSubmit() {
var self = this;
for (let i = 0; i < this.updateBestgoodsParam.length; i++) {
if (!this.updateBestgoodsParam[i].goods_name) {
this.$message({
message: '请输入第' + (i + 1) + '行型号',
type: 'warning'
});
return false;
}
if (!this.updateBestgoodsParam[i].brand_name) {
this.$message({
message: '请输入第' + (i + 1) + '行品牌',
type: 'warning'
});
return false;
}
if (!this.updateBestgoodsParam[i].start_order_number) {
this.$message({
message: '请输入第' + (i + 1) + '行起订量',
type: 'warning'
});
return false;
}
}
this.$http('post', "/api/bestgoods/updateBestgoods", {update_json: JSON.stringify(this.updateBestgoodsParam)}).then(res => {
if (res.code === 0) {
this.$message({
message: res.msg,
type: 'success',
duration: 2000,
onClose() {
self.addBestgoods.dialogVisibleUpdate = false;
self.getData();
}
});
} else {
this.$message({
message: res.msg,
type: 'warning'
});
}
})
},
//删除
delBestgoods() {
var self = this;
if (this.multipleSelection.length <= 0) {
this.$message({
message: '请勾选数据',
type: 'warning'
});
return false;
}
var best_goods_ids = this.multipleSelection.map(obj => {
return obj.id;
})
this.$confirm('确认删除当前优势货源吗？', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$http('POST', "/api/bestgoods/delBestgoods", {best_goods_ids: best_goods_ids.join(',')}).then(res => {
if (res.code === 0) {
this.$message({
message: res.msg,
type: 'success',
duration: 2000,
onClose() {
self.getData();
}
});
} else {
this.$message({
message: res.msg,
type: 'warning'
});
}
})
}).catch(() => {
});
},
//批次关闭
clear(type, index) {
if (type == 1) {
this.$set(this.visible, index, false);
this.$set(this.addBestgoodsParam[index], 'batch', '');
} else if (type == 2) {
this.$set(this.visibleUpdate, index, false);
this.$set(this.updateBestgoodsParam[index], 'batch', '');
}
},
//批次确定
confirm(type, val, index) {
if (this.yearIndex == -1) {
this.$message({
message: '请选择年份',
type: 'warning'
});
return false;
}
if (type == 1) {
val = val.toString();
val = val.substring(val.length - 2);
this.$set(this.addBestgoodsParam[index], 'batch', val + '+');
} else if (type == 2) {
if (!val) {
this.$message({
message: '请选择第一周期',
type: 'warning'
});
return false;
}
let year = this.year[this.yearIndex].toString();
year = year.substring(year.length - 2);
this.$set(this.addBestgoodsParam[index], 'batch', year + val);
} else if (type == 3) {
if (this.periodIndex == -1) {
this.$message({
message: '请选择第一周期',
type: 'warning'
});
return false;
}
if (!val) {
this.$message({
message: '请选择第二周期',
type: 'warning'
});
return false;
}
var one = parseInt(this.period[this.periodIndex]);
var two = parseInt(val);
if (two <= one) {
this.$message({
message: '不可小于第一周期',
type: 'warning'
});
return false;
}
let year = this.year[this.yearIndex].toString();
year = year.substring(year.length - 2);
let period = this.period[this.periodIndex].toString();
period = period.substring(period.length - 2);
val = val.toString();
val = val.substring(val.length - 2);
let prev = year + period;
let next = year + val;
this.$set(this.addBestgoodsParam[index], 'batch', prev + '-' + next);
}
this.$set(this.visible, index, false);
},
//批次更新
confirmUpdate(type, val, index) {
if (this.yearIndex == -1) {
this.$message({
message: '请选择年份',
type: 'warning'
});
return false;
}
if (type == 1) {
val = val.toString();
val = val.substring(val.length - 2);
this.$set(this.updateBestgoodsParam[index], 'batch', val + '+');
} else if (type == 2) {
if (!val) {
this.$message({
message: '请选择第一周期',
type: 'warning'
});
return false;
}
let year = this.year[this.yearIndex].toString();
year = year.substring(year.length - 2);
this.$set(this.updateBestgoodsParam[index], 'batch', year + val);
} else if (type == 3) {
if (this.periodIndex == -1) {
this.$message({
message: '请选择第一周期',
type: 'warning'
});
return false;
}
if (!val) {
this.$message({
message: '请选择第二周期',
type: 'warning'
});
return false;
}
var one = parseInt(this.period[this.periodIndex]);
var two = parseInt(val);
if (two <= one) {
this.$message({
message: '不可小于第一周期',
type: 'warning'
});
return false;
}
let year = this.year[this.yearIndex].toString();
year = year.substring(year.length - 2);
let period = this.period[this.periodIndex].toString();
period = period.substring(period.length - 2);
val = val.toString();
val = val.substring(val.length - 2);
let prev = year + period;
let next = year + val;
this.$set(this.updateBestgoodsParam[index], 'batch', prev + '-' + next);
}
this.$set(this.visibleUpdate, index, false);
},
tabChange(index, type) {
if (type == 1) {
this.yearIndex = index;
} else if (type == 2) {
this.periodIndex = index;
} else if (type == 3) {
this.periodIndexTwo = index;
}
},
getData() {
this.$http('GET', "/api/bestgoods/getBestGoodsList", {
page: this.page,
limit: this.limit
}).then(res => {
if (res.code === 0) {
this.list = res.data.list || [];
this.total = Number(res.data.count) || 0;
} else {
this.$message(res.msg);
}
})
},
querySearchAsync(queryString, cb) {
this.$http('get', "/api/search/getspu", {
spu_name: queryString
}).then(res => {
if (res.code == 0) {
if (res.data.list.length > 0) {
var arrlist_ = res.data.list || [];
var arr_ = []
for (var i = 0; i < arrlist_.length; i++) {
arr_.push({
value: arrlist_[i]['spu_name']
})
}
cb(arr_);
} else {
cb([]);
}
}
})
},
querySearchAsyncBrand(queryString, cb) {
this.$http('get', "/api/brand/get_stand_brand", {
brand: queryString
}).then(res => {
if (res.code == 0) {
if (res.data.list.length > 0) {
var arrlist_ = res.data.list || [];
var arr_ = []
for (var i = 0; i < arrlist_.length; i++) {
arr_.push({
value: arrlist_[i]
})
}
cb(arr_);
} else {
cb([]);
}
}
})
},
handleSelectionChange(val) {
this.multipleSelection = val;
},
onSubmit() {
this.page = 1;
this.getData();
},
handleCurrentChange(val) {
this.page = val;
this.getData();
},
},
components: {
Menu
}
};
</script>
<style scoped>
@import "../../assets/css/store/goodslist.min.css";
</style>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment