From cae892f7fa165fadbf0c4e8928846f715cda7a88 Mon Sep 17 00:00:00 2001 From: 明梦爽 <2972214568@qq.com> Date: 星期三, 23 三月 2022 18:29:30 +0800 Subject: [PATCH] 增加介绍文档 --- src/components/Administrator/Main.vue | 294 +++++++++++++++++++++++++++++++++++++++++++++++----------- 1 files changed, 236 insertions(+), 58 deletions(-) diff --git a/src/components/Administrator/Main.vue b/src/components/Administrator/Main.vue index 1db10c7..2953c2a 100644 --- a/src/components/Administrator/Main.vue +++ b/src/components/Administrator/Main.vue @@ -1,24 +1,44 @@ <template> <div> - <div class="block"> - <el-cascader - v-model="value" - :options="options" - clearable - filterable - @change="handleChange"> - </el-cascader> - </div> + <!-- 绾ц仈閫夋嫨鍣� --> + <el-row class="block"> + <el-col :span="4"> + <el-cascader + v-model="value" + :options="options" + clearable + filterable + :getCheckedNodes="true" + @change="handleChange"> + </el-cascader> + </el-col> + </el-row> <div> <el-card class="box-card"> - <el-button class="add" type="success" icon="el-icon-plus" @click="goEdit()">鐐瑰嚮鍦ㄨ鍒楄〃涓嬫坊鍔犱竴鏉℃柊闂�</el-button> - <el-table :data="tableData" border style="width: 100%" :header-cell-style="{textAlign: 'center'}" :cell-style="{ textAlign: 'center' }" + <el-row :gutter="40"> + <el-col :span="4"> + <!-- 娣诲姞鏂伴椈鎸夐挳 --> + <el-button el-button class="add" type="success" icon="el-icon-plus" @click="goEdit(newsCategoryId)">鐐瑰嚮鍦ㄨ鍒楄〃涓嬫坊鍔犱竴鏉℃柊闂�</el-button> + </el-col> + <el-col :span="10"> + <!-- 鏂伴椈鎼滅储 --> + <el-input clearable placeholder="璇疯緭鍏ユ墍瑕佹煡璇㈢殑鏂伴椈鏍囬" v-model="search" class="input-with-select"> + </el-input> + </el-col> + </el-row> + <!-- 鏂伴椈琛ㄦ牸鍖哄煙 --> + <el-table + :data="tableData.filter(data => !search || data.title.toLowerCase().includes(search.toLowerCase()))" + border + style="width: 100%" + :header-cell-style="{textAlign: 'center'}" + :cell-style="{ textAlign: 'center' }" > - <!-- :header-cell-style="{textAlign: 'center'}"璁剧疆澶撮儴灞呬腑锛� --> - <!-- :cell-style="{ textAlign: 'center' }"璁剧疆鏁翠釜琛ㄦ牸鍐呭姘村钩灞呬腑锛� --> - <!-- 闂锛氭�庝箞鑾峰彇鏁扮粍涓瘡涓璞$殑key鍊硷紙姣忔潯鏂伴椈鐨刬d锛�? - 瑙e喅锛氶�氳繃浣滅敤鍩熸彃妲� slot-scope 鑾峰彇姣忎釜瀵硅薄 --> - <el-table-column type="index"></el-table-column> + <el-table-column type="index" label="搴忓彿" width="50"> + <template slot-scope="scope"> + <span>{{ (currentPage-1)*pageSize+scope.$index+1 }}</span> + </template> + </el-table-column> <el-table-column prop="releaseTime" label="鏃ユ湡" width="" > </el-table-column> <el-table-column prop="title" label="鏂伴椈鏍囬" width=""> @@ -30,51 +50,84 @@ <!-- {{ scope.row.id }} --> <div> <el-button type="success" @click="look(scope.row.id)">鏌ョ湅</el-button> - <el-button type="warning" @click="amend(scope.row.id)">淇敼</el-button>  - <el-popconfirm - confirm-button-text='鏄殑' - cancel-button-text='鍙栨秷' - icon="el-icon-info" - icon-color="red" - title="纭畾鍒犻櫎璇ユ潯鏂伴椈锛�" - > - <el-button slot="reference">鍒犻櫎</el-button> - </el-popconfirm> + <el-button type="warning" @click="showEditDialog(scope.row.id)">淇敼</el-button> + <el-button type="info" @click="deleteNews(scope.row.id)">鍒犻櫎</el-button> </div> </template> </el-table-column> </el-table> <!-- 鍒嗛〉 --> + <div> + <!-- 鑾峰彇鏂伴椈鍒楄〃鍒嗛〉 --> <div> <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage" - :page-sizes="[3,6,12, 18,]" + :page-sizes="[6,12, 18,]" :page-size="100" layout="total, sizes, prev, pager, next, jumper" :total="total"> </el-pagination> </div> + </div> </el-card> + <!-- 淇敼鏂伴椈鐨勫璇濇 --> + <el-dialog + title="淇敼鏂伴椈" + :visible.sync="editDialogVisible" + width="50%" + :before-close="handleClose"> + <!-- rules琛ㄥ崟楠岃瘉瑙勫垯锛宺ef褰撳墠琛ㄥ崟鐨勯獙璇佸璞� --> + <el-form ref="editFormRef" :model="editForm" label-width="80px" status-icon> + <el-form-item label="id:"> + <el-input v-model="editForm.id" disabled></el-input> + </el-form-item> + <el-form-item label="鏂伴椈鏍囬:"> + <el-input v-model="editForm.title"></el-input> + </el-form-item> + <el-form-item label="鍙戝竷鏃ユ湡:"> + <el-date-picker + v-model="editForm.releaseTime" + type="date" + placeholder="璇烽�夋嫨鍙戝竷鏃ユ湡" + format="yyyy 骞� MM 鏈� dd 鏃�" + value-format="yyyy-MM-dd" + ></el-date-picker> + </el-form-item> + </el-form> + <span slot="footer" class="dialog-footer"> + <el-button @click="editDialogVisible = false">鍙� 娑�</el-button> + <el-button type="primary" @click="editNew()">纭� 瀹�</el-button> + </span> + </el-dialog> </div> </div> </template> <script> -import { getNewsList } from '../../api/api' -import axios from 'axios' +import { getNewsList,getnew,update,deleteNew,fuzzy } from '../../api/api' export default { data() { return { + search:'', + getShow:true, //鑾峰彇鍒嗛〉鐨勬樉绀�(甯冨皵鍊�) + gettable:true, //鑾峰彇琛ㄦ牸鐨勬樉绀� visible: false, + editDialogVisible:false, //鎺у埗淇敼瀵硅瘽妗嗙殑甯冨皵鍊� + AdDialogVisible:false, //瓒呯鐧诲綍瀵硅瘽妗� + Ad:{ username:'',password:'' }, //瓒呯瀵硅薄 + editForm:{}, //鏌ヨ鍒扮殑鏂伴椈瀵硅薄锛岀洰鍓嶄粎渚涗慨鏀逛娇鐢� newsCategoryId:1, //鍏堝瓨涓�涓皬鏍囬id tableData:[], //鏂伴椈鍒楄〃瀵硅薄 + fuzzytableData:[], //妯$硦鏌ヨ鍒楄〃瀵硅薄 pageSize:6, //姣忛〉鏉℃暟 currentPage:1, //褰撳墠椤� - newsList:[], total:0, //鏂伴椈鎬绘潯鏁� + fuzzyShow:false, //妯$硦鏌ヨ鍒嗛〉鐨勬樉绀�(甯冨皵鍊�) + fuzzytable:false, //妯$硦鏌ヨ琛ㄦ牸鐨勬樉绀� + fuzzyForm:{ fuzzytitle:'',fuzzytotal:0,fuzzycurrent:1,fuzzysize:6 }, //妯$硦鏌ヨ鍒楄〃瀵硅薄 value: [], options: [{ value: 1, @@ -90,6 +143,10 @@ { value:44, label: '瀛﹂櫌鍔ㄦ��', + }, + { + value:45, + label: '杞挱鍥�', }], },{ value: 22, @@ -162,26 +219,22 @@ mounted(){ }, methods: { + //淇敼瀵硅瘽妗嗗叧闂殑鏂规硶 + handleClose(done) { + this.$confirm('纭鍏抽棴锛�') + .then(_ => { + done(); + }) + .catch(_ => {}); + }, + //绾ц仈閫夋嫨鍣ㄧ殑鏂规硶 handleChange(value) { - console.log(value); - console.log(value[1]); + // console.log(value); + // console.log(value[1]); + this.currentPage = 1; this.newsCategoryId = value[1]; //灏嗗緱鍒扮殑灏忔爣棰榠d瀛樻斁璧锋潵 this.query(this.newsCategoryId); }, - // query(value){ - // const data = { - // current:this.currentPage, - // newsCategoryId:value[1], - // size:this.pageSize - // }; - // getNewsList(data).then(res=>{ - // console.log(res); - // this.tableData = res.data.records - // this.total = res.data.total - // }).catch(err => { - // console.log(err); - // }) - // }, query(newsCategoryId){ const data = { current:this.currentPage, @@ -189,7 +242,7 @@ size:this.pageSize }; getNewsList(data).then(res=>{ - console.log(res); + // console.log(res); if (res.code !== 200) { return this.$message.error('鑾峰彇鏂伴椈鍒楄〃澶辫触') }else{ @@ -200,14 +253,108 @@ console.log(err); }) }, - //淇敼 - amend(id){ - alert('鐖变綘鍛�'); - console.log('>>>'+id); + //灞曠ず淇敼瀵硅瘽妗� + showEditDialog(id){ + getnew(id).then(res => { + // console.log(res); + if (res.code == 200) { + this.editForm = res.data + } + }) + this.editDialogVisible = true; + }, + //纭畾淇敼琛ㄥ崟鎻愪氦锛岄獙璇佸彂璧疯姹� + editNew(){ + const data = { + id: this.editForm.id, + releaseTime: this.editForm.releaseTime, + title:this.editForm.title + } + update(data).then(res=>{ + console.log('dsadasas',res); + if (res.code == 200) { + this.editDialogVisible =false; + this.$message.success('淇敼鏂伴椈鎴愬姛锛�') + this.query(this.newsCategoryId); + } + }) + }, + //妯$硦鏌ヨ + fuzzyList(title){ + // console.log(title); + if(title == ''){ + return this.$message.error('璇峰厛杈撳叆鏌ヨ鏂伴椈鏍囬锛�') + } + this.fuzzyShow = true //妯$硦鍒嗛〉鏄剧ず + this.getShow = false //鑾峰彇鍒嗛〉闅愯棌 + this.gettable = false + this.fuzzytable = true + const data = { + current: this.fuzzyForm.fuzzycurrent, + size: this.fuzzyForm.fuzzysize, + title:title + } + fuzzy(data).then(res => { + // console.log(res); + if (res.code !== 200) { + return this.$message.error('鏌ヨ鏂伴椈鍒楄〃澶辫触') + }else{ + this.fuzzytableData = res.data.records + this.fuzzyForm.fuzzytotal = res.data.total + } + }).catch(err => { + console.log(err); + }) + }, + //娓呯┖鏌ヨ鍒楄〃鍐呭 + qingKong(){ + this.tableData = [] + this.fuzzytableData = [] + this.fuzzyForm.fuzzytotal = 0 + this.fuzzyShow = false + this.getShow = true + this.fuzzytable = false + this.gettable = true + }, + //鏍规嵁id鍒犻櫎鏂伴椈 + async deleteNews(id){ + // console.log(id); + const res = await this.$confirm('姝ゆ搷浣滃皢姘镐箙鍒犻櫎璇ユ潯鏂伴椈, 鏄惁缁х画?', '鎻愮ず', { + confirmButtonText: '纭畾', + cancelButtonText: '鍙栨秷', + type: 'warning' + }).catch(err => { + return err + }) + //濡傛灉鐢ㄦ埛鐐瑰嚮纭畾鍒欒繑鍥瀋onfirm + //濡傛灉鐢ㄦ埛鐐瑰嚮鍙栨秷鍒欒繑鍥瀋ancel + console.log(res); + if(res !== 'confirm'){ + return this.$message.info('宸插彇娑堝垹闄') + }else{ + console.log(id); + const data = { + id:id + } + //鍙傛暟data 瑕佷互瀵硅薄鐨勫舰寮忎紶鍏� + deleteNew(data).then(res => { + console.log('>>>'+res); + if(res.code == 200){ + this.$message.success('鍒犻櫎鏂伴椈鎴愬姛锛�') + this.query(this.newsCategoryId); + }else{ + return this.$message.error('鍒犻櫎鏂伴椈澶辫触锛�') + } + }) + } }, //鏌ョ湅 look(id){ this.$router.push({path:'news',query:{id:id}}) + }, + //瓒呯鐧诲綍瀵硅瘽妗� + showAdDialog(){ + this.AdDialogVisible = true }, handleCurrentChange(val) { // console.log(`褰撳墠椤�: ${val}`); @@ -219,19 +366,47 @@ this.pageSize = val; this.query(this.newsCategoryId) }, + handleCurrentChangefuzzy(val){ + this.fuzzyForm.fuzzycurrent = val + this.fuzzyList(this.fuzzyForm.fuzzytitle) //妯$硦鏌ヨ + }, + handleSizeChangefuzzy(val){ + this.fuzzyForm.fuzzysize = val + this.fuzzyList(this.fuzzyForm.fuzzytitle) //妯$硦鏌ヨ + }, //鍘诲線娣诲姞缂栬緫椤甸潰 - goEdit(){ - if (this.newsCategoryId==27||this.newsCategoryId==28||this.newsCategoryId==29|| - this.newsCategoryId==30||this.newsCategoryId==31) { - this.$message.error('璇ユ柊闂绘爣棰樹笅涓嶈兘娣诲姞鏂伴椈') - }else if(this.newsCategoryId == 35||this.newsCategoryId==36||this.newsCategoryId==37|| + goEdit(id){ + let title = ''; + console.log(this.value); + if (this.value.length = 2) { + let t = this.value[0]; + let i = this.value[1]; + this.options.forEach( item => { + if(item.value == t){ + title += item.label+'/' + item.children.forEach( e => { + if(e.value == i) title += e.label; + }) + } + }) + } + if (this.newsCategoryId==27&&this.total==1||this.newsCategoryId==28&&this.total==1||this.newsCategoryId==29&&this.total==1|| + this.newsCategoryId==30&&this.total==1||this.newsCategoryId==31&&this.total==1) { + this.$message.error('璇ユ柊闂绘爣棰樹笅鍙兘瀛樺湪涓�绡囨柊闂�') + }else if(this.newsCategoryId==27||this.newsCategoryId==28||this.newsCategoryId==29||this.newsCategoryId==30|| + this.newsCategoryId==31||this.newsCategoryId == 35||this.newsCategoryId==36||this.newsCategoryId==37|| this.newsCategoryId==38||this.newsCategoryId==39||this.newsCategoryId==40|| this.newsCategoryId==41||this.newsCategoryId==42||this.newsCategoryId==43|| this.newsCategoryId==44){ - this.$router.push('/administrator/edit') + this.$router.push({path:'/administrator/edit',query:{id:id,title:title}}) + console.log(this.newsCategoryId); + }else if(this.newsCategoryId==45){ + this.$router.push({path:'/administrator/editlunbo',query:{id:id,title:title}}) + // console.log(this.newsCategoryId); }else{ this.$message.error('璇峰厛閫夋嫨鏂伴椈鏍囬') - } + } + } }, } @@ -241,6 +416,9 @@ .add{ margin-bottom: 10px !important; } +.block{ + margin-bottom: 10px; +} .el-pagination{ margin-top: 10px; } -- Gitblit v1.8.0