Commit 0ebee773 authored by 赵啸非's avatar 赵啸非

修改附件地址

parent cde9db23
...@@ -153,7 +153,15 @@ export default { ...@@ -153,7 +153,15 @@ export default {
// 格式化单元格数据 // 格式化单元格数据
formatter(row, column, val) { formatter(row, column, val) {
const content = formatter(this.tableData, column, val); const content = formatter(this.tableData, column, val);
return content ? <el-tag type={'info'} size='mini'>{content}</el-tag> : val return content ? (
<el-tag type={"info"} size="mini">
{content}
</el-tag>
) : val ? (
val
) : (
"--"
);
}, },
formatterYES(row, column, val) { formatterYES(row, column, val) {
......
...@@ -9,10 +9,8 @@ ...@@ -9,10 +9,8 @@
*/ */
const formatter = (tableData, column, val) => { const formatter = (tableData, column, val) => {
const key = column.property; const key = column.property;
console.log(val); if(tableData.dict && tableData.dict[key]){
val = val ? val : "--"; const dict = tableData.dict[key]
if (tableData.dict && tableData.dict[key]) {
const dict = tableData.dict[key];
return dict[val] || val; return dict[val] || val;
} }
return val; return val;
......
...@@ -46,6 +46,9 @@ const router = new Router({ ...@@ -46,6 +46,9 @@ const router = new Router({
...restBuilder('basic/set', 'basic/set'),//基础设置 ...restBuilder('basic/set', 'basic/set'),//基础设置
...restBuilder('skin', 'skin'),//皮肤列表
//以下为基础路由配置 //以下为基础路由配置
builder('', 'Home'), builder('', 'Home'),
builder('index', 'Home'), builder('index', 'Home'),
......
<template>
<!-- 弹出框表单 -->
<el-drawer
:title="title"
:visible.sync="open"
:direction="direction"
:destroy-on-close="true"
size="50%">
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-row>
<Field label="所属种类,来源种类" prop="categoryId" v-model="form.categoryId" placeholder="请输入所属种类,来源种类"/>
<Field label="产品id" prop="productId" v-model="form.productId" placeholder="请输入产品id"/>
<Field label="产品名称" prop="productName" v-model="form.productName" type="textarea" placeholder="请输入产品名称"/>
<Field label="css模板合成后文件地址"><fileUpload v-model="form.cssFilePath" prePath="/file/fileupload"/></Field>
<Field label="产品皮肤名称,唯一且不为空" prop="name" v-model="form.name" type="textarea" placeholder="请输入产品皮肤名称,唯一且不为空"/>
<Field label="分辨率 " prop="imageResolution" v-model="form.imageResolution" type="select" :enumData="dict.imageResolution" placeholder="请选择分辨率 "/>
<Field label="预览图片"><imageUpload v-model="form.previewImagePath" prePath="/file/preview"/></Field>
<Field label="排序编号" prop="sortNum" v-model="form.sortNum" placeholder="请输入排序编号"/>
<Field label="是否使用" prop="used" v-model="form.used" type="select" :enumData="dict.used" placeholder="请选择是否使用"/>
</el-row>
<form-buttons @submit='submitForm' v-if="pageInfo.type!='view'" noCancelBtn />
</el-form>
</el-drawer>
</template>
<script>
import form from "@/assets/mixins/formdialog";
export default {
name: "SkinDetail",
mixins: [form],
components: {
},
created() {
this.changePath("skin")
},
data() {
return {
// 遮罩层
loading: true,
// 弹出层标题
title: "皮肤",
// 是否显示弹出层
open: false,
direction:"rtl",
toString:[
"used",
],
toDate:[
],
// 表单校验
rules: {
productName: [
{required: true,message: "请输入产品名称", trigger: "blur" },
{max: 256,message: "最多只能录入256个字符",trigger: "blur",},
],
name: [
{required: true,message: "请输入产品皮肤名称,唯一且不为空", trigger: "blur" },
{max: 256,message: "最多只能录入256个字符",trigger: "blur",},
],
imageResolution: [
{required: true,message: "请输入分辨率 ", trigger: "blur" },
{max: 256,message: "最多只能录入256个字符",trigger: "blur",},
],
previewImagePath: [
{required: true,message: "请输入预览图片", trigger: "blur" },
{max: 256,message: "最多只能录入256个字符",trigger: "blur",},
],
}
};
},
methods: {
/** 编辑 */
edit(row) {
this.reset()
this.query = { id: row.id };
this.urls.currUrl ="skin/edit";
this.getData();
this.pageInfo.type="edit"
this.title = "修改皮肤";
},
/** 新增 */
add(row) {
this.reset()
this.urls.currUrl = "skin/add";
this.getData();
this.pageInfo.type="add"
this.title = "新增皮肤";
},
/** 查看*/
view(row) {
this.reset()
this.query = { id: row.id };
this.urls.currUrl ="skin/view";
this.getData();
this.pageInfo.type="view"
this.title = "皮肤详细";
},
/**取消按钮 */
cancel() {
this.open = false;
},
/**获取数据后弹框 */
afterRender(data) {
this.open = true;
},
afterSubmit(data) {
this.open = false;
this.$emit("ok");
},
// 表单重置
reset() {
this.form = {
categoryId : null,
productId : null,
productName : null,
cssFilePath : null,
name : null,
imageResolution : null,
previewImagePath : null,
sortNum : null,
used : 0,
};
this.resetForm("form");
},
resetForm(refName) {
if (this.$refs[refName]) {
this.$refs[refName].resetFields();
}
},
},
};
</script>
<template>
<div class="page">
<LayoutTable :data="tableData" :config="tableConfig">
</LayoutTable>
<drawer-show ref="drawerform" @ok="getData" />
</div>
</template>
<script>
/** 表单弹出框模式需引入 */
import drawerShow from "./drawershow";
import table from "@/assets/mixins/table";
export default {
name: "SkinList",
components: {
drawerShow
},
mixins: [table],
created() {
},
methods: {
/** 重写新增方法 */
toAdd(row) {
this.$refs.drawerform.add(row);
},
/** 重写编辑方法 */
toEdit(row) {
this.$refs.drawerform.edit(row);
},
/** 重写查看方法 */
toView(row) {
this.$refs.drawerform.view(row);
},
handleSwitch(row) {
console.log(row);
this.loading = true;
if (row.used == 1) {
this.$post("/skin/used", {
id: row.id,
used: 0,
})
.then((res) => {
if (res && res.code && res.code == 1) {
row.used = 0;
}
})
.catch((error) => {
this.$message.error(error.message);
});
} else {
this.$post("/skin/used", {
id: row.id,
used: 1,
})
.then((res) => {
if (res && res.code && res.code == 1) {
row.used = 1;
}
})
.catch((error) => {
this.$message.error(error.message);
});
}
},
},
data() {
return {
config: {
search: [
],
columns: [
{type: "index",label: "序号",width: 50},
{label: "产品名称", prop: "productName"},
{label: "分辨率 ", prop: "imageResolution"},
{label: "预览图片", prop: "previewImagePath",formatter: (row) => {
return row.previewImagePath != "" ? (
<el-image
style="width: 70px; height: 70px"
src={row.previewImagePath}
preview-src-list={[row.previewImagePath]}
></el-image>
) : (
"--"
);
},},
{
label: "默认选择",
align: "center",
prop: "used",
formatter: (row) => {
return (
<el-switch
value={row.used + ""}
active-color="#13ce66"
inactive-color="#ff4949"
active-value="1"
inactive-value="0"
onChange={() => {
this.handleSwitch(row);
}}
></el-switch>
);
},
},
{
label: "操作",
width: 240,
formatter: row => {
return (
<table-buttons noAdd row={row} onEdit={this.toEdit} onView={this.toView} onDel={this.toDel} />
);
}
}
]
}
};
}
};
</script>
<template>
<layout-view>
<el-descriptions :title="title" :column="column" :size="size" :colon="false" border>
<template slot="title">
<i class="el-icon-tickets"></i>
基本详细信息
</template>
<template slot="extra">
<el-button type="primary" @click="$router.go(-1)" size="small">返回</el-button>
</template>
<el-descriptions-item label="所属种类,来源种类" label-class-name="labelClass" content-class-name="contentClass">
{{form.categoryId}}
</el-descriptions-item>
<el-descriptions-item label="产品id" label-class-name="labelClass" content-class-name="contentClass">
{{form.productId}}
</el-descriptions-item>
<el-descriptions-item label="产品名称" label-class-name="labelClass" content-class-name="contentClass">
{{form.productName}}
</el-descriptions-item>
<el-descriptions-item label="css模板合成后文件地址" label-class-name="labelClass" content-class-name="contentClass">
<fileUpload v-model="form.cssFilePath" prePath="/file/fileupload"/>
</el-descriptions-item>
<el-descriptions-item label="产品皮肤名称,唯一且不为空" label-class-name="labelClass" content-class-name="contentClass">
{{form.name}}
</el-descriptions-item>
<el-descriptions-item label="分辨率 " label-class-name="labelClass" content-class-name="contentClass">
{{ util_formatters("imageResolution", form.imageResolution) }}
</el-descriptions-item>
<el-descriptions-item label="预览图片" label-class-name="labelClass" content-class-name="contentClass">
<imageUpload v-model="form.previewImagePath" prePath="/file/preview"/>
</el-descriptions-item>
<el-descriptions-item label="排序编号" label-class-name="labelClass" content-class-name="contentClass">
{{form.sortNum}}
</el-descriptions-item>
<el-descriptions-item label="是否使用" label-class-name="labelClass" content-class-name="contentClass">
{{form.used}}
</el-descriptions-item>
</el-descriptions>
</layout-view>
</template>
<script>
import view from "@/assets/mixins/view";
import ImageUpload from '@/components/ImageUpload';
import FileUpload from '@/components/FileUpload';
export default {
mixins: [view],
components: {
ImageUpload,
FileUpload,
},
methods: {
},
data() {
return {
size:"small",
column:2,
toString:[
"used",
],
toArrays: [
],
toDate: [
]
}
}
}
</script>
<style lang="less">
.labelClass{
width: 200px;
}
.el-descriptions__body{
margin-left: 5px;
margin-right: 5px;
color: #606266;
background-color: #FFF;
}
.contentClass{
width: 600px;
}
</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 to comment