Loki
/
yudao-ui-admin
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

新增评测模块

master
sj 2 years ago
parent
7e76feff54
commit
a7dabdf8e1
2 changed files with 359 additions and 0 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 27
      src/api/yxEvaluation.js
  2. 332
      src/views/bxg/yxEvaluation/index.vue

27
src/api/yxEvaluation.js
Unescape View File

@ -0,0 +1,27 @@
import request from '@/utils/request'
export function add(data) {
return request({
url: 'bxg/api/yxEvaluation',
method: 'post',
data
})
}
export function del(ids) {
return request({
url: 'bxg/api/yxEvaluation/',
method: 'delete',
data: ids
})
}
export function edit(data) {
return request({
url: 'bxg/api/yxEvaluation',
method: 'put',
data
})
}
export default { add, edit, del }

332
src/views/bxg/yxEvaluation/index.vue
Unescape View File

@ -0,0 +1,332 @@
<template>
<div class="app-container">
<!--工具栏-->
<div class="head-container">
<!--如果想在工具栏加入更多按钮，可以使用插槽方式， slot = 'left' or 'right'-->
<div v-if="crud.props.searchToggle">
<!-- 搜索 -->
<el-input v-model="query.expertName" clearable size="small" placeholder="输入评测名称搜索" style="width: 200px;" class="filter-item" @keyup.enter.native="crud.toQuery" />
<rrOperation :crud="crud" />
</div>
<crudOperation :permission="permission" />
<!--表单组件-->
<el-dialog :close-on-click-modal="false" :before-close="crud.cancelCU" :visible.sync="crud.status.cu > 0" :title="crud.status.title" width="1200px">
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="150px">
<el-form-item label="关联商品:" prop="goodsId">
<el-cascader
ref="cascader"
v-model="form.goodsId"
@change="change"
placeholder="试试搜索：眼镜"
:options="cateList"
:props="props"
filterable></el-cascader>
<!-- <el-input v-model="form.goodsId" style="width: 370px;" />-->
</el-form-item>
<el-row :gutter="24">
<el-col v-bind="grid2">
<el-form-item label="评测介绍">
<el-input v-model="form.synopsis" type="textarea" style="width: 370px;" />
</el-form-item>
</el-col>
<el-col v-bind="grid2">
<el-form-item label="评测视频" prop="videoInput">
<!-- <el-input v-model="form.videoInput" style="width: 370px;" />-->
<MaterialList v-model="picArr" type="image" :num="1" :width="150" :height="150" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="24">
<el-col v-bind="grid2">
<el-form-item label="评测总结">
<el-input v-model="form.summary" type="textarea" style="width: 370px;" />
</el-form-item>
</el-col>
<el-col v-bind="grid2">
<el-form-item label="首页图" prop="homeImage">
<!-- <el-input v-model="form.homeImage" style="width: 370px;" />-->
<MaterialList v-model="picArr" type="image" :num="1" :width="250" :height="150" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="24">
<el-col v-bind="grid2">
<el-form-item label="产品展示文字">
<el-input v-model="form.displaySynopsis" type="textarea" style="width: 370px;" />
</el-form-item>
</el-col>
<el-col v-bind="grid2">
<el-form-item label="产品展示图集">
<!-- <el-input v-model="form.displayImage" style="width: 370px;" />-->
<MaterialList v-model="picArr" type="image" :num="1" :width="150" :height="150" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="24">
<el-col v-bind="grid2">
<el-form-item label="实用感受文字">
<el-input v-model="form.feelSynopsis" type="textarea" style="width: 370px;" />
</el-form-item>
</el-col>
<el-col v-bind="grid2">
<el-form-item label="实用感受图集">
<!-- <el-input v-model="form.feelImage" style="width: 370px;" />-->
<MaterialList v-model="picArr" type="image" :num="1" :width="150" :height="150" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="24">
<el-col v-bind="grid2">
<el-form-item label="易用感受文字">
<el-input v-model="form.accessibilitySynopsis" type="textarea" style="width: 370px;" />
</el-form-item>
</el-col>
<el-col v-bind="grid2">
<el-form-item label="易用感受图集">
<!-- <el-input v-model="form.accessibilityImage" style="width: 370px;" />-->
<MaterialList v-model="picArr" type="image" :num="1" :width="150" :height="150" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="24">
<el-col v-bind="grid2">
<el-form-item label="是否展示">
<el-radio-group v-model="form.isShow" style="width: 178px">
<el-radio :label="1">显示</el-radio>
<el-radio :label="0">隐藏</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col v-bind="grid2">
<el-form-item label="排序" prop="sort">
<el-input v-model="form.sort" style="width: 370px;" />
</el-form-item>
</el-col>
</el-row>
<!-- <el-form-item label="tenantId">-->
<!-- <el-input v-model="form.tenantId" style="width: 370px;" />-->
<!-- </el-form-item>-->
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="text" @click="crud.cancelCU">取消</el-button>
<el-button :loading="crud.cu === 2" type="primary" @click="crud.submitCU">确认</el-button>
</div>
</el-dialog>
<!--表格渲染-->
<el-table ref="table" v-loading="crud.loading" :data="crud.data" size="small" style="width: 100%;" @selection-change="crud.selectionChangeHandler">
<el-table-column type="selection" width="55" />
<el-table-column v-if="columns.visible('id')" prop="id" label="评测ID" />
<el-table-column v-if="columns.visible('homeImage')" prop="homeImage" label="首页图" />
<el-table-column v-if="columns.visible('synopsis')" prop="synopsis" label="评测介绍" />
<!-- <el-table-column v-if="columns.visible('videoInput')" prop="videoInput" label="评测视频" />-->
<el-table-column v-if="columns.visible('goodsId')" prop="goodsId" label="关联商品" />
<el-table-column v-if="columns.visible('summary')" prop="summary" label="评测总结" />
<!-- <el-table-column v-if="columns.visible('displayImage')" prop="displayImage" label="产品展示图集" />-->
<el-table-column v-if="columns.visible('displaySynopsis')" prop="displaySynopsis" label="产品简介" />
<!-- <el-table-column v-if="columns.visible('feelImage')" prop="feelImage" label="实用体验感受图" />-->
<el-table-column v-if="columns.visible('feelSynopsis')" prop="feelSynopsis" label="实用感受" />
<!-- <el-table-column v-if="columns.visible('accessibilityImage')" prop="accessibilityImage" label="易用性体验图" />-->
<el-table-column v-if="columns.visible('accessibilitySynopsis')" prop="accessibilitySynopsis" label="易用感受" />
<el-table-column v-if="columns.visible('createTime')" prop="createTime" label="添加时间">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime) }}</span>
</template>
</el-table-column>
<el-table-column v-if="columns.visible('updateTime')" prop="updateTime" label="更新时间">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.updateTime) }}</span>
</template>
</el-table-column>
<!-- <el-table-column v-if="columns.visible('isDel')" prop="isDel" label="是否删除" />-->
<el-table-column v-if="columns.visible('isShow')" label="状态" align="center" prop="isShow">
<template slot-scope="scope">
<div>
<el-tag v-if="scope.row.isShow === 1" :type="''">显示</el-tag>
<el-tag v-else :type=" 'info' ">隐藏</el-tag>
</div>
</template>
</el-table-column>
<el-table-column v-if="columns.visible('sort')" prop="sort" label="排序" />
<!-- <el-table-column v-if="columns.visible('tenantId')" prop="tenantId" label="tenantId" />-->
<el-table-column v-permission="['admin','yxEvaluation:edit','yxEvaluation:del']" label="操作" width="150px" align="center">
<template slot-scope="scope">
<udOperation
:data="scope.row"
:permission="permission"
/>
</template>
</el-table-column>
</el-table>
<!--分页组件-->
<pagination />
</div>
</div>
</template>
<script>
import crudYxEvaluation from '@/api/yxEvaluation'
import CRUD, { presenter, header, form, crud } from '@crud/crud'
import rrOperation from '@crud/RR.operation'
import crudOperation from '@crud/CRUD.operation'
import udOperation from '@crud/UD.operation'
import pagination from '@crud/Pagination'
import MaterialList from "@/components/material";
import {getInfo} from "@/api/bxg/yxStoreProduct";
import {initData} from "@/api/bxg/data";
// crud交由presenter持有
const defaultCrud = CRUD({ title: '评测', url: 'bxg/api/yxEvaluation', sort: 'id,desc', crudMethod: { ...crudYxEvaluation }})
const defaultForm = { id: null, homeImage: null, synopsis: null,videoInput:null,
goodsId: null, summary: null, displayImage: null,displaySynopsis:null,feelImage: null,
feelSynopsis: null, accessibilityImage: null, accessibilitySynopsis: null,createTime:null,
updateTime:null,isDel:null,isShow:1,sort:null,tenantId:null,
}
export default {
name: 'YxEvaluation',
components: { pagination, crudOperation, rrOperation, udOperation ,MaterialList},
mixins: [presenter(defaultCrud), header(), form(defaultForm), crud()],
data() {
return {
//分类列表
cateList:[{
value:'',
label:'',
}],
props:{
// emitPath:false,
lazy: true,
value: 'value',
label: 'label',
lazyLoad (node, resolve) {
console.log('node, resolve',node, resolve)
const { level,value } = node;
setTimeout(arrayLike => {
let productList=[]
initData('/bxg/api/yxStoreProduct', {
page: 0,
size: 999,
sort: 'id,desc',
cateId:value,
}).then(data => {
console.log('data', data);
//获取当前分类下的商品列表
productList = data.content
const nodes = Array.from(productList,item=>({
value: item.id,
label: item.storeName,
//判断是不是子节点
leaf: level >=1
}), {length: level + 1})
console.log('node, resolve',nodes)
// 通过调用resolve将子节点数据返回，通知组件数据加载完成
resolve(nodes);
})
}, 1000);
}
},
picArr:[],
permission: {
add: ['admin', 'yxEvaluation:add'],
edit: ['admin', 'yxEvaluation:edit'],
del: ['admin', 'yxEvaluation:del']
},
grid2: {
xl: 10,
lg: 12,
md: 12,
sm: 24,
xs: 24
},
rules: {
videoInput: [
{ required: true, message: '评测视频未上传', trigger: 'blur' }
],
goodsId: [
{ required: true, message: '评测关联商品不能为空', trigger: 'blur' }
],
synopsis: [
{ required: true, message: '评测介绍不能为空', trigger: 'blur' }
],
summary: [
{ required: true, message: '评测总结不能为空', trigger: 'blur' }
],
homeImage: [
{ required: true, message: '首页图不能为空', trigger: 'blur' }
],
sort: [
{ required: true, message: '未排序', trigger: 'blur' }
]
}
}
},
watch: {
picArr: function(val) {
console.log();
this.form.videoInput = val.join(',')
}
},
mounted () {
this.getInfo();
},
methods: {
change(val){
console.log('change',val)
if (val.length==2){
console.log('选的子级',this.form.goodsId)
this.form.goodsId=val[1]
}else{
console.log('选的父级',this.form.goodsId)
this.form.goodsId=null
this.$refs.cascader.checkedValue=''
}
},
getInfo(){
//查询商品分类
let that = this;
getInfo(0).then(async res => {
//商品分类
that.cateList = res.cateList
}).catch(res => {
console.log('err:'+res)
return this.$message({
message:res.msg,
type: 'error'
});
})
},
// 获取数据前设置好接口地址
[CRUD.HOOK.beforeRefresh]() {
return true
}, // 新增与编辑前做的操作
[CRUD.HOOK.afterToCU](crud, form) {
this.picArr = []
if (form.image && form.id) {
this.picArr = form.image.split(',')
}
},
}
}
</script>
<style scoped>
.table-img {
display: inline-block;
text-align: center;
background: #ccc;
color: #fff;
white-space: nowrap;
position: relative;
overflow: hidden;
vertical-align: middle;
width: 32px;
height: 32px;
line-height: 32px;
}
</style>
Write Preview
Loading…
Cancel
Save