| | |
| | | <template> |
| | | <div> |
| | | <el-row > |
| | | <el-col :span="18"><el-form label-width="80px" :inline="true" :label-position="labelPosition" :model="formInline" class="form-inline"> |
| | | <el-form-item label="标题"> |
| | | <el-input v-model="formInline.title" placeholder="标题"></el-input> |
| | | </el-form-item> |
| | | |
| | | <el-form-item label="描述"> |
| | | <el-input v-model="formInline.desp" placeholder="描述"></el-input> |
| | | </el-form-item> |
| | | |
| | | |
| | | <el-form-item > |
| | | <el-button type="primary" @click="query_">查询</el-button> |
| | | <el-button type="info" @click="empty_">重置</el-button> |
| | | </el-form-item> |
| | | |
| | | |
| | | </el-form></el-col> |
| | | <el-col :span="4" ><el-button type="primary" @click="createNew">创建</el-button></el-col> |
| | | </el-row> |
| | | |
| | | |
| | | <div class="infinite-list-wrapper" style="overflow:auto"> |
| | | <ul class="list" v-infinite-scroll="load" infinite-scroll-disabled="disabled"> |
| | | <li v-for="item in dataList" :key = "item.id" class="list-item"> |
| | | <el-row> |
| | | <el-col :span="8"><div class="grid-content">{{item.title}}</div></el-col> |
| | | <el-col :span="4" :><div class="grid-content">{{item.time}}</div></el-col> |
| | | |
| | | <div class="list" v-infinite-scroll="load" infinite-scroll-disabled="disabled"> |
| | | <div v-for="one in dataList" :key="one.id" class="list-item" @click="showItem(one)"> |
| | | <el-row > |
| | | <el-col :span="8"><div class="grid-content">{{one.title}}</div></el-col> |
| | | <el-col :span="4" :offset="12"><div class="">{{one.time}}</div></el-col> |
| | | </el-row> |
| | | |
| | | <el-row> |
| | | <el-col :span="20"><div class="grid-content">{{item.desp}}</div></el-col> |
| | | <el-col :span="20"><div class="grid-content">{{one.desp}}</div></el-col> |
| | | </el-row> |
| | | </li> |
| | | </ul> |
| | | <el-divider></el-divider> |
| | | </div> |
| | | </div> |
| | | <p v-if="loading">加载中...</p> |
| | | <p v-if="noMore">没有更多了</p> |
| | | </div> |
| | | <el-dialog |
| | | title="详情" |
| | | :visible.sync="dialogVisible" |
| | | width="40%" |
| | | height="40%" |
| | | :before-close="handleClose"> |
| | | <span>{{selectOne.title}}</span> |
| | | <el-divider></el-divider> |
| | | <div style="content"> |
| | | <span>{{selectOne.desp}}</span> |
| | | </div> |
| | | |
| | | <span slot="footer" class="dialog-footer"> |
| | | <el-button :v-if="selectOne.attachment == '' ? false: true" type="primary" @click="download">下 载</el-button> |
| | | </span> |
| | | </el-dialog> |
| | | |
| | | <el-dialog title="创建话题" :visible.sync="dialogFormVisible"> |
| | | <el-form :model="form"> |
| | | <el-form-item label="话题名称" :label-width="formLabelWidth"> |
| | | <el-input v-model="form.name" autocomplete="off"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="话题内容" :label-width="formLabelWidth"> |
| | | <el-input type="textarea" v-model="form.desp" autocomplete="off"></el-input> |
| | | </el-form-item> |
| | | <el-upload |
| | | class="upload-demo" |
| | | :on-preview="handlePreview" |
| | | :on-remove="handleRemove" |
| | | :before-remove="beforeRemove" |
| | | :limit="1" |
| | | :auto-upload='false' |
| | | :on-exceed="handleExceed" |
| | | :file-list="fileList"> |
| | | <el-button size="small" type="primary">点击上传</el-button> |
| | | <div slot="tip" class="el-upload__tip">不超过50M</div> |
| | | </el-upload> |
| | | </el-form> |
| | | <div slot="footer" class="dialog-footer"> |
| | | <el-button @click="dialogFormVisible = false">取 消</el-button> |
| | | <el-button type="primary" @click="dialogFormVisible = false">确 定</el-button> |
| | | </div> |
| | | </el-dialog> |
| | | |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import squareList from "./squareList.vue"; |
| | | |
| | | export default { |
| | | data() { |
| | | return { |
| | | form:{}, |
| | | fileList: [], |
| | | dialogVisible: false, |
| | | dialogFormVisible: false, |
| | | labelPosition: "left", |
| | | formInline:{}, |
| | | selectOne:{ |
| | | title:"biaoti", |
| | | desp:"miaoshu", |
| | | attachment:"222" |
| | | }, |
| | | dataList: [ |
| | | {id:1,title:"11",desp:"111",time:"11-11"}, |
| | | {id:1,title:"11",desp:"111",time:"11-11"}, |
| | | {id:1,title:"11",desp:"111",time:"11-11"}, |
| | | {id:1,title:"11",desp:"111",time:"11-11"}, |
| | | {id:1,title:"11",desp:"111",time:"11-11"}, |
| | | {id:1,attachment:"222",title:"标题", desp:"描述121212121212", time:"12分钟前"}, |
| | | {id:1,attachment:"222",title:"11", desp:"111", time:"11111"}, |
| | | {id:1,attachment:"",title:"11", desp:"111", time:"11111"}, |
| | | {id:1,attachment:"",title:"11", desp:"111", time:"11111"}, |
| | | ], |
| | | loading: false |
| | | } |
| | |
| | | } |
| | | }, |
| | | methods: { |
| | | handleRemove(file, fileList) { |
| | | console.log(file, fileList); |
| | | }, |
| | | handlePreview(file) { |
| | | console.log(file); |
| | | }, |
| | | handleExceed(files, fileList) { |
| | | this.$message.warning(`当前限制选择 3 个文件,本次选择了 ${files.length} 个文件,共选择了 ${files.length + fileList.length} 个文件`); |
| | | }, |
| | | beforeRemove(file, fileList) { |
| | | return this.$confirm(`确定移除 ${ file.name }?`); |
| | | }, |
| | | load() { |
| | | // this.loading = true |
| | | // setTimeout(() => { |
| | | // this.count += 2 |
| | | // this.loading = false |
| | | // }, 2000) |
| | | } |
| | | }, |
| | | showItem(one) { |
| | | this.dialogVisible = true; |
| | | this.selectOne = one; |
| | | }, |
| | | createNew() { |
| | | this.dialogFormVisible = true; |
| | | }, |
| | | empty_() { |
| | | this.formInline = {}; |
| | | this.query_(); |
| | | }, |
| | | query_() { |
| | | this.getData(this.formInline); |
| | | }, |
| | | getData(query) { |
| | | this.loading_table = true; |
| | | let pageno = this.pagenum; |
| | | let url = "/api/scheme/page/" + pageno; |
| | | let params = { |
| | | pageSize: this.pagesize |
| | | }; |
| | | if(query){ |
| | | params.name = query.name; |
| | | params.delay = query.delay; |
| | | params.finish = query.fiish; |
| | | params.type = query.type; |
| | | } |
| | | this.$axios.get(url, { |
| | | params |
| | | }) |
| | | .then(data_ => { |
| | | console.log(data_); |
| | | this.tableData = data_.data.data.records; //给tableData赋值 |
| | | this.total = data_.data.data.total; |
| | | this.loading_table = false; |
| | | }).catch(error => { |
| | | console.log(error); |
| | | }) |
| | | }, |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <style> |
| | | .grid-content{ |
| | | text-align: left; |
| | | padding: 5px; |
| | | } |
| | | .content{ |
| | | |
| | | } |
| | | </style> |