|
|
@@ -1,149 +1,204 @@
|
|
|
<template>
|
|
|
- <div>
|
|
|
- <el-container>
|
|
|
- <el-header style="height: 120px">
|
|
|
- <div id="header-one">
|
|
|
- <h3 class="el-icon-search" style="margin-left: 10px">筛选搜索</h3>
|
|
|
- <div id="header-one-btu">
|
|
|
- <el-button @click="empty">重置</el-button>
|
|
|
- <el-button type="primary" @click="check">搜索</el-button>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div id="header-two">
|
|
|
- <el-row>
|
|
|
- <el-col :span="5" id="header-two-left">
|
|
|
- <el-form ref="anFormRef" label-width="80px">
|
|
|
- <el-form-item label="藏品名称(套):" label-width="102px">
|
|
|
- <el-input v-model="input.value1" class="anInput" placeholder="筛选藏品标题" center></el-input>
|
|
|
- </el-form-item>
|
|
|
- </el-form>
|
|
|
- </el-col>
|
|
|
- <el-col :span="12">
|
|
|
- <el-form label-width="80px">
|
|
|
- <el-form-item label="创建时间:">
|
|
|
- <el-date-picker v-model="input.value2" type="datetimerange" class="up-input-right" range-separator="至"
|
|
|
- start-placeholder="开始日期" end-placeholder="结束日期" align="right">
|
|
|
- </el-date-picker>
|
|
|
- </el-form-item>
|
|
|
- </el-form>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- </div>
|
|
|
- </el-header>
|
|
|
- <el-main style="height: 110px">
|
|
|
- <h3 class="el-icon-tickets">套系列表 共有{{ total }}条数据</h3>
|
|
|
- <el-button id="main-btu" @click="addSet">添加</el-button>
|
|
|
- </el-main>
|
|
|
- <div class="footer">
|
|
|
- <el-row class="state">
|
|
|
- <el-button :class="flag == 0 ? 'active' : ''" size="small" @click="onSalel">在售</el-button>
|
|
|
- <el-button :class="flag == 1 ? 'active' : ''" size="small" @click="preSale">预售</el-button>
|
|
|
- <el-button :class="flag == 2 ? 'active' : ''" size="small" @click="expired">已过期</el-button>
|
|
|
- </el-row>
|
|
|
-
|
|
|
- <el-table :data="tableData" border style="width: 100%">
|
|
|
- <el-table-column prop="tetherId" label="id" width="110" align="center">
|
|
|
- </el-table-column>
|
|
|
- <el-table-column prop="tetherName" label="藏品名称(套)" width="220" align="center">
|
|
|
- </el-table-column>
|
|
|
- <el-table-column prop="showTimeStart" label="创建时间" width="220" align="center">
|
|
|
- </el-table-column>
|
|
|
- <el-table-column prop="showTimeEnd" label="结束时间" width="220" align="center">
|
|
|
- </el-table-column>
|
|
|
- <el-table-column prop="number" label="藏品数量" width="195" align="center">
|
|
|
- </el-table-column>
|
|
|
- <el-table-column prop="status" label="状态" width="200" align="center">
|
|
|
- </el-table-column>
|
|
|
- <el-table-column prop="edit" label="操作" width="280" align="center">
|
|
|
- <template slot-scope="scope">
|
|
|
- <el-button type="text" @click="sList(scope.row)">藏品列表</el-button>
|
|
|
- <el-row>
|
|
|
- <el-button type="text" @click="upJia">上架</el-button>
|
|
|
- <el-button type="text" @click="editTime">修改时间</el-button>
|
|
|
- </el-row>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
- <el-pagination @current-change="handleCurrentChange" background layout="total, prev, pager, next" :total="total"
|
|
|
- id="page" :page-size="10">
|
|
|
- </el-pagination>
|
|
|
- </div>
|
|
|
- </el-container>
|
|
|
- </div>
|
|
|
+ <div>
|
|
|
+ <el-card>
|
|
|
+ <el-page-header @back="goback" content="套系列表"></el-page-header>
|
|
|
+ </el-card>
|
|
|
+ <el-container>
|
|
|
+ <el-header style="height: 120px;">
|
|
|
+ <div id="header-one">
|
|
|
+ <h3 class="el-icon-search" style="margin-left: 10px;">筛选搜索</h3>
|
|
|
+ <div id="header-one-btu">
|
|
|
+ <el-button @click="empty">重置</el-button>
|
|
|
+ <el-button type="primary" @click="check">搜索</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div id="header-two">
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="5" id="header-two-left">
|
|
|
+ <el-form ref="anFormRef" :model="anForm" label-width="80px">
|
|
|
+ <el-form-item label="藏品名称(套):" label-width="102px">
|
|
|
+ <el-input v-model="anForm.anName" class="anInput" placeholder="筛选藏品标题"
|
|
|
+ center></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form label-width="80px">
|
|
|
+ <el-form-item label="创建时间:">
|
|
|
+ <el-date-picker v-model="dataput" type="datetimerange" class="up-input-right"
|
|
|
+ range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" align="right">
|
|
|
+ </el-date-picker>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+ </el-header>
|
|
|
+ <el-main style="height: 110px;">
|
|
|
+ <h3 class="el-icon-tickets">套系列表 共有{{ total }}条数据</h3>
|
|
|
+ <el-button id="main-btu" @click="addSet()">添加</el-button>
|
|
|
+ </el-main>
|
|
|
+ <div class="footer">
|
|
|
+ <!-- 这破玩意帮点击为啥不好使...... -->
|
|
|
+ <!-- <el-radio-group v-model="tabPosition">
|
|
|
+ <el-radio-button label="onSale" tab-click="onSale1">在售</el-radio-button>
|
|
|
+ <el-radio-button label="preSale" @click="preSale()">预售</el-radio-button>
|
|
|
+ <el-radio-button label="expired" @click="expired()">已过期</el-radio-button>
|
|
|
+ </el-radio-group> -->
|
|
|
+ <el-row>
|
|
|
+ <!-- 这块样式需要index没有只能先这么写 -->
|
|
|
+ <el-button size="small" @click="onSale1()" :class="btnact">在售</el-button>
|
|
|
+ <el-button size="small" @click="preSale()" :class="btnact1">预售</el-button>
|
|
|
+ <el-button size="small" @click="expired()" :class="btnact2">已过期</el-button>
|
|
|
+ </el-row>
|
|
|
+ <!-- 非响应式？？‘’‘不是非响应式上面帮点击时间不好使 -->
|
|
|
+ <el-table :data="tableData" border style="width: 100%">
|
|
|
+ <el-table-column prop="id" label="id" width="110" align="center">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="name" label="藏品名称(套)" width="280" align="center">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="time" label="创建时间" width="280" align="center">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="time2" label="展示时间" width="280" align="center">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="number" label="藏品数量" width="280" align="center">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="tai" label="状态" width="280" align="center">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="edit" label="操作" width="280" align="center">
|
|
|
+ <el-button type="text" @click="sList()">藏品列表</el-button>
|
|
|
+ <el-row>
|
|
|
+ <el-button type="text" @click="upJia()">上架</el-button>
|
|
|
+ <el-button type="text" @click="editTime()">修改时间</el-button>
|
|
|
+ </el-row>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
+ </el-container>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
<script>
|
|
|
-import { selectether, sellingList, advanceList, selledList } from "@/api/sets/index";
|
|
|
+import { getSet, searchSet ,setList} from "@/api/sets/index"
|
|
|
export default {
|
|
|
- data() {
|
|
|
- return {
|
|
|
- pageInfo: { // 分页信息
|
|
|
- pageNum: 1,
|
|
|
- pageSize: 10,
|
|
|
- },
|
|
|
- input: {
|
|
|
- value1: "", // 搜索姓名
|
|
|
- value2: "", // 搜索时间
|
|
|
- },
|
|
|
- total: 1,
|
|
|
- flag: 0,
|
|
|
- tableData: [],
|
|
|
- startTime: [],
|
|
|
- endTime: [],
|
|
|
- };
|
|
|
- },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ anForm: {
|
|
|
+ anName: '',
|
|
|
+ },
|
|
|
+ total: 1,
|
|
|
+ dataput: '',
|
|
|
+ activeName: 'first',
|
|
|
+ //列表
|
|
|
+ tabPosition: 'onSale',
|
|
|
+ //
|
|
|
+ btnact: 'th',
|
|
|
+ btnact1: 'th1',
|
|
|
+ btnact2: 'th2',
|
|
|
+ tableData: [{
|
|
|
+ id: '17',
|
|
|
+ name: 'wangxiu',
|
|
|
+ time: '20230218',
|
|
|
+ time2: '20230218',
|
|
|
+ number: '7',
|
|
|
+ tai: '已上线',
|
|
|
+ edit: 'caozuo'
|
|
|
+ }],
|
|
|
+ }
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ activeName(newVal, oldVal) {
|
|
|
+ console.log(newVal, "\n", oldVal)
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+
|
|
|
mounted() {
|
|
|
- this.flag = 0;
|
|
|
- this.sellingsList();
|
|
|
+ this.setsList();
|
|
|
},
|
|
|
methods: {
|
|
|
handleCurrentChange(newPage) {
|
|
|
this.pageInfo.pageNum = newPage;
|
|
|
this.setsList();
|
|
|
},
|
|
|
- // 在售
|
|
|
- sellingsList() {
|
|
|
- sellingList(this.pageInfo).then((res) => {
|
|
|
+ setsList() {
|
|
|
+ setList(this.pageInfo).then((res) => {
|
|
|
+ console.log(res);
|
|
|
this.tableData = res.rows;
|
|
|
this.total = res.total;
|
|
|
});
|
|
|
},
|
|
|
- // 预售
|
|
|
- advancesList() {
|
|
|
- advanceList(this.pageInfo).then((res) => {
|
|
|
- this.tableData = res.rows;
|
|
|
- this.total = res.total;
|
|
|
- });
|
|
|
+ goback() {
|
|
|
+ window.history.go(-1);
|
|
|
},
|
|
|
- // 已过期
|
|
|
- selledsList() {
|
|
|
- selledList(this.pageInfo).then((res) => {
|
|
|
- this.tableData = res.rows;
|
|
|
- this.total = res.total;
|
|
|
+ //点击标签切换修改后
|
|
|
+ onSale1() {
|
|
|
+ console.log("11");
|
|
|
+ if (this.btnact == "activeBack") {
|
|
|
+ this.btnact = "th";
|
|
|
+ this.btnact1 = "activeBack1";
|
|
|
+ this.btnact2 = "activeBack2";
|
|
|
+ } else {
|
|
|
+ this.btnact = "activeBack";
|
|
|
+ this.btnact1 = "th1";
|
|
|
+ this.btnact2 = "th2";
|
|
|
+ }
|
|
|
+ setList(this.pageInfo).then((res) => {
|
|
|
+ this.startTime = res.rows.showTimeStart;
|
|
|
+ this.endTime = res.rows.showTimeEnd;
|
|
|
});
|
|
|
},
|
|
|
-
|
|
|
-
|
|
|
- // 点击标签切换修改后
|
|
|
- onSalel() {
|
|
|
- this.flag = 0;
|
|
|
- this.sellingsList();
|
|
|
- },
|
|
|
preSale() {
|
|
|
- this.flag = 1;
|
|
|
- this.advancesList();
|
|
|
+ console.log("222");
|
|
|
+ if (this.btnact1 == "activeBack1") {
|
|
|
+ this.btnact1 = "th1";
|
|
|
+ this.btnact = "activeBack";
|
|
|
+ this.btnact2 = "activeBack2";
|
|
|
+ } else {
|
|
|
+ this.btnact1 = "activeBack1";
|
|
|
+ this.btnact = "th";
|
|
|
+ this.btnact2 = "th2";
|
|
|
+ }
|
|
|
+ // this.tableData = [
|
|
|
+ // {
|
|
|
+ // id: "17",
|
|
|
+ // name: "wangxiu 预售",
|
|
|
+ // time: "20230218",
|
|
|
+ // time2: "20230218",
|
|
|
+ // number: "7",
|
|
|
+ // tai: "已上线",
|
|
|
+ // edit: "caozuo",
|
|
|
+ // },
|
|
|
+ // ];
|
|
|
},
|
|
|
expired() {
|
|
|
- this.flag = 2;
|
|
|
- this.selledsList();
|
|
|
+ console.log("333");
|
|
|
+ if (this.btnact2 == "activeBack2") {
|
|
|
+ this.btnact2 = "th2";
|
|
|
+ this.btnact = "activeBack";
|
|
|
+ this.btnact1 = "activeBack1";
|
|
|
+ } else {
|
|
|
+ this.btnact2 = "activeBack";
|
|
|
+ this.btnact = "th";
|
|
|
+ this.btnact1 = "th1";
|
|
|
+ }
|
|
|
+ // this.tableData = [
|
|
|
+ // {
|
|
|
+ // id: "17",
|
|
|
+ // name: "wangxiu77777",
|
|
|
+ // time: "20230218",
|
|
|
+ // time2: "20230218",
|
|
|
+ // number: "7",
|
|
|
+ // tai: "已上线",
|
|
|
+ // edit: "caozuo",
|
|
|
+ // },
|
|
|
+ // ];
|
|
|
},
|
|
|
-
|
|
|
-
|
|
|
- // 重置
|
|
|
+ //重置
|
|
|
empty() {
|
|
|
this.input.value1 = "";
|
|
|
this.dataput = "";
|
|
|
},
|
|
|
- // 搜索
|
|
|
+ //搜索
|
|
|
check() {
|
|
|
if (this.input.value1 || this.input.value2) {
|
|
|
let startTime = this.$formatDate(
|
|
|
@@ -159,113 +214,161 @@ export default {
|
|
|
tetherTimeStart: startTime,
|
|
|
tetherTimeEnd: endTime,
|
|
|
};
|
|
|
+ // console.log(searchCon);
|
|
|
selectether(searchCon).then((res) => {
|
|
|
+ console.log(res);
|
|
|
this.tableData = res.rows;
|
|
|
this.total = res.total;
|
|
|
});
|
|
|
} else {
|
|
|
- this.setsList();
|
|
|
+ this.getnotice();
|
|
|
}
|
|
|
- },
|
|
|
-
|
|
|
- // 添加
|
|
|
- addSet() {
|
|
|
- this.$router.push("./addSet");
|
|
|
- },
|
|
|
- // 藏品列表
|
|
|
- sList(rows) {
|
|
|
- this.$router.push({ name: "collectionList", params: { rows } });
|
|
|
- },
|
|
|
- // 上架
|
|
|
- upJia() {
|
|
|
- this.$confirm("是否要上架商品?", "提示", {
|
|
|
- confirmButtonText: "确定",
|
|
|
- cancelButtonText: "取消",
|
|
|
- type: "warning",
|
|
|
- })
|
|
|
- .then(() => {
|
|
|
- this.$message({
|
|
|
- type: "success",
|
|
|
- message: "上架成功!",
|
|
|
- });
|
|
|
- })
|
|
|
- .catch(() => {
|
|
|
- this.$message({
|
|
|
- type: "info",
|
|
|
- message: "已取消",
|
|
|
- });
|
|
|
+ },
|
|
|
+ //添加
|
|
|
+ addSet() {
|
|
|
+ this.$router.push('./addSet')
|
|
|
+ },
|
|
|
+ //藏品列表
|
|
|
+ sList() {
|
|
|
+ this.$router.push('./collectionDetails')
|
|
|
+ },
|
|
|
+ //上架
|
|
|
+ upJia() {
|
|
|
+ this.$confirm('是否要上架商品?', '提示', {
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning'
|
|
|
+ }).then(() => {
|
|
|
+ this.$message({
|
|
|
+ type: 'success',
|
|
|
+ message: '上架成功!'
|
|
|
});
|
|
|
- },
|
|
|
- // 修改时间
|
|
|
- editTime() {
|
|
|
- console.log("修改时间");
|
|
|
- },
|
|
|
- },
|
|
|
+ }).catch(() => {
|
|
|
+ this.$message({
|
|
|
+ type: 'info',
|
|
|
+ message: '已取消'
|
|
|
+ });
|
|
|
+ });
|
|
|
+
|
|
|
+ },
|
|
|
+ //修改时间
|
|
|
+ editTime() {
|
|
|
+ console.log("修改时间")
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ }
|
|
|
};
|
|
|
+
|
|
|
</script>
|
|
|
<style scoped>
|
|
|
.el-main {
|
|
|
- color: #333;
|
|
|
- border: 1px solid #d3d7d4;
|
|
|
- border-radius: 5px;
|
|
|
- margin-left: 30px;
|
|
|
- margin-right: 30px;
|
|
|
+ color: #333;
|
|
|
+ border: 1px solid #d3d7d4;
|
|
|
+ border-radius: 5px;
|
|
|
+ margin-left: 30px;
|
|
|
+ margin-right: 30px;
|
|
|
}
|
|
|
|
|
|
.el-header {
|
|
|
- color: #333;
|
|
|
- border: 1px solid #d3d7d4;
|
|
|
- border-radius: 5px;
|
|
|
- margin: 30px;
|
|
|
+ color: #333;
|
|
|
+ border: 1px solid #d3d7d4;
|
|
|
+ border-radius: 5px;
|
|
|
+ margin: 30px;
|
|
|
}
|
|
|
|
|
|
/* .el-footer {} */
|
|
|
|
|
|
#footer-t {
|
|
|
- color: #333;
|
|
|
- border: 1px solid #d3d7d4;
|
|
|
- border-radius: 5px;
|
|
|
- margin-left: 10px;
|
|
|
- margin-top: 30px;
|
|
|
+ color: #333;
|
|
|
+ border: 1px solid #d3d7d4;
|
|
|
+ border-radius: 5px;
|
|
|
+ margin-left: 10px;
|
|
|
+ margin-top: 30px;
|
|
|
}
|
|
|
|
|
|
/* #header-one {} */
|
|
|
|
|
|
#header-two {
|
|
|
- /* background-color: aqua; */
|
|
|
- margin-left: 90px;
|
|
|
+ /* background-color: aqua; */
|
|
|
+ margin-left: 90px;
|
|
|
}
|
|
|
|
|
|
#header-one-btu {
|
|
|
- margin: 20px 20px 0px 0px;
|
|
|
- float: right;
|
|
|
+ margin: 20px 20px 0px 0px;
|
|
|
+ float: right;
|
|
|
}
|
|
|
|
|
|
#header-two-left {
|
|
|
- margin-right: 150px;
|
|
|
+ margin-right: 150px;
|
|
|
}
|
|
|
|
|
|
#main-btu {
|
|
|
- float: right;
|
|
|
- margin-top: 10px;
|
|
|
+ float: right;
|
|
|
+ margin-top: 10px;
|
|
|
}
|
|
|
|
|
|
#page {
|
|
|
- float: right;
|
|
|
- margin-top: 15px;
|
|
|
+ float: right;
|
|
|
+ margin-top: 15px;
|
|
|
}
|
|
|
|
|
|
.footer {
|
|
|
- margin: 20px auto;
|
|
|
- width: 97%;
|
|
|
+ margin: 20px auto;
|
|
|
+ width: 97%;
|
|
|
+}
|
|
|
+
|
|
|
+.th {
|
|
|
+ /* margin: 0;
|
|
|
+ padding: 0; */
|
|
|
+ margin-right: -10.75px;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 800;
|
|
|
+ background-color: #FFFFFF;
|
|
|
+ color: #606266;
|
|
|
+}
|
|
|
+
|
|
|
+.activeBack {
|
|
|
+ margin-right: -10.75px;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 800;
|
|
|
+ background-color: #409EFF;
|
|
|
+ color: white;
|
|
|
+}
|
|
|
+
|
|
|
+.th1 {
|
|
|
+ /* margin: 0;
|
|
|
+ padding: 0; */
|
|
|
+ margin-right: -10.75px;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 800;
|
|
|
+ background-color: #FFFFFF;
|
|
|
+ color: #606266;
|
|
|
+}
|
|
|
+
|
|
|
+.activeBack1 {
|
|
|
+ margin-right: -10.75px;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 800;
|
|
|
+ background-color: #409EFF;
|
|
|
+ color: white;
|
|
|
}
|
|
|
|
|
|
-.state button {
|
|
|
- margin: 0;
|
|
|
+.th2 {
|
|
|
+ /* margin: 0;
|
|
|
+ padding: 0; */
|
|
|
+ margin-right: -10.75px;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 800;
|
|
|
+ background-color: #FFFFFF;
|
|
|
+ color: #606266;
|
|
|
}
|
|
|
|
|
|
-.active {
|
|
|
- color: white;
|
|
|
- background-color: #409eff;
|
|
|
+.activeBack2 {
|
|
|
+ margin-right: -10.75px;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 800;
|
|
|
+ background-color: #409EFF;
|
|
|
+ color: white;
|
|
|
}
|
|
|
-</style>
|
|
|
+</style>
|
nanshan