做一个这样的页面
用到的表
基金和推荐基金的关系是一对一(大概)
推荐的外键是基金的主键
基金表里的审核状态和是否推荐状态不属于基金表的外键(?存疑)
servlet
package com.javasm.contoller;
import com.alibaba.fastjson.JSON;
import com.javasm.entity.*;
import com.javasm.service.RecService;
import com.javasm.service.impl.RecServiceImpl;
import com.javasm.util.Write;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.io.PrintWriter;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
/**
* @author: pb
* @clasName: JAVASM
* @description:
* @date: 2022/8/23 14:43
* @version: 0.1
* @since: jdk11
*/
@WebServlet("/recommend/*")
public class RecServlet extends BaseServlet {
RecService rs = new RecServiceImpl();
ReturnEntity re = new ReturnEntity();
public void query(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
//返回审核通过且已推荐状态的数据
String pageStr = req.getParameter("page");
String pageSizeStr = req.getParameter("pageSize");
String pidStr = req.getParameter("pid");//获得下拉列表中父级id
Integer page = 1,pageSize = 5,pid=null;
if(pageStr!=null && !"".equals(pageStr)){
page = Integer.parseInt(pageStr);
}
if(pageSizeStr!=null && !"".equals(pageSizeStr)){
pageSize = Integer.parseInt(pageSizeStr);
}
if(pidStr!=null && !"".equals(pidStr)){
pid = Integer.parseInt(pidStr);
}
PageInfo pif = new PageInfo(page,pageSize,null);
List<Recommend> query = rs.query(pif,pid);
if(query!=null){
Long aLong = rs.pageNum(pid);
PageInfo pif1 = new PageInfo(page,pageSize,aLong.intValue());
re.setRetCode(ReturnCode.QUERY_SUCCESS.getCode());
re.setRetMsg(ReturnCode.QUERY_SUCCESS.getMsg());
re.setRetData(query);
re.setPif(pif1);
}else{
re.setRetCode(ReturnCode.NO_DATA.getCode());
re.setRetMsg(ReturnCode.NO_DATA.getMsg());
}
Write.getResp(resp,re);
}
//下拉查询菜单
public void downList(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
List<BasicProduct> menuForSelect = rs.getMenuForSelect();
if(menuForSelect!=null){
re.setRetCode(ReturnCode.QUERY_SUCCESS.getCode());
re.setRetMsg(ReturnCode.QUERY_SUCCESS.getMsg());
re.setRetData(menuForSelect);
}else{
re.setRetCode(ReturnCode.NO_DATA.getCode());
re.setRetMsg(ReturnCode.NO_DATA.getMsg());
}
Write.getResp(resp,re);
}
//新增表单的下拉菜单
public void dataForAdd(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
//审核通过但未被推荐过的基金数据
List<BasicProduct> basicProducts = rs.dataForAdd();
if(basicProducts!=null){
re.setRetCode(ReturnCode.QUERY_SUCCESS.getCode());
re.setRetMsg(ReturnCode.QUERY_SUCCESS.getMsg());
re.setRetData(basicProducts);
}else{
re.setRetCode(ReturnCode.NO_DATA.getCode());
re.setRetMsg(ReturnCode.NO_DATA.getMsg());
}
Write.getResp(resp,re);
}
public void add(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
//新增basic表中已审核至rec
//更改basic中推荐状态为1
String prodIdStr = req.getParameter("prodId"); //获取选中的基金id
String hotStr = req.getParameter("hot");
String isvisibleStr = req.getParameter("isvisible");
String isfpStr = req.getParameter("isfp");
String onlineSubStr = req.getParameter("onlineSub");
String reason = req.getParameter("reason");
Integer prodId = null,hot = null,isvisible=null,isfp=null,onlineSub=null;
if(prodIdStr!=null && !"".equals(prodIdStr)){
prodId = Integer.parseInt(prodIdStr);
}
if(hotStr!=null && !"".equals(hotStr)){
hot = Integer.parseInt(hotStr);
}
if(isvisibleStr!=null && !"".equals(isvisibleStr)){
isvisible = Integer.parseInt(isvisibleStr);
}
if(isfpStr!=null && !"".equals(isfpStr)){
isfp = Integer.parseInt(isfpStr);
}
if(onlineSubStr!=null && !"".equals(onlineSubStr)){
onlineSub = Integer.parseInt(onlineSubStr);
}
Recommend r = new Recommend(prodId,isvisible,isfp,onlineSub,hot,reason);
Integer integer = rs.addRecProd(r);
if(integer>0){
Integer integer1 = rs.updateBasicStatus(1,prodId);
re.setRetCode(ReturnCode.REQ_SUCCESS.getCode());
re.setRetMsg(ReturnCode.REQ_SUCCESS.getMsg());
}else{
re.setRetCode(ReturnCode.REQ_FAILED.getCode());
re.setRetMsg(ReturnCode.REQ_FAILED.getMsg());
}
Write.getResp(resp,re);
}
public void dataForRel(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
String prodIdStr = req.getParameter("prodId");
//给关联申购准备已勾选基金,需获取用户id
String idStr = req.getParameter("id");
Integer id = null,prodId=null;
if(idStr!=null && !"".equals(idStr)){
id = Integer.parseInt(idStr);
}
if(prodIdStr!=null && !"".equals(prodIdStr)){
prodId = Integer.parseInt(prodIdStr);
}
//给关联申购准备选项,关联项不能与选中项相同,所以要在service层处理数据
List<BasicProduct> basicProducts = rs.dataForRel(prodId);
String s = rs.relOption(id);
Map<String,Object> m = new HashMap<>(16);
if(basicProducts!=null){
m.put("dataList",basicProducts);
m.put("selected",s);
re.setRetCode(ReturnCode.QUERY_SUCCESS.getCode());
re.setRetMsg(ReturnCode.QUERY_SUCCESS.getMsg());
re.setRetData(m);
}else{
re.setRetCode(ReturnCode.NO_DATA.getCode());
re.setRetMsg(ReturnCode.NO_DATA.getMsg());
}
Write.getResp(resp,re);
}
public void relevance(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
String prodList = req.getParameter("prodList");
String idStr = req.getParameter("id");
Integer id = null;
if(idStr!=null && !"".equals(idStr)){
id = Integer.parseInt(idStr);
}
Integer integer = rs.relevance(prodList, id);
if(integer>0){
re.setRetCode(ReturnCode.REQ_SUCCESS.getCode());
re.setRetMsg(ReturnCode.REQ_SUCCESS.getMsg());
}else{
re.setRetCode(ReturnCode.REQ_FAILED.getCode());
re.setRetMsg(ReturnCode.REQ_FAILED.getMsg());
}
Write.getResp(resp,re);
}
public void dataForEdit(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
String idStr = req.getParameter("id");
Integer id = null;
if(idStr!=null && !"".equals(idStr)){
id = Integer.parseInt(idStr);
}
Recommend recommend = rs.queryById(id);
if(recommend!=null){
re.setRetCode(ReturnCode.QUERY_SUCCESS.getCode());
re.setRetMsg(ReturnCode.QUERY_SUCCESS.getMsg());
re.setRetData(recommend);
}else{
re.setRetCode(ReturnCode.NO_DATA.getCode());
re.setRetMsg(ReturnCode.NO_DATA.getMsg());
}
Write.getResp(resp,re);
}
public void edit(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
//修改就是换一只基金推荐
//记录一下当前选的基金,修改成功后展示状态要改为0,新修改的基金展示状态改为1
String idStr = req.getParameter("id"); // 选中行推荐基金id
String editidStr = req.getParameter("editid"); //修改前选的基金id
String prodIdStr = req.getParameter("prodId"); //修改后的基金id
String hotStr = req.getParameter("hot");
String isvisibleStr = req.getParameter("isvisible");
String isfpStr = req.getParameter("isfp");
String onlineSubStr = req.getParameter("onlineSub");
String reason = req.getParameter("reason");
Integer id=null,editid=null,prodId=null,hot=null,isvisible=null,isfp=null,onlineSub=null;
if(idStr!=null && !"".equals(idStr)){
id = Integer.parseInt(idStr);
}
if(editidStr!=null && !"".equals(editidStr)){
editid = Integer.parseInt(editidStr);
}
if(prodIdStr!=null && !"".equals(prodIdStr)){
prodId = Integer.parseInt(prodIdStr);
}
if(hotStr!=null && !"".equals(hotStr)){
hot = Integer.parseInt(hotStr);
}
if(isvisibleStr!=null && !"".equals(isvisibleStr)){
isvisible = Integer.parseInt(isvisibleStr);
}
if(isfpStr!=null && !"".equals(isfpStr)){
isfp = Integer.parseInt(isfpStr);
}
if(onlineSubStr!=null && !"".equals(onlineSubStr)){
onlineSub = Integer.parseInt(onlineSubStr);
}
Recommend r = new Recommend(prodId,isvisible,isfp,onlineSub,hot,reason,id);
Integer integer = rs.editData(r);
if(!editid.equals(prodId)){
rs.updateBasicStatus(0,editid);
rs.updateBasicStatus(1,prodId);
}
if(integer>0){
re.setRetCode(ReturnCode.REQ_SUCCESS.getCode());
re.setRetMsg(ReturnCode.REQ_SUCCESS.getMsg());
}else{
re.setRetCode(ReturnCode.REQ_FAILED.getCode());
re.setRetMsg(ReturnCode.REQ_FAILED.getMsg());
}
Write.getResp(resp,re);
}
public void cancelRel(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
//取消关联项
//获得已选项
//获得取消选项
//从以选项中找到取消选项并删除
//传回数据库
String prodList = req.getParameter("prodList");
String idStr = req.getParameter("id");
Integer id=null;
if(idStr!=null && !"".equals(idStr)){
id = Integer.parseInt(idStr);
}
Integer integer = rs.cancelRel(prodList, id);
if(integer>0){
re.setRetCode(ReturnCode.REQ_SUCCESS.getCode());
re.setRetMsg(ReturnCode.REQ_SUCCESS.getMsg());
}else{
re.setRetCode(ReturnCode.REQ_FAILED.getCode());
re.setRetMsg(ReturnCode.REQ_FAILED.getMsg());
}
Write.getResp(resp,re);
}
}
DaoImpl
package com.javasm.dao.impl;
public class RecDaoImpl implements RecDao {
QueryRunner q = new QueryRunner(DruidUtil.getDatasource());
@Override
public List<Recommend> query(PageInfo pif,Integer pid) {
List<Object> l = new ArrayList<>(10);
String sql = "SELECT r.id,r.prod_id,b.chinese_name,r.isfp,r.online_sub,r.hot FROM basic_product AS b,recommend AS r " +
" WHERE r.prod_id = b.id AND b.status=1 ";
if(pid!=null){
sql+=" AND b.pid=? ";
l.add(pid);
}
sql+="ORDER BY r.hot DESC LIMIT "+(pif.getPage()-1)* pif.getPageSize()+","+pif.getPageSize();
System.out.println(sql);
try {
return q.query(sql,
new BeanListHandler<>(Recommend.class,new BasicRowProcessor(new GenerousBeanProcessor())),l.toArray());
} catch (SQLException throwables) {
throwables.printStackTrace();
}
return null;
}
@Override
public List<BasicProduct> getMenuForSelect() {
try {
return q.query(SQL.DOWN_LIST,new BeanListHandler<>(BasicProduct.class
,new BasicRowProcessor(new GenerousBeanProcessor())));
} catch (SQLException throwables) {
throwables.printStackTrace();
}
return null;
}
@Override
public List<BasicProduct> dataForAdd() {
try {
return q.query(SQL.ADD_LIST,new BeanListHandler<>(BasicProduct.class,
new BasicRowProcessor(new GenerousBeanProcessor())));
} catch (SQLException throwables) {
throwables.printStackTrace();
}
return null;
}
@Override
public Integer addRecProd(Recommend r) {
try {
return q.update(SQL.ADD,
r.getProdId(),
r.getHot(),
r.getIsvisible(),
r.getIsfp(),
r.getOnlineSub(),
r.getReason());
} catch (SQLException throwables) {
throwables.printStackTrace();
}
System.out.println(1);
return null;
}
@Override
public List<BasicProduct> dataForRel() {
try {
return q.query(SQL.RELEVANCE_OPTION,
new BeanListHandler<>(BasicProduct.class,new BasicRowProcessor(new GenerousBeanProcessor())));
} catch (SQLException throwables) {
throwables.printStackTrace();
}
return null;
}
@Override
public String relOption(Integer id) {
try {
return q.query(SQL.SELECTED,new ScalarHandler<String>(),id);
} catch (SQLException throwables) {
throwables.printStackTrace();
}
return null;
}
@Override
public Integer relevance(String choice, Integer id) {
try {
return q.update(SQL.RELEVANCE,choice,id);
} catch (SQLException throwables) {
throwables.printStackTrace();
}
return null;
}
@Override
public Integer updateBasicStatus(Integer status,Integer id) {
try {
return q.update(SQL.UPDATE_STATUS,status,id);
} catch (SQLException throwables) {
throwables.printStackTrace();
}
return null;
}
@Override
public Long pageNum(Integer pid) {
List<Integer> l = new ArrayList<>(10);
String sql = "SELECT count(1) FROM recommend AS r,basic_product AS b WHERE r.prod_id=b.id ";
if(pid!=null){
sql+=" AND b.pid=? ";
l.add(pid);
}
try {
return q.query(sql,new ScalarHandler<>(),l.toArray());
} catch (SQLException throwables) {
throwables.printStackTrace();
}
return null;
}
@Override
public Recommend queryById(Integer id) {
try {
return q.query(SQL.DATA_FOR_EDIT,new BeanHandler<>(Recommend.class,new BasicRowProcessor(new GenerousBeanProcessor())),id);
} catch (SQLException throwables) {
throwables.printStackTrace();
}
return null;
}
@Override
public Integer editData(Recommend r) {
try {
return q.update(SQL.EDIT,r.getProdId(),
r.getIsvisible(),
r.getIsfp(),
r.getOnlineSub(),
r.getHot(),
r.getReason(),
r.getId());
} catch (SQLException throwables) {
throwables.printStackTrace();
}
return null;
}
@Override
public String getSelectedOption(Integer id) {
try {
return q.query(SQL.CANCEL_REL,new ScalarHandler<String>(),id);
} catch (SQLException throwables) {
throwables.printStackTrace();
}
return null;
}
}
Dao
package com.javasm.dao;
public interface RecDao {
/**
* 模糊分页查询
* @param pif 页码 页数 父级id
* @return 返回审核通过且已推荐状态的数据
*/
List<Recommend> query(PageInfo pif,Integer pid);
/**
* 准备查询下拉菜单
* @return 返回父级id和名称
*/
List<BasicProduct> getMenuForSelect();
/**
* 准备新增下拉菜单
* @return 返回产品id和产品名称
*/
List<BasicProduct> dataForAdd();
/**
* 新增推荐产品,默认选中产品状态设置为已推荐
* @param r
* @return
*/
Integer addRecProd(Recommend r);
/**
* 为关联申购准备基金选项
* @return 基金的id和名字
*/
List<BasicProduct> dataForRel();
/**
* 根据用户id查询出该基金已选关联申购选项
* @param id
* @return
*/
String relOption(Integer id);
/**
* 根据id修改关联申购的编号
* @param choice
* @param id
* @return
*/
Integer relevance(String choice,Integer id);
/**
* 根据选中的id更改推荐状态
* @param id
* @return
*/
Integer updateBasicStatus(Integer status,Integer id);
/**
* 统计条数
* @param pid
* @return
*/
Long pageNum(Integer pid);
/**
* 根据返回的id为修改准备数据
* @param id
* @return
*/
Recommend queryById(Integer id);
/**
* 根据返回数据修改基金信息
* @param r
* @return
*/
Integer editData(Recommend r);
/**
* 获得该基金的已关联项
* @param id
* @return
*/
String getSelectedOption(Integer id);
}
ServiImpl
package com.javasm.service.impl;
public class RecServiceImpl implements RecService {
RecDao rd = new RecDaoImpl();
@Override
public List<Recommend> query(PageInfo pif,Integer pid) {
return rd.query(pif,pid);
}
@Override
public List<BasicProduct> getMenuForSelect() {
return rd.getMenuForSelect();
}
@Override
public List<BasicProduct> dataForAdd() {
return rd.dataForAdd();
}
@Override
public Integer addRecProd(Recommend r) {
return rd.addRecProd(r);
}
@Override
public List<BasicProduct> dataForRel(Integer prodId) {
List<BasicProduct> basicProducts = rd.dataForRel();
List<BasicProduct> collect = basicProducts.stream().filter(prod -> !prod.getId().equals(prodId)).collect(Collectors.toList());
return collect;
}
@Override
public Integer relevance(String choice, Integer id) {
return rd.relevance(choice,id);
}
@Override
public String relOption(Integer id) {
return rd.relOption(id);
}
@Override
public Integer updateBasicStatus(Integer status,Integer id) {
return rd.updateBasicStatus(status,id);
}
@Override
public Long pageNum(Integer pid) {
return rd.pageNum(pid);
}
@Override
public Recommend queryById(Integer id) {
return rd.queryById(id);
}
@Override
public Integer editData(Recommend r) {
return rd.editData(r);
}
@Override
public Integer cancelRel(String option, Integer id) {
Integer relevance=null;
String selectedOption = rd.getSelectedOption(id); //已选项
if(selectedOption!=null){
String s1 = selectedOption.replaceAll(",", "");
String s2 = option.replaceAll(",", "");
String s3 = s1.replaceAll(s2, "");
String[] split = s3.split("");
StringBuilder sb = new StringBuilder();
for (int i = 0; i < split.length; i++) {
if(i>0){
sb.append(",");
}
sb.append(split[i]);
}
relevance = rd.relevance(sb.toString(), id); //写入数据库
}
return relevance;
}
}
service
package com.javasm.service;
public interface RecService {
List<Recommend> query(PageInfo pif,Integer pid);
List<BasicProduct> getMenuForSelect();
List<BasicProduct> dataForAdd();
Integer addRecProd(Recommend r);
List<BasicProduct> dataForRel(Integer prodId);
Integer relevance(String choice,Integer id);
String relOption(Integer id);
Integer updateBasicStatus(Integer status,Integer id);
Long pageNum(Integer pid);
Recommend queryById(Integer id);
Integer editData(Recommend r);
Integer cancelRel(String option,Integer id);
}
前端
<div>
<el-form ref="queryForm" :inline="true" :model="queryForm" class="demo-form-inline">
<el-form-item label="系列名称" prop="pid">
<el-select v-model="queryForm.pid" placeholder="pChinese">
<el-option v-for="(c,index) in selectList" :label="c.pChinese" :value="c.pid"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onQuerySubmit">查询</el-button>
<el-button type="primary" @click="reset()">重置</el-button>
<el-button type="primary" @click="openAddDialog()">添加</el-button>
<el-button type="primary" :disabled="btnStatus" @click="editDialogOpen()" >修改</el-button>
<el-button type="primary" :disabled="btnStatus" @click="openDialog()">关联申购</el-button>
</el-form-item>
</el-form>
<el-dialog title="修改" :visible.sync="editFormVisible">
<el-form ref="editform" :model="editform">
<el-form-item label="推荐产品" :label-width="'120px'" prop="prodId">
<el-select v-model="editform.prodId" placeholder="产品列表">
<el-option :label="editform.chineseName" :value="editform.prodId" ></el-option>
<el-option v-for="a in editList" :label="a.chineseName" :value="a.id" ></el-option>
</el-select>
</el-form-item>
<el-form-item label="推荐度" :label-width="'120px'" prop="hot">
<el-input v-model="editform.hot" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="是否顾投端可见" :label-width="'120px'" prop="isvisible">
<template>
<el-radio v-model="editform.isvisible" :label="1">是</el-radio>
<el-radio v-model="editform.isvisible" :label="0">否</el-radio>
</template>
</el-form-item>
<el-form-item label="是否首发" :label-width="'120px'" prop="isfp">
<template>
<el-radio v-model="editform.isfp" :label="1">是</el-radio>
<el-radio v-model="editform.isfp" :label="0">否</el-radio>
</template>
</el-form-item>
<el-form-item label="线上申购开启" :label-width="'120px'" prop="onlineSub">
<el-radio v-model="editform.onlineSub" :label="1">是</el-radio>
<el-radio v-model="editform.onlineSub" :label="0">否</el-radio>
</el-form-item>
<el-form-item label="推荐理由" :label-width="'120px'" prop="reason">
<el-input v-model="editform.reason" autocomplete="off"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="editFormVisible = false">取 消</el-button>
<el-button type="primary" @click="editSubmit()">确 定</el-button>
</div>
</el-dialog>
<el-dialog title="关联模板" :visible.sync="relFormVisible">
<template>
<div style="text-align: center">
<el-transfer
style="text-align: left; display: inline-block"
v-model="yesdata"
:props="{key:'id',label:'chineseName'}"
:titles="['未关联', '已关联']"
:button-texts="['取消关联', '关联']"
@change="handleChange"
:data="nodata">
<el-button class="transfer-footer" slot="left-footer" size="small">操作</el-button>
<el-button class="transfer-footer" slot="right-footer" size="small">操作</el-button>
</el-transfer>
</div>
</template>
<div slot="footer" class="dialog-footer">
<el-button @click="relFormVisible = false">取 消</el-button>
<el-button type="primary" @click="relSubmit()">确 定</el-button>
</div>
</el-dialog>
<el-dialog title="添加" :visible.sync="addFormVisible">
<el-form ref="addform" :model="addform">
<el-form-item label="推荐产品" :label-width="'120px'" prop="prodId">
<el-select v-model="addform.prodId" placeholder="产品列表">
<el-option v-for="a in addList" :label="a.chineseName" :value="a.id" ></el-option>
</el-select>
</el-form-item>
<el-form-item label="推荐度" :label-width="'120px'" prop="hot" required>
<el-input v-model="addform.hot" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="是否顾投端可见" :label-width="'120px'" prop="isvisible">
<template>
<el-radio v-model="addform.isvisible" :label="1">是</el-radio>
<el-radio v-model="addform.isvisible" :label="0">否</el-radio>
</template>
</el-form-item>
<el-form-item label="是否首发" :label-width="'120px'" prop="isfp">
<template>
<el-radio v-model="addform.isfp" :label="1">是</el-radio>
<el-radio v-model="addform.isfp" :label="0">否</el-radio>
</template>
</el-form-item>
<el-form-item label="线上申购开启" :label-width="'120px'" prop="onlineSub">
<el-radio v-model="addform.onlineSub" :label="1">是</el-radio>
<el-radio v-model="addform.onlineSub" :label="0">否</el-radio>
</el-form-item>
<el-form-item label="推荐理由" :label-width="'120px'" prop="reason">
<el-input v-model="addform.reason" autocomplete="off"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="addFormVisible = false">取 消</el-button>
<el-button type="primary" @click="addSubmit()">确 定</el-button>
</div>
</el-dialog>
<el-table
:data="tableData"
style="width: 100%"
highlight-current-row
@current-change="handleCurrentRowChange"
>
<el-table-column
type="index"
width="50">
</el-table-column>
<el-table-column
prop="chineseName"
label="产品名称"
width="180">
</el-table-column>
<el-table-column
prop="hot"
label="推荐度">
<template v-slot="scope">
<div v-if="scope.row.hot > 50">热门推荐</div>
<div v-else>普通推荐</div>
</template>
</el-table-column>
<!--
glyphicon: (...)
menuname: (...)
mid: (...)
pid: (...)
pname: (...)
url: (...)
-->
<el-table-column
prop="isfp"
label="是否首发">
<template v-slot="scope">
<div v-if="scope.row.isfp == 0">否</div>
<div v-else>是</div>
</template>
</el-table-column>
<el-table-column
prop="onlineSub"
label="线上申购">
<template v-slot="scope">
<div v-if="scope.row.onlineSub == 0">否</div>
<div v-else>是</div>
</template>
</el-table-column>
<!-- <el-table-column
prop="url"
label="排序">
</el-table-column> -->
</el-table>
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="pageInfo.page"
:page-sizes="[3, 5, 10]"
:page-size="pageInfo.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="pageInfo.totalNum">
</el-pagination>
</div>
</template>
<script>
export default {
data(){
return{
btnStatus:true,
nodata:[{id:1,chineseName:'测试1'},{id:2,chineseName:'测试3'}],
yesdata:[],
tableData:[],
queryForm:{
pChinese:'',
pid:''
},
selectList:[],
addform:{
prodId:'',
hot:'',
isvisible:1,
isfp:1,
onlineSub:1,
reason:''
},
addList:[],
addFormVisible:false,
currentRow:null,
relFormVisible:false,
pageInfo:{
page:1,
pageSize:5,
totalNum:88
},
relvalue:null,
mydirection:null,
mymovedkeys:null,
editList:[],
editFormVisible:false,
editform:{
chineseName:'',
prodId:'',
hot:'',
isvisible:1,
isfp:1,
onlineSub:1,
reason:''
},
editid:''
}
},
methods:{
reset(){
console.log(1);
this.$refs.queryForm.resetFields();
console.log(this.$refs.queryForm.resetFields());
this.myQuery("");
},
editSubmit(){
this.editFormVisible=false;
let id = this.currentRow.id;
let a = this.$qs.stringify(this.editform);
this.$axios.get("http://localhost:8083/day17/recommend/edit?editid="+this.editid+"&"+"id="+id+"&"+a)
.then(respInfo=>{
console.log(respInfo);
//展示操作结果
if(respInfo.data.retCode==20000){
this.$message.success(respInfo.data.retMsg);
}else if(respInfo.data.retCode==20005){
this.$message.error(respInfo.data.retMsg);
}
this.myQuery("");
})
},
editDialogOpen(){
this.editFormVisible=true;
this.$axios.get("http://localhost:8083/day17/recommend/dataForAdd")
.then(resp=>{
console.log(resp);
if(resp.data.retCode==50000){
this.editList = resp.data.retData;
}else if(resp.data.retCode==50001){
this.editList = [];
}
});
this.$axios.get("http://localhost:8083/day17/recommend/dataForEdit?id="+this.currentRow.id)
.then(resp=>{
console.log(resp);
if(resp.data.retCode==50000){
this.editform = resp.data.retData;
this.editid=this.editform.prodId;
}else if(resp.data.retCode==50001){
this.editform = [];
}
});
console.log(this.editform);
this.$nextTick(function(){
this.$refs.editform.resetFields();
})
},
relSubmit(){
this.relFormVisible=false;
if(this.mydirection=="right"){
console.log(this.relvalue);
this.$axios.get("http://localhost:8083/day17/recommend/relevance?prodList="+this.relvalue+"&"+"id="+this.currentRow.id)
.then(respInfo=>{
console.log(respInfo);
//展示操作结果
if(respInfo.data.retCode==20000){
this.$message.success(respInfo.data.retMsg);
}else if(respInfo.data.retCode==20005){
this.$message.error(respInfo.data.retMsg);
}
this.myQuery("");
})
}
if(this.mydirection=="left"){
this.$axios.get("http://localhost:8083/day17/recommend/cancelRel?prodList="+this.mymovedkeys+"&id="+this.currentRow.id)
.then(respInfo=>{
console.log(respInfo);
//展示操作结果
if(respInfo.data.retCode==20000){
this.$message.success(respInfo.data.retMsg);
}else if(respInfo.data.retCode==20005){
this.$message.error(respInfo.data.retMsg);
}
this.myQuery("");
})
}
},
handleCurrentChange(val) {
this.btnStatus=false;
console.log(`当前页: ${val}`);
this.pageInfo.page = val;
let queryParams = this.$qs.stringify(this.pageInfo)+"&"+this.$qs.stringify(this.queryForm)
this.myQuery(queryParams);
},
handleSizeChange(val) {
this.btnStatus=false;
console.log(`每页 ${val} 条`);
//改pageInfo对象中的值
this.pageInfo.page = 1;
this.pageInfo.pageSize = val;
let queryParams = this.$qs.stringify(this.pageInfo)+"&"+this.$qs.stringify(this.queryForm)
this.myQuery(queryParams);
},
handleChange(value, direction, movedKeys) {
console.log(value, direction, movedKeys);
this.relvalue=value;
this.mydirection=direction;
this.mymovedkeys = movedKeys;
},
handleCurrentRowChange(val){
this.btnStatus=false;
console.log(val);
this.currentRow = val;
},
openDialog(){
this.yesdata=[];
console.log(this.currentRow.id);
this.relFormVisible=true;
this.$axios.get("http://localhost:8083/day17/recommend/dataForRel?id="+this.currentRow.id+"&prodId="+this.currentRow.prodId)
.then(resp=>{
let a = resp.data.retData.selected;
if(resp.data.retCode==50000){
this.nodata = resp.data.retData.dataList;
this.pageInfo = resp.data.pif;
if(a!=undefined){
let num = a.split(",");
num.forEach((item,index)=>{
num[index] = parseInt(num[index])
})
this.yesdata = num;
}
console.log(this.yesdata);
}else if(resp.data.retCode==50001){
this.nodata = [];
}
});
},
addSubmit(){
this.addFormVisible=false;
console.log(this.addform);
let params = this.$qs.stringify(this.addform);
this.$axios.post("http://localhost:8083/day17/recommend/add",params)
.then(respInfo=>{
console.log(respInfo);
//展示操作结果
if(respInfo.data.retCode==20000){
this.$message.success(respInfo.data.retMsg);
}else if(respInfo.data.retCode==20005){
this.$message.error(respInfo.data.retMsg);
}
});
this.myQuery("");
},
openAddDialog(){
// this.$refs.addform.resetFields();
this.addFormVisible=true;
this.$axios.get("http://localhost:8083/day17/recommend/dataForAdd")
.then(resp=>{
console.log(resp);
if(resp.data.retCode==50000){
this.addList = resp.data.retData;
}else if(resp.data.retCode==50001){
this.addList = [];
}
});
this.$nextTick(function(){
this.$refs.addform.resetFields();
})
},
onQuerySubmit(){
let b = this.$qs.stringify(this.queryForm);
console.log(this.queryForm);
this.myQuery(b);
},
myQuery(param){
this.$axios.get("http://localhost:8083/day17/recommend/query?"+param)
.then(resp=>{
console.log(resp);
if(resp.data.retCode==50000){
this.tableData = resp.data.retData;
this.pageInfo = resp.data.pif;
}else if(resp.data.retCode==50001){
this.tableData = [];
this.pageInfo.totalNum = 1;
this.pageInfo.page = 1;
}
this.$nextTick(function(){
this.btnStatus=true;
})
})
}
},
mounted() {
this.myQuery("");
this.$axios.get("http://localhost:8083/day17/recommend/downList")
.then(resp=>{
console.log(resp);
if(resp.data.retCode==50000){
this.selectList = resp.data.retData;
}else if(resp.data.retCode==50001){
this.selectList = [];
}
})
}
}
</script>
<style>
.transfer-footer {
margin-left: 20px;
padding: 6px 5px;
}
</style>