style:弹窗修改

renchao@pashanhoo.com
Showing 4 changed files with 75 additions and 54 deletions
src/store/getters.js
src/store/modules/user.js
src/views/system/dymbgl/components/editDialog.vue
src/views/system/dymbgl/dymbgl.vue
--- a/src/store/getters.js
View file @6f68f04
+++ b/src/store/getters.js
View file @6f68f04
@@ -13,5 +13,6 @@ const getters = {
  addDict: state => state.dict.addDict,
  dictData: state => state.dict.dictData,
  djbxx: state => state.djbxx.djbxx,
+  isRefresh: state => state.user.isRefresh,
 }
 export default getters
--- a/src/store/modules/user.js
View file @6f68f04
+++ b/src/store/modules/user.js
View file @6f68f04
+/*
+ * @Description: 
+ * @Autor: renchao
+ * @LastEditTime: 2023-04-12 10:47:33
+ */
 import { getUserInfo } from '@/api/user'
 const state = {
    name: '',
    avatar: 'https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png',
-    userData: {}
+    isRefresh: false,
 }
 const mutations = {
    SET_NAME: (state, data) => {
        state.name = data.loginName
-        state.userData = data
+    },
+    REFRESH: (state, data) => {
+        state.isRefresh = data
    }
 }
@@ -19,6 +26,9 @@ const actions = {
            resolve(true)
        })
    },
+    refreshPage ({ commit }, data) {
+        commit('REFRESH', data)
+    },
 }
 export default {
    namespaced: true,
--- a/src/views/system/dymbgl/components/editDialog.vue
View file @6f68f04
+++ b/src/views/system/dymbgl/components/editDialog.vue
View file @6f68f04
 <template>
-  <dialogBox title="打印模板" @submitForm="submitForm" saveButton="保存" :isFullscreen="false" width="30%"
-    @closeDialog="closeDialog" v-model="myValue">
  <el-form ref="ruleForm" :model="ruleForm" label-width="100px" :rules="rules">
    <el-row>
      <el-col :span="24">
@@ -21,32 +19,40 @@
        <el-form-item label="模板设计:">
          <el-button type="primary" @click="designByPRGData(ruleForm.tmpcontent)">模板设计</el-button>
          <i class="el-icon-loading" style="font-size:24px;margin-left:10px;" v-if="loadStatus == '1'"></i>
-            <i class="el-icon-circle-check" style="font-size:24px;margin-left:10px;color:green" v-if="loadStatus == '2'"></i>
+          <i class="el-icon-circle-check" style="font-size:24px;margin-left:10px;color:green"
+            v-if="loadStatus == '2'"></i>
        </el-form-item>
      </el-col>
    </el-row>
    <object id="LODOP_OB" classid="clsid:2105C259-1E0C-4534-8141-A753534CB4CA" v-show="false">
-      <embed id="LODOP_EM" type="application/x-print-lodop" width=820 height=450 pluginspage="install_lodop32.exe"/>
+      <embed id="LODOP_EM" type="application/x-print-lodop" width=820 height=450 pluginspage="install_lodop32.exe" />
    </object>
    <textarea rows="0" id="S1" cols="0" v-show="false"></textarea>
+    <el-form-item class="text-center">
+      <el-button @click="closeDialog">取消</el-button>
+      <el-button type="primary" @click="submitForm" plain>确定</el-button>
+    </el-form-item>
  </el-form>
-  </dialogBox>
 </template>
 <script>
 import { getLodop } from "@/utils/LodopFuncs"
 import { mapGetters } from 'vuex'
-import {addPrintTemplate,editPrintTemplate} from "@/api/system.js"
+import store from '@/store/index.js'
+import { addPrintTemplate, editPrintTemplate } from "@/api/system.js"
 export default {
  computed: {
    ...mapGetters(['dictData']),
  },
  props: {
-    value: { type: Boolean, default: false },
+    formData: {
+      type: Object,
+      default: () => { }
+    }
  },
  data () {
    return {
-      myValue: this.value,
      editFlag: false,
      //打印模板设计保存状态 0：未操作  1：保存中 2：已保存
      loadStatus: '0',
@@ -68,76 +74,73 @@ export default {
      },
    }
  },
-  watch: {
+  mounted () {
-    value (val) {
+    if (JSON.stringify(this.formData) != "{}") this.getDetailInfo(this.formData)
-      this.myValue = val
-    }
  },
  methods: {
    //表单提交
    submitForm () {
-      if(this.loadStatus == '1'){
+      if (this.loadStatus == '1') {
        return this.$message.error("模板设计保存中，请等待...")
      }
      this.$refs.ruleForm.validate(valid => {
        if (valid) {
-            if(this.editFlag){
+          if (this.editFlag) {
            this.editTemplate();
-            }else{
+          } else {
            this.addTemplate();
          }
        } else {
-          // console.log('error submit!!');
          return false;
        }
      });
    },
    //新增
-    addTemplate(){
+    addTemplate () {
      addPrintTemplate(this.ruleForm).then(res => {
-            if(res.code == 200){
+        if (res.code == 200) {
-                this.$parent.fetchData();
+          store.dispatch('user/refreshPage', true);
          this.$message.success('保存成功');
-                this.closeDialog();
+          this.$popupCacel()
-            }else{
+        } else {
          this.$message.error(res.message)
        }
      })
    },
    //编辑
-    editTemplate() {
+    editTemplate () {
      editPrintTemplate(this.ruleForm).then(res => {
-            if(res.code == 200){
+        if (res.code == 200) {
-                this.$parent.fetchData();
+          store.dispatch('user/refreshPage', true);
          this.$message.success('保存成功');
-                this.closeDialog();
+          this.$popupCacel()
-            }else{
+        } else {
          this.$message.error(res.message)
        }
      })
    },
    closeDialog () {
-      this.$emit("input", false);
+      this.$popupCacel()
      this.ruleForm = {
        tmpno: '',
        tmpname: '',
        tmpfont: '',
        tmpfontsize: '',
        tmpcontent: ''
-      },
+      }
      this.loadStatus = '0'
      this.editFlag = false;
    },
-    getDetailInfo(item){
+    getDetailInfo (item) {
      this.ruleForm = item;
      this.editFlag = true;
    },
    //设计打印模板
-    designByPRGData() {
+    designByPRGData () {
      let that = this;
      that.loadStatus = '1';
-      let LODOP=getLodop(document.getElementById('LODOP_OB'),document.getElementById('LODOP_EM'));
+      let LODOP = getLodop(document.getElementById('LODOP_OB'), document.getElementById('LODOP_EM'));
-      LODOP.ADD_PRINT_DATA("ProgramData",this.ruleForm.tmpcontent); //装载模板
+      LODOP.ADD_PRINT_DATA("ProgramData", this.ruleForm.tmpcontent); //装载模板
      //窗口关闭后，回调函数中保存的设计代码
      if (LODOP.CVERSION)
        CLODOP.On_Return = function (TaskID, printList) {
@@ -162,6 +165,7 @@ export default {
 <style scoped lang="scss">
 @import "~@/styles/mixin.scss";
 @import "~@/styles/dialogBoxheader.scss";
 .font-red {
  color: red
 }
--- a/src/views/system/dymbgl/dymbgl.vue
View file @6f68f04
+++ b/src/views/system/dymbgl/dymbgl.vue
View file @6f68f04
@@ -5,6 +5,7 @@
        <el-row>
          <el-col :span="24" class="btnColRight">
            <el-form-item>
+              {{ isRefresh }}
              <el-button type="primary" @click="fetchData">查询</el-button>
              <el-button type="primary" @click="openAddDialog">新增</el-button>
            </el-form-item>
@@ -18,22 +19,20 @@
        :data="tableData.data"></lb-table>
    </div>
    <object id="LODOP_OB" classid="clsid:2105C259-1E0C-4534-8141-A753534CB4CA" v-show="false">
-      <embed id="LODOP_EM" type="application/x-print-lodop" width=820 height=450 pluginspage="install_lodop32.exe"/>
+      <embed id="LODOP_EM" type="application/x-print-lodop" width=820 height=450 pluginspage="install_lodop32.exe" />
    </object>
    <textarea rows="0" id="S1" cols="0" v-show="false"></textarea>
-    <editDialog ref="editDialog" v-model="isDialog" />
  </div>
 </template>
 <script>
+import { mapGetters } from 'vuex'
 import { getLodop } from "@/utils/LodopFuncs"
 import table from "@/utils/mixin/table"
 import { datas, sendThis } from "./dymbgl"
-import editDialog from "./components/editDialog.vue";
+import { selectPrintTemplateList, delPrintTemplate } from "@/api/system.js"
-import {selectPrintTemplateList,delPrintTemplate} from "@/api/system.js"
 export default {
  name: "dymbgl",
  mixins: [table],
-  components: {editDialog},
  data () {
    return {
      isDialog: false,
@@ -49,14 +48,24 @@ export default {
      },
    }
  },
-  mounted(){
+  mounted () {
    sendThis(this);
    this.fetchData()
  },
+  computed: {
+    ...mapGetters(['isRefresh'])
+  },
+  watch: {
+    isRefresh: {
+      handler (newVal, oldVal) {
+        if (newVal) this.fetchData
+      }
+    }
+  },
  methods: {
    fetchData () {
-      selectPrintTemplateList({...this.pageData}).then(res => {
+      selectPrintTemplateList({ ...this.pageData }).then(res => {
-        if(res.code == 200){
+        if (res.code == 200) {
          let { total, records } = res.result
          this.tableData.total = total ? total : 0
          this.tableData.data = records ? records : []
@@ -64,24 +73,21 @@ export default {
      })
    },
    //打开新增弹窗
-    openAddDialog(){
+    openAddDialog () {
-      this.isDialog = true;
+      this.$popupDialog("新增打印模板", "system/dymbgl/components/editDialog", {}, "35%")
    },
    //打开编辑弹窗
-    openEditDialog(item){
+    openEditDialog (item) {
-      this.isDialog = true;
+      this.$popupDialog("编辑打印模板", "system/dymbgl/components/editDialog", item, "35%")
-      this.$nextTick(() => {
-          this.$refs.editDialog.getDetailInfo(item);
-      })
    },
    //删除数据
-    removeTemplate(item){
+    removeTemplate (item) {
      this.$confirm("确定要删除吗, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {
-          delPrintTemplate({bsmTmp: item.bsmTmp}).then((res) => {
+        delPrintTemplate({ bsmTmp: item.bsmTmp }).then((res) => {
          if (res.code == 200) {
            this.$message.success("删除成功");
            this.fetchData();
@@ -98,9 +104,9 @@ export default {
        });
    },
    //设计打印模板
-    DesignByPRGData(item) {		
+    DesignByPRGData (item) {
-      let LODOP=getLodop(document.getElementById('LODOP_OB'),document.getElementById('LODOP_EM')); 
+      let LODOP = getLodop(document.getElementById('LODOP_OB'), document.getElementById('LODOP_EM'));
-      LODOP.ADD_PRINT_DATA("ProgramData",item.tmpcontent); //装载模板
+      LODOP.ADD_PRINT_DATA("ProgramData", item.tmpcontent); //装载模板
      //窗口关闭后，回调函数中保存的设计代码
      if (LODOP.CVERSION)
        CLODOP.On_Return = function (TaskID, printList) {