From b35a804358de7849f42bcdae934c236d13e3f233 Mon Sep 17 00:00:00 2001
From: Tcsm <1377977403@qq.com>
Date: 星期二, 19 九月 2023 14:20:57 +0800
Subject: [PATCH] 全局搜索样式调整,家谱加上页码
---
ruoyi-ui/src/assets/images/searchEmpty.png | 0
ruoyi-ui/src/views/genealogy/index.vue | 10
ruoyi-ui/src/views/contacts/index.vue | 10
ruoyi-ui/src/views/search/index.vue | 439 +++++++-----------------------------------------------
ruoyi-ui/src/api/search/index.js | 8 +
5 files changed, 79 insertions(+), 388 deletions(-)
diff --git a/ruoyi-ui/src/api/search/index.js b/ruoyi-ui/src/api/search/index.js
index 543ea86..909482e 100644
--- a/ruoyi-ui/src/api/search/index.js
+++ b/ruoyi-ui/src/api/search/index.js
@@ -1 +1,9 @@
import request from '@/utils/request'
+// 鏍规嵁keyword鏌ヨ璁板綍
+export function getSearch(query) {
+ return request({
+ url: '/search',
+ method: 'get',
+ params: query
+ })
+}
diff --git a/ruoyi-ui/src/assets/images/searchEmpty.png b/ruoyi-ui/src/assets/images/searchEmpty.png
new file mode 100644
index 0000000..2e986c6
--- /dev/null
+++ b/ruoyi-ui/src/assets/images/searchEmpty.png
Binary files differ
diff --git a/ruoyi-ui/src/views/contacts/index.vue b/ruoyi-ui/src/views/contacts/index.vue
index 175ea01..3172cb8 100644
--- a/ruoyi-ui/src/views/contacts/index.vue
+++ b/ruoyi-ui/src/views/contacts/index.vue
@@ -140,7 +140,7 @@
</el-row>
</div>
- <el-table v-loading="loading" :data="contactList" :row-key="getRowId" ref="multipleTable" @selection-change="handleSelectionChange" :row-class-name="tableRowClassName" style="background: #FFEFF2; border-radius: 14px 14px 14px 14px;">
+ <el-table v-loading="loading" :data="contactList" :row-key="getRowId" ref="multipleTable" @selection-change="handleSelectionChange" :row-class-name="tableRowClassName" style="background: #FFEFF2; border-radius: 14px 14px 14px 14px;" >
<el-table-column type="selection" :reserve-selection="true" width="55" align="center" />
<el-table-column fixed label="搴忓彿" sortable type="index" :index="(queryParams.pageNum-1)*queryParams.pageSize+1" width="80"/>
@@ -160,12 +160,10 @@
<el-table-column label="鎵嬫満" prop="phone" sortable width="120" align="center" >
<template slot-scope="scope">{{scope.row.phone? scope.row.phone: '鈥斺�斺�斺��'}}</template>
</el-table-column>
- <el-table-column label="鍏跺畠鑱旂郴鏂瑰紡" prop="wx qq twitter" sortable width="180" align="center" >
+ <el-table-column label="鍏跺畠鑱旂郴鏂瑰紡" prop="wx qq twitter" sortable :show-overflow-tooltip="true" width="150" align="center" >
<template slot-scope="scope">
- <span v-if="scope.row.wx || scope.row.qq || scope.row.twitter == true">
- {{scope.row.wx}}<br>
- {{scope.row.qq}}<br>
- {{scope.row.twitter}}
+ <span v-if="scope.row.wx || scope.row.qq || scope.row.twitter == true" >
+ {{scope.row.wx}}/{{scope.row.qq}}/{{scope.row.twitter}}
</span>
<span v-else>鈥斺�斺�斺��</span>
</template>
diff --git a/ruoyi-ui/src/views/genealogy/index.vue b/ruoyi-ui/src/views/genealogy/index.vue
index 152afad..3f43d34 100644
--- a/ruoyi-ui/src/views/genealogy/index.vue
+++ b/ruoyi-ui/src/views/genealogy/index.vue
@@ -143,7 +143,7 @@
</el-row>
</div>
- <el-table v-loading="loading" :data="listRoot" @selection-change="handleSelectionChange" :row-class-name="tableRowClassName" style="background: #FFEFF2; border-radius: 14px 14px 14px 14px;">
+ <el-table v-loading="loading" :data="listRoot" :row-key="getRowId" ref="multipleTable" @selection-change="handleSelectionChange" :row-class-name="tableRowClassName" style="background: #FFEFF2; border-radius: 14px 14px 14px 14px;">
<el-table-column type="selection" width="55" align="center" />
<el-table-column fixed label="搴忓彿" sortable type="index" :index="(queryParams.pageNum-1)*queryParams.pageSize+1" width="80"/>
@@ -195,7 +195,7 @@
</el-table>
<pagination
- v-show="total>0"
+ v-show="total!=0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@@ -305,7 +305,7 @@
dsb:true,
btn:false,
fit:['fill'],
-
+ uploading: false,
formDat: {
//寮犳皬涓�瑙堣〃
userid:undefined,
@@ -514,6 +514,10 @@
return '鍏跺畠'
}
},
+ getRowId(row)
+ {
+ return row.id
+ },
handleRemove(file) {
alert(323)
diff --git a/ruoyi-ui/src/views/search/index.vue b/ruoyi-ui/src/views/search/index.vue
index f8d3ae5..4a55a9a 100644
--- a/ruoyi-ui/src/views/search/index.vue
+++ b/ruoyi-ui/src/views/search/index.vue
@@ -1,18 +1,13 @@
<template>
<div class="app-container">
- <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch">
- <el-form-item label="" prop="phone wx qq twitter isAlways remark" >
+ <el-form ref="queryForm" size="small" :inline="true" v-show="showSearch">
+ <el-form-item label="鍏抽敭瀛�" prop="keyword" >
<el-input
- v-model:phone="queryParams.phone"
- v-model:wx="queryParams.wx"
- v-model:qq="queryParams.qq"
- v-model:twitter="queryParams.twitter"
- v-model:isAlways="queryParams.isAlways"
- v-model:remark="queryParams.remark"
- placeholder=" "
+ v-model="keyword"
+ placeholder="璇疯緭鍏ユ悳绱㈠叧閿瓧"
clearable
style="width: 240px"
- @keyup.enter.native="handleQuery">
+ @keyup.enter.native="getList">
<i slot="prefix" class="el-input__icon el-icon-search"></i>
</el-input>
@@ -35,7 +30,7 @@
</el-form-item>
<el-form-item>
- <el-button size="mini" @click="handleQuery" style=" width: 67px;height: 27px;background: #FFDDE3;
+ <el-button size="mini" @click="getList" style=" width: 67px;height: 27px;background: #FFDDE3;
border-radius: 7px 7px 7px 7px;opacity: 1; " >鎼滅储</el-button>
<el-button size="mini" @click="resetQuery" style=" width: 67px;height: 27px;background: #FFDDE3;
border-radius: 7px 7px 7px 7px;opacity: 1; ">閲嶇疆</el-button>
@@ -43,42 +38,28 @@
</el-form>
<span style="font-size:16px">鎼滅储缁撴灉濡備笅锛�</span>
<el-divider />
-
- <el-table v-loading="loading" :data="searchList" :row-key="getRowId" ref="multipleTable" @selection-change="handleSelectionChange" :row-class-name="tableRowClassName" style="background: #FFEFF2; border-radius: 14px 14px 14px 14px;">
+ <!-- 鑳屾櫙鍥剧墖 -->
+ <div class="background-image"><img src="../../assets/images/searchEmpty.png" v-if="showContent === 'image'" ></div>
+ <el-table v-loading="loading" v-if="showContent === 'table'" :data="searchList" :row-key="getRowId" ref="multipleTable" @selection-change="handleSelectionChange" :row-class-name="tableRowClassName" style="background: #FFEFF2; border-radius: 14px 14px 14px 14px;">
<!-- <el-table-column type="selection" :reserve-selection="true" width="55" align="center" />-->
<el-table-column fixed label="搴忓彿" sortable type="index" align="center" :index="(queryParams.pageNum-1)*queryParams.pageSize+1" width="60"/>
- <el-table-column label="鏍囪瘑" prop="type" sortable :show-overflow-tooltip="true" width="120" align="center" >
- <template slot-scope="scope">{{scope.row.type? scope.row.type: '鈥斺�斺�斺��'}}</template>
+ <el-table-column label="鎵�鍦ㄦā鍧�" prop="ctTableName" sortable :show-overflow-tooltip="true" width="120" align="center" >
+ <template slot-scope="scope">{{scope.row.ctTableName? scope.row.ctTableName: '鈥斺�斺�斺��'}}</template>
<!-- <template slot-scope="scope">{{ getSrc1(scope.row.type) }}</template>-->
</el-table-column>
- <el-table-column label="瀛楁" prop="name" sortable width="120" align="center" >
- <template slot-scope="scope">{{scope.row.name? scope.row.name: '鈥斺�斺�斺��'}}</template>
+ <el-table-column label="瀛楁" prop="remark" sortable width="120" align="center" >
+ <template slot-scope="scope">{{scope.row.remark? scope.row.remark: '鈥斺�斺�斺��'}}</template>
</el-table-column>
<el-table-column label="鏃堕棿" prop="getDate" sortable width="170" align="center" >
<template slot-scope="scope">{{scope.row.getDate? scope.row.getDate: '鈥斺�斺�斺��'}}</template>
</el-table-column>
- <el-table-column label="浣嶇疆" prop="location" sortable width="170" align="center" >
- <template slot-scope="scope">{{scope.row.location? scope.row.location: '鈥斺�斺�斺��'}}</template>
+ <el-table-column label="浣嶇疆" prop="by5" sortable width="170" align="center" >
+ <template slot-scope="scope">{{scope.row.by5 ? scope.row.by5: '鈥斺�斺�斺��'}}</template>
</el-table-column>
<!-- </el-table-column>-->
<el-table-column label="鎿嶄綔" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope" v-if="scope.row.roleId !== 1">
- <el-button
- size="mini"
- type="text"
- icon="el-icon-edit"
- @click="handleUpdate(scope.row)"
- v-hasPermi="['system:role:edit']"
- >淇敼</el-button>
- <el-button
- size="mini"
- type="text"
- icon="el-icon-delete"
- @click="handleDelete(scope.row)"
- v-hasPermi="['system:role:remove']"
- >鍒犻櫎</el-button>
-
<el-button
size="mini"
type="text"
@@ -89,21 +70,15 @@
</el-table-column>
</el-table>
- <pagination
- v-show="total>0"
- :total="total"
- :page.sync="queryParams.pageNum"
- :limit.sync="queryParams.pageSize"
- style="background: #FEF7FC;"
- @pagination="getList"
- />
+<!-- <pagination-->
+<!-- v-show="total>0"-->
+<!-- :total="total"-->
+<!-- :page.sync="queryParams.pageNum"-->
+<!-- :limit.sync="queryParams.pageSize"-->
+<!-- style="background: #FEF7FC;"-->
+<!-- @pagination="getList"-->
+<!-- />-->
-
-
- <!-- 鍒嗛厤瑙掕壊鏁版嵁鏉冮檺瀵硅瘽妗� -->
- <el-dialog :title="title" :visible.sync="openDataScope" width="500px" append-to-body>
-
- </el-dialog>
</div>
</template>
@@ -115,19 +90,24 @@
//瀵煎叆鎺ュ彛鍑芥暟
-import {listHonor,listType,enload, addHonor,updateHonor, delHonor,uploadPic,getCategory} from "@/api/honor/index";
+import {getSearch} from "@/api/search/index";
import { Notification, MessageBox, Message, Loading } from 'element-ui'
export default {
+ computed: {
+ showContent() {
+ if (this.keyword ==='') {
+ return 'image';
+ } else {
+ return 'table';
+ }
+ },
+ },
name: "index",
dicts: ['sys_normal_disable'],
data() {
return {
- // 閬僵灞�
- disabled: false,
-
- loading: true,
- formData:[],
+ loading: false,
// 閫変腑鏁扮粍
ids: [],
// 闈炲崟涓鐢�
@@ -138,9 +118,9 @@
showSearch: true,
// 鎬绘潯鏁�
total: 0,
- // 鑽h獕琛ㄦ牸鏁版嵁
+ // 鎼滅储琛ㄦ牸鏁版嵁
searchList: [],
- typeList:[],
+ keyword:'',
// 寮瑰嚭灞傛爣棰�
title: "",
// 鏄惁鏄剧ず寮瑰嚭灞�
@@ -153,113 +133,29 @@
deptNodeAll: false,
// 鏃ユ湡鑼冨洿
dateRange: [],
- // 鏁版嵁鑼冨洿閫夐」
- fot:['.bmp','.jpg','.jpeg','.png','.tif','.gif','.pcx','.tga','.exif','.fpx',
- '.svg','.psd','.cdr','.pcd','.dxf','.ufo','.eps','.ai','.aw','.WMF','.webp','.apng'],
- fileList:[],
- fileListOther:[],
- dsb:true,
- btn:false,
- fit:['fill'],
- uploading: false,
formDat: {
- //鑽h獕璇佷功璁板綍
- id:undefined,
- type:undefined,
+ ctTableName:undefined,
createTime:undefined,
- name:undefined,
- idNo:undefined,
- grade:undefined,
- validityDate:undefined,
- getDate:undefined,
- location:undefined,
+ by5:undefined,
remark:undefined,
- url: undefined,
},
- // 鑿滃崟鍒楄〃
- menuOptions: [],
- // 閮ㄩ棬鍒楄〃
- deptOptions: [],
// 鏌ヨ鍙傛暟
queryParams: {
pageNum: 1,
pageSize: 10,
- type:undefined,
- grade:undefined,
- name:undefined,
+ remark:undefined
},
- // searchVal:"",
-
// 琛ㄥ崟鍙傛暟
form: {},
- defaultProps: {
- children: "children",
- label: "label"
- },
- // 琛ㄥ崟鏍¢獙
- rules: {
- createTime: [{
- required: true,
- message: '璇疯緭鍏ュ垱寤烘椂闂�',
- trigger: 'blur'
- }],
- type: [{
- required: true,
- message: '璇疯緭鍏ョ被鍨�',
- trigger: 'blur'
- }],
- name: [{
- // required: true,
- message: '璇疯緭鍏ュ悕绉�',
- trigger: 'blur'
- }],
- grade: [{
- required: true,
- message: '璇疯緭鍏ョ骇鍒�',
- trigger: 'blur'
- }],
- idNo: [{
- required: true,
- message: '璇疯緭鍏ヨ瘉浠跺彿/涓撲笟',
- trigger: 'blur'
- }],
- validityDate: [{
- // required: true,
- message: '璇疯緭鍏ユ湁鏁堟椂闂�',
- trigger: 'blur'
- }],
- getDate: [{
- // required: true,
- message: '璇疯緭鍏ヨ幏寰楁椂闂�',
- trigger: 'blur'
- }],
- location: [{
- // required: true,
- message: '璇疯緭鍏ュ瓨鏀句綅缃�',
- trigger: 'blur'
- }],
- remark: [{
- // required: true,
- message: '璇疯緭鍏ュ娉�',
- trigger: 'blur'
- }],
- },
- selected:'',
- typeOptions: [],
- newOption: undefined,
- showInput: true,
- typeOption:[
- {value:'璇佷欢',label:'璇佷欢'},
- {value:'鑽h獕',label:'鑽h獕'},
- {value:'璧勮川',label:'璧勮川'},]
+ showTable: false,
};
},
- created() {
- this.getList();
- this.getTypeOptions();
- },
+ // created() {
+ // // this.getList();
+ // },
+
methods: {
// 鍙栨秷鎸夐挳
cancelData() {
@@ -275,121 +171,23 @@
return "statistics-warning-row";
}
},
- //鍚嶇О
- addNewOption() {
- const newOption = this.newOption.trim();
- if (newOption && !this.typeOptions.includes(newOption)) {
- this.typeOptions.push(newOption);
- this.$set(this.formDat, 'name', newOption); // 鏇存柊formDat.type鐨勫�间负鏂扮殑閫夐」
- }
- },
/** 鏌ヨ璁板綍鍒楄〃 */
getList() {
- this.loading = true;
- console.log(this.queryParams)
+ console.log("1")
this.queryParams.happenStartTime = this.dateRange.length > 0 && this.dateRange[0]
this.queryParams.happenEndTime = this.dateRange.length > 0 && this.dateRange[1]
- // listProperty(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
- listHonor(this.queryParams).then(response => {
+
+ const keyword = this.keyword
+ getSearch({keyword}).then(response => {
// alert(123)
- // console.log(response.data)
- this.honorList = response.data.data;
-
- this.total = response.data.total;
- this.loading = false;
- }
- );
- listType(this.queryParams).then(response => {
- this.typeList = response.data;
- this.total = response.data.total;
- // console.log( this.typeList )
- // 鍦ㄥ洖璋冨嚱鏁颁腑璋冪敤 getTypeOptions()
- this.getTypeOptions();
+ console.log("鎺ュ彛杩斿洖鐨勬暟鎹細", response.data);
+ this.searchList = response.data;
+ console.log("璧嬪�煎悗鐨剆earchList锛�", this.searchList);
this.loading = false;
}
);
},
- getTypeOptions() {
- const filteredOptions = this.typeList.filter(item => typeof item === 'string' && item !== '');
- const uniqueOptions = {};
-
- this.typeOptions = filteredOptions.reduce((options, option) => {
- if (!uniqueOptions[option]) {
- uniqueOptions[option] = true;
- options.push({
- label: option,
- value: option
- });
- }
- return options;
- }, []);
-
- },
- /** 鏌ヨ绫诲埆淇℃伅 */
- // getCateInfor()
- // {
- // let _this = this
- // getCategory().then(response=>{
- //
- // // response.data.itemValues.replace("{","").replace("}","").split(",").map(elem=>{
- // // _this.typeOptions.push({"label":elem.split(":")[0], "value":elem.split(":")[0]})
- // response.data.itemValues.replace("{", "").replace("}", "").split(",").map(elem => {
- // const label = elem.split(":")[0].trim();
- // const value = parseInt(elem.split(":")[1].trim());
- // _this.typeOptions.push({ "label": label, "value": value });
- // })
- // })
- // },
- //绫诲埆閫夋嫨
- getSrc1(type){
- if(type===0){
- return '璇佷欢'
- }else if(type===1){
- return '鑽h獕'
- }else if(type===2){
- return '璧勮川'
- }
- },
- //鍚嶇О閫夋嫨
- getSrc(name) {
- if (name === 1){
- return '鍑虹敓璇�'
- }else if(name === 2){
- return '瀛︾敓璇�'
- }else if(name === 3){
- return '姣曚笟璇�'
- }else if(name === 4){
- return '缁撳璇�'
- }else if(name === 5){
- return '鎴峰彛绨�'
- }else if(name === 6){
- return '鐙敓瀛愬コ璇�'
- }else if(name === 7){
- return '楂樼骇鑱岀О'
- }else if(name === 8){
- return '鎶ょ収'
- }else if(name === 9){
- return '閫氳璇�'
- }else {
- return '鍏跺畠'
- }
- },
-
- handleRemove(file) {
- for(let i = 0; i < this.fileList.length; i++)
- {
- if(this.fileList[i].url==file.url)
- this.$delete(this.fileList,i);
- }
- },
- handleRemoveFile(file) {
- for(let i = 0; i < this.fileListOther.length; i++)
- {
- if(this.fileListOther[i].url==file.url)
- this.$delete(this.fileListOther,i);
- }
- },
// 鍙栨秷鎸夐挳
cancel() {
this.open = false;
@@ -403,8 +201,7 @@
cancelDataScope() {
this.openDataScope = false;
this.reset();
- },
- // 琛ㄥ崟閲嶇疆
+ },// 琛ㄥ崟閲嶇疆
reset() {
if (this.$refs.menu != undefined) {
this.$refs.menu.setCheckedKeys([]);
@@ -427,6 +224,7 @@
};
this.resetForm("form");
},
+
/** 鎼滅储鎸夐挳鎿嶄綔 */
handleQuery() {
this.queryParams.pageNum = 1;
@@ -436,8 +234,8 @@
/** 閲嶇疆鎸夐挳鎿嶄綔 */
resetQuery() {
this.dateRange = [];
- this.resetForm("queryForm");
- this.handleQuery();
+ this.keyword = '';
+ this.getList();
},
// 澶氶�夋閫変腑鏁版嵁
handleSelectionChange(selection) {
@@ -455,12 +253,6 @@
// },
- /** 鏂板鎸夐挳鎿嶄綔 */
- handleAdd() {
- this.reset();
- this.open = true;
- this.title = "娣诲姞璇佷欢/鑽h獕/璧勮川淇℃伅";
- },
/** 鏌ョ湅璇︾粏淇℃伅 */
handleCheck(row){
const id = row.id;
@@ -480,122 +272,8 @@
},
- handlePictureCardPreview(file) {
- this.dialogImageUrl = file.url;
- this.dialogVisible = true;
- },
- /** 鎻愪氦鎸夐挳锛堟暟鎹潈闄愶級 */
- submitDataScope: function() {
-
-
- let ul = this.fileList.map(function (elem){
- return elem.url.replace(process.env.VUE_APP_BASE_TRUE_API,"")
- }).join(",")
- let uls = this.fileListOther.map(function (elem){
- return elem.url.replace(process.env.VUE_APP_BASE_TRUE_API,"")
- }).join(",")
- this.formDat.url = ul+","+uls
- this.$refs["elForm"].validate(valid => {
- if (valid) {
-
- addHonor(this.formDat).then(response => {
- this.$modal.msgSuccess("鏂板鎴愬姛");
- this.open = false;
- this.getList();
- });
- }
- });
- // 娓呯┖formDat瀵硅薄鐨勬暟鎹�
- Object.keys(this.formDat).forEach(key => {
- this.formDat[key] = '';
- });
- for(let i = 0; i <= this.fileList.length; i++)
- {
- this.handleRemove(this.fileList[0]);
- }
- for(let i = 0; i < this.fileListOther.length; i++){
- this.handleRemoveFile(this.fileListOther[0]);
- }
- },
- requestUpload(params)
- {
- var file = params.file;
- var formData = new FormData();
- formData.append('uploadFile', file);
- let _this = this
- this.uploading = true;
- uploadPic(formData).then(response => {
- let pth = response.data.originalFilename.substr(response.data.originalFilename.length-4, response.data.originalFilename.length)
- this.uploading = false;
- this.$modal.msgSuccess("涓婁紶鎴愬姛");
- if(_this.fot.includes(pth) === true)
- {
- _this.fileList.push({name:response.data.fileName, "url":response.data.url})
-
- }
-
- else{
- _this.fileListOther.push({name:response.data.fileName, url:response.data.url})
-
- }
- })
-
- },
- /** 鍒犻櫎鎸夐挳鎿嶄綔 */
- handleDelete(row) {
- const Ids = row.id || this.ids;
- this.$modal.confirm('鏄惁纭鍒犻櫎鏁版嵁椤癸紵').then(function() {
- return delHonor(Ids);
- }).then(() => {
- this.getList();
- this.$modal.msgSuccess("鍒犻櫎鎴愬姛");
- }).catch(() => {});
- },
- /** 瀵煎嚭鎸夐挳鎿嶄綔 */
- handleExport() {
- const Ids = this.ids;
-
- if(Ids.length==0)
- {
- this.download('/zHonor/export', {
- ...this.queryParams
- }, `zHonor_${new Date().getTime()}.xlsx`)
- }else{
- this.download('/zHonor/export1/'+Ids, {
-
- }, `zHonor_${new Date().getTime()}.xlsx`)
- }
- },
-
- handleExportTemplate(){
- this.download('/zHonor/model', {
-
- }, `zHonor_${new Date().getTime()}.xlsx`)
- },
- /** 瀵煎叆鎿嶄綔*/
- handleEnport(params){
- var file = params.file;
- var formData = new FormData();
- formData.append('excelImport', file);
- let _this = this
-
- enload(formData).then(response => {
- _this.getList();
- Message({ message: "瀵煎叆鎴愬姛", type: 'warning' })
-
- }).catch(() => { Message({ message: "瀵煎叆澶辫触", type: 'error' })});
-
- }
},
- watch: {
- type(value) {
- if (value === '') {
- this.showInput = true;
- } else {
- this.showInput = false;
- }
- }
- }
+
};
</script>
<style>
@@ -610,7 +288,10 @@
background: #FFEFF2;
}
-
+.background-image img {
+ width: 100%;
+ height: 100%;
+}
</style>
--
Gitblit v1.9.1