123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140 |
- <template>
- <div class="com-formual">
- <el-form :inline="true" :model="queryForm" class="demo-form-inline">
- <el-form-item label="公式名称:">
- <el-input v-model="queryForm.name" placeholder="请填写公式名称"></el-input>
- </el-form-item>
- <el-form-item>
- <el-button type="primary" @click="onBtnSearch"> <svg-icon icon-class="search"/> 搜索</el-button>
- <el-button type="primary" @click="onBtnCreate"> <svg-icon icon-class="plus"/> 新增公式</el-button>
- </el-form-item>
- </el-form>
- <el-table :data="dataList" style="width: 100%" header-row-class-name="headerBg" empty-text="没有公式信息">
- <el-table-column prop="id" label="ID" align="center" width="80"/>
- <el-table-column prop="name" label="名称" align="left" width="180"/>
- <el-table-column prop="intro" label="介绍" align="center" width="150"/>
- <el-table-column prop="formula" label="内容" align="center" min-width="150"/>
- <el-table-column label="操作" align="center" width="350">
- <template #default="scope">
- <div class="btns">
- <el-button type="primary" size="mini" @click="btnPicked(scope.row)"><svg-icon icon-class="confirm"/>使用</el-button>
- <el-button type="primary" size="mini" @click="btnOnEdit(scope.row.id)"><svg-icon icon-class="edit"/>编辑</el-button>
- <el-button type="danger" size="mini"><svg-icon icon-class="delete"/>删除</el-button>
- </div>
- </template>
- </el-table-column>
- </el-table>
- <div class="page-info">
- <el-pagination
- v-model:currentPage="queryForm.page"
- :page-size="queryForm.pageSize"
- :total="recordCount"
- :page-count="pageTotal"
- background
- layout="prev, pager, next"
- @current-change="ChangePage"
- >
- </el-pagination>
- </div>
- <el-dialog :visible.sync="dialogVisible" append-to-body v-el-drag-dialog :close-on-click-modal="false" width="300" custom-class="prod-verify" :title="title">
- <dataInfo :id="dataId" @onClose="onClose" :list="comList"></dataInfo>
- </el-dialog>
- </div>
- </template>
- <script>
- import{searchFormula} from'@/api/formula';
- import dataInfo from "./dataInfo";
- import elDragDialog from '@/directive/el-drag-dialog'
- export default{
- name:"Formula",
- emits:['onPicked'],
- directives: { elDragDialog },
- components:{
- dataInfo,
- },
- props:{
- comList:{
- type:Array,
- default:[]
- }
- },
- data(){
- return{
- dataId:0,
- dialogVisible:false,
- title:"创建公式",
- queryForm:{
- page:1,
- pageSize:10,
- name:'',
- },
- recordCount:0,
- pageTotal:1,
- dataList:[],
- }
- },
- mounted(){
- this.onBtnSearch();
- },
- methods:{
- onBtnCreate(e){
- let _this=this;
- _this.title="创建公式";
- _this.dataId=0;
- _this.dialogVisible=true;
- },
- btnOnEdit(id){
- this.title="编辑公式";
- this.dataId=id;
- this.dialogVisible=true;
- },
- onClose(e){
- let _this=this;
- _this.dialogVisible=false;
- _this.onBtnSearch();
- },
- onBtnSearch(e){
- let _this=this;
- _this.queryForm.page=1;
- _this.search();
- },
- btnPicked(e){
- this.$emit("onPicked",e);
- },
- //搜索
- search(){
- let _this=this;
- searchFormula(_this.queryForm).then(res=>{
- if(res.status!=200)return;
- _this.dataList=res.data.dataList;
- _this.recordCount=res.data.recordCount;
- _this.pageTotal=res.data.pageTotal;
- })
- },
- //修改分页
- ChangePage(e){
- let _this=this;
- _this.queryForm.page=e;
- _this.search();
- },
- }
- }
- </script>
- <style lang="scss">
- @import './index.scss';
- </style>
|