| | |
| | | <template> |
| | | <div class="operationLog_box"> |
| | | <My-bread |
| | | :list="[ |
| | | <My-bread :list="[ |
| | | `${$t('operatManage.operatManage')}`, |
| | | `${$t('operatManage.operationLog')}`, |
| | | ]" |
| | | ></My-bread> |
| | | ]"></My-bread> |
| | | <el-divider /> |
| | | <div class="inquire"> |
| | | <div class="herder_box"> |
| | | {{ $t("operatManage.operationLogObj.queryRegion") }} |
| | | </div> |
| | | <el-form ref="formData3" :model="form" :inline="true"> |
| | | <div class="inquire subpage_Div"> |
| | | |
| | | <el-form |
| | | :inline="true" |
| | | ref="sizeForm" |
| | | :model="sizeForm" |
| | | > |
| | | <el-form-item |
| | | :label="$t('operatManage.operationLogObj.username')" |
| | | prop="uname" |
| | | :label="$t('operatManage.operationLogObj.username')" |
| | | > |
| | | <el-input |
| | | v-model="form.uname" |
| | | v-model="sizeForm.uname" |
| | | :placeholder="$t('operatManage.operationLogObj.pleaseInput')" |
| | | /> |
| | | </el-form-item> |
| | | |
| | | <el-form-item |
| | | :label="$t('operatManage.operationLogObj.operationType')" |
| | | prop="type" |
| | | :label="$t('operatManage.operationLogObj.operationType')" |
| | | > |
| | | <el-select |
| | | clearable |
| | | v-model="form.type" |
| | | v-model="sizeForm.type" |
| | | :placeholder="$t('operatManage.operationLogObj.pleaseSelect')" |
| | | > |
| | | <el-option |
| | |
| | | <el-date-picker |
| | | format="yyyy-MM-dd HH:mm:ss" |
| | | value-format="yyyy-MM-dd HH:mm:ss" |
| | | v-model="form.start" |
| | | v-model="sizeForm.start" |
| | | style="width: 100%" |
| | | type="datetime" |
| | | :placeholder="$t('operatManage.operationLogObj.optionDate')" |
| | | > |
| | | </el-date-picker> |
| | | ></el-date-picker> |
| | | </el-form-item> |
| | | <el-form-item |
| | | prop="end" |
| | |
| | | <el-date-picker |
| | | format="yyyy-MM-dd HH:mm:ss" |
| | | value-format="yyyy-MM-dd HH:mm:ss" |
| | | v-model="form.end" |
| | | v-model="sizeForm.end" |
| | | style="width: 100%" |
| | | type="datetime" |
| | | :placeholder="$t('operatManage.operationLogObj.optionDate')" |
| | | > |
| | | </el-date-picker> |
| | | </el-form-item> |
| | | |
| | | <el-form-item> |
| | | <el-button @click="onSubmit" icon="el-icon-search">{{ |
| | | $t("operatManage.operationLogObj.inquire") |
| | | }}</el-button> |
| | | <el-button @click="onEmpty('formData3')" icon="el-icon-delete">{{ |
| | | $t("operatManage.operationLogObj.empty") |
| | | }}</el-button> |
| | | <el-button |
| | | @click="onSubmit" |
| | | icon="el-icon-search" |
| | | size="small" |
| | | type="primary" |
| | | >{{ $t("operatManage.operationLogObj.inquire") }}</el-button> |
| | | <el-button |
| | | @click="onEmpty('sizeForm')" |
| | | icon="el-icon-delete" |
| | | type="info" |
| | | size="small" |
| | | >{{ $t("operatManage.operationLogObj.empty") }}</el-button> |
| | | </el-form-item> |
| | | </el-form> |
| | | </div> |
| | | <div class="table_box"> |
| | | <el-table :data="tableData" stripe style="width: 100%" height="85%"> |
| | | <div class="table_box subpage_Div"> |
| | | <el-table |
| | | :data="tableData" |
| | | style="width: 100%" |
| | | height="79%" |
| | | > |
| | | <!-- <el-table-column type="selection" width="55" /> --> |
| | | <el-table-column |
| | | :label="$t('operatManage.operationLogObj.num')" |
| | |
| | | </template> |
| | | </el-table-column> --> |
| | | </el-table> |
| | | <div style="margin-top: 40px" class="pagination_box"> |
| | | <div |
| | | style="margin-top: 40px" |
| | | class="pagination_box" |
| | | > |
| | | <el-pagination |
| | | @size-change="handleSizeChange" |
| | | @current-change="handleCurrentChange" |
| | |
| | | data() { |
| | | return { |
| | | currentPage4: 1, |
| | | form: {}, |
| | | sizeForm: { |
| | | uname: "", |
| | | start: null, |
| | | end: null, |
| | | type: [], |
| | | }, |
| | | tableData: [], |
| | | listData: { |
| | | pageIndex: 1, |
| | |
| | | this.listData.pageIndex = val; |
| | | this.getList(); |
| | | }, |
| | | onEmpty(formData1) { |
| | | this.$refs[formData1].resetFields(); //重置表单数据 |
| | | // this.form = {} |
| | | this.form.start =null |
| | | this.form.end =null |
| | | }, |
| | | onSubmit() { |
| | | this.listData = { ...this.listData, ...this.form }; |
| | | this.listData = { ...this.listData, ...this.sizeForm }; |
| | | // console.log(this.listData) |
| | | this.getList(); |
| | | }, |
| | | onEmpty(formData1) { |
| | | this.$refs[formData1].resetFields(); //重置表单数据 |
| | | }, |
| | | |
| | | async getList() { |
| | | const data = await operateSelectByPageAndCount(this.listData); |
| | | |
| | | |
| | | if (data.code != 200) { |
| | | return this.$message.error("列表调用失败"); |
| | | } |
| | |
| | | <style lang="less" scoped> |
| | | //@import url(); 引入公共css类 |
| | | .operationLog_box { |
| | | background: rgb(240, 242, 245); |
| | | border-radius: 10px; |
| | | height: 100%; |
| | | padding: 10px; |
| | | box-sizing: border-box; |
| | | height: 98%; |
| | | width: 98%; |
| | | padding: 1%; |
| | | |
| | | .inquire { |
| | | padding: 10px; |
| | | margin-top: 20px; |
| | | background: #fff; |
| | | border-radius: 5px; |
| | | border: 1px solid rgb(202, 201, 204); |
| | | |
| | | margin-bottom: 20px; |
| | | .herder_box { |
| | | padding: 10px; |
| | | border-bottom: 1px solid #ccc; |
| | | margin-bottom: 20px; |
| | | font-size: 14px; |
| | | } |
| | | } |
| | | .table_box { |
| | | padding: 10px; |
| | | background: #fff; |
| | | border-radius: 5px; |
| | | border: 1px solid rgb(202, 201, 204); |
| | | overflow: auto; |
| | | height: 70%; |
| | | height: 60%; |
| | | } |
| | | .text-center { |
| | | text-align: center; |