123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299 |
- <template>
- <div class="com-formual">
- <el-form
- :inline="true"
- :model="queryForm"
- v-if="type == 1"
- class="demo-form-inline"
- >
- <el-form-item label="类型:">
- <el-select
- v-model="queryForm.type"
- placeholder="请选择类型"
- size="large"
- style="width: 100%"
- >
- <el-option
- v-for="item in typeList"
- :key="item.value"
- :label="item.name"
- :value="item.value"
- />
- </el-select>
- </el-form-item>
- <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-form
- :inline="true"
- :model="queryForm"
- v-if="type == 2"
- class="demo-form-inline"
- >
- <!-- <el-form-item label="类型:">
- <el-select v-model="queryForm.type" placeholder="请选择类型" size="large" style="width:100%;">
- <el-option
- v-for="item in typeList"
- :key="item.value"
- :label="item.name"
- :value="item.value"
- />
- </el-select>
- </el-form-item>
- <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="onBtnConst">
- <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" />
- <el-table-column prop="code" label="编码" align="left" />
- <el-table-column prop="name" label="名称" align="left" />
- <el-table-column
- prop="value"
- label="取值"
- v-if="type == 1"
- show-overflow-tooltip
- align="left"
- min-width="150"
- />
- <!-- <el-table-column prop="intro" label="介绍" show-overflow-tooltip align="left" min-width="150"/> -->
- <el-table-column label="操作" align="center" width="250">
- <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, scope.row)"
- ><svg-icon icon-class="edit" />编辑</el-button
- >
- <el-button
- type="danger"
- size="mini"
- @click="btnOnDelete(scope.row.id)"
- ><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
- width="300"
- custom-class="prod-verify"
- :title="title"
- @closed="handleDialogClosed"
- >
- <dataInfo
- ref="dataInfoRef"
- :id="dataId"
- :type="type"
- @onClose="onClose"
- ></dataInfo>
- </el-dialog>
- </div>
- </template>
- <script>
- import { searchParams, deleteParams } from "@/api/params";
- import elDragDialog from "@/directive/el-drag-dialog";
- import dataInfo from "./dataInfo";
- export default {
- name: "searchParams",
- emits: ["onPicked", "onData"],
- directives: { elDragDialog },
- components: {
- dataInfo,
- },
- props: {
- type: {
- type: Number,
- default: 1,
- },
- },
- watch: {
- type: {
- handler(val) {
- console.log(val);
- this.queryForm.type = val;
- this.onBtnSearch();
- },
- immediate: true,
- deep: true,
- },
- dataList: {
- handler(newVal, oldVal) {
- newVal.forEach((item, index) => {
- if (JSON.stringify(item) !== JSON.stringify(oldVal[index])) {
- this.$emit("onData", item);
- }
- });
- // Add any additional logic you need here
- },
- deep: true,
- },
- /* onData */
- },
- data() {
- return {
- dataId: 0,
- dialogVisible: false,
- title: "创建变量",
- queryForm: {
- page: 1,
- pageSize: 10,
- name: "",
- status: 5,
- type: 1,
- },
- typeList: [
- {
- value: 1,
- name: "变量",
- },
- {
- value: 2,
- name: "常量",
- },
- ],
- recordCount: 0,
- pageTotal: 1,
- dataList: [],
- };
- },
- mounted() {
- // this.onBtnSearch();
- },
- methods: {
- handleDialogClosed() {
- // 清空 dataInfo 组件内的表单
- if (this.$refs.dataInfoRef) {
- this.$refs.dataInfoRef.resetForm(); // 假设 dataInfo 组件有一个 resetForm 方法
- }
- },
- onClose(e) {
- let _this = this;
- _this.dialogVisible = false;
- _this.onBtnSearch();
- },
- btnOnDelete(e) {
- let _this = this;
- let par = {
- id: e,
- };
- _this
- .$confirm("您是否确认删除该记录?", "提示", {
- confirmButtonText: "确认",
- cancelButtonText: "取消",
- type: "warning",
- })
- .then((res) => {
- deleteParams(par).then((res) => {
- _this.search();
- });
- })
- .catch(() => {});
- },
- onBtnCreate(e) {
- let _this = this;
- _this.dataId = 0;
- _this.title = "创建变量";
- _this.dialogVisible = true;
- },
- btnOnEdit(id, row) {
- this.title = row.type == 1 ? "修改变量" : "修改常量";
- this.$nextTick(() => {
- this.dataId = id;
- this.dialogVisible = true;
- });
- },
- onBtnSearch(e) {
- let _this = this;
- _this.queryForm.page = 1;
- _this.search();
- },
- btnPicked(e) {
- this.$emit("onPicked", e);
- },
- //搜索
- search() {
- let _this = this;
- searchParams(_this.queryForm).then((res) => {
- if (!res) return;
- _this.dataList = res.data.dataList;
- _this.recordCount = res.data.totalRecord;
- _this.pageTotal = res.data.pageTotal;
- });
- },
- //修改分页
- ChangePage(e) {
- let _this = this;
- _this.queryForm.page = e;
- _this.search();
- },
- /* 新增常量 */
- onBtnConst() {
- let _this = this;
- _this.dataId = 0;
- _this.type = 2;
- _this.title = "创建常量";
- _this.dialogVisible = true;
- },
- },
- };
- </script>
- <style lang="scss">
- @import "./index.scss";
- </style>
|