style:证书分发

 <template>
-  <dialogBox title="证书分发" @submitForm="submitForm" saveButton="保存" width="50%" :isFullscreen="false"
-    @closeDialog="closeDialog" v-model="myValue" :isButton="readOnly">
-    <div>
-      <el-form ref="ruleForm" :model="ruleForm" label-width="100px" :rules="rules">
-        <el-row>
-          <el-col :span="12">
-            <el-form-item label="发放编号:" prop="batchno">
-              <el-input v-model="ruleForm.batchno" :disabled="true"></el-input>
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="领取时间:" prop="operationtime">
-              <el-date-picker v-model="ruleForm.operationtime" class="width100" type="datetime"
-              placeholder="选择日期时间" :disabled="!readOnly" value-format="yyyy-MM-dd HH:mm:ss">
-              </el-date-picker>
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <el-row>
-          <el-col :span="12">
-            <el-form-item label="入库人员:">
-              <el-input v-model="ruleForm.operator" :disabled="true"></el-input>
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="领取人:" prop="receiver">
-              <el-select v-model="ruleForm.receiver" class="width100" placeholder="请选择" :disabled="!readOnly">
-                <el-option v-for="item in usernames" :key="item" :label="item" :value="item"></el-option>
-              </el-select>
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <div>
-          <el-table :data="tableForm" border
-            :header-cell-style="{'text-align':'center',background: 'rgb(236, 245, 255)'}"
-            :cell-style="{'text-align':'center'}">
-            <el-table-column prop="name" label="纸质证书类型" width="200"></el-table-column>
-            <el-table-column prop="ksysxlh" label="开始印刷序列号" width="200"></el-table-column>
-            <el-table-column prop="bs" label="本数">
-              <template slot-scope="scope">
-                <el-input v-model="scope.row.bs" @blur="ysxlhDeal(scope.row)"
-                  oninput="value=value.replace(/[^\d.]/g,'')" maxlength="6" :disabled="!readOnly"></el-input>
-              </template>
-            </el-table-column>
-            <el-table-column prop="jsysxlh" label="结束印刷序列号" width="200">
-              <template slot-scope="scope">
-                <span v-if="scope.row.jsysxlh == ''" class="font-red">系统计算</span>
-                <span v-else>{{scope.row.jsysxlh}}</span>
-              </template>
-            </el-table-column>
-          </el-table>
-        </div>
-        <el-form-item label="备注" class="middle-margin-bottom">
-          <el-input type="textarea" v-model="ruleForm.bz" :rows="4" :disabled="!readOnly"></el-input>
+  <el-form ref="ruleForm" :model="ruleForm" label-width="100px" :rules="rules">
+    <el-row>
+      <el-col :span="12">
+        <el-form-item label="发放编号:" prop="batchno">
+          <el-input v-model="ruleForm.batchno" :disabled="true"></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="12">
+        <el-form-item label="领取时间:" prop="operationtime">
+          <el-date-picker v-model="ruleForm.operationtime" class="width100" type="datetime" placeholder="选择日期时间"
+            :disabled="!readOnly" value-format="yyyy-MM-dd HH:mm:ss">
+          </el-date-picker>
+        </el-form-item>
+      </el-col>
+    </el-row>
+    <el-row>
+      <el-col :span="12">
+        <el-form-item label="入库人员:">
+          <el-input v-model="ruleForm.operator" :disabled="true"></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="12">
+        <el-form-item label="领取人:" prop="receiver">
+          <el-select v-model="ruleForm.receiver" class="width100" placeholder="请选择" :disabled="!readOnly">
+            <el-option v-for="item in usernames" :key="item" :label="item" :value="item"></el-option>
+          </el-select>
         </el-form-item>
-      </el-form>
+      </el-col>
+    </el-row>
+    <div>
+      <el-table :data="tableForm" border :header-cell-style="{ 'text-align': 'center', background: 'rgb(236, 245, 255)' }"
+        :cell-style="{ 'text-align': 'center' }">
+        <el-table-column prop="name" label="纸质证书类型" width="200"></el-table-column>
+        <el-table-column prop="ksysxlh" label="开始印刷序列号" width="200"></el-table-column>
+        <el-table-column prop="bs" label="本数">
+          <template slot-scope="scope">
+            <el-input v-model="scope.row.bs" @blur="ysxlhDeal(scope.row)" oninput="value=value.replace(/[^\d.]/g,'')"
+              maxlength="6" :disabled="!readOnly"></el-input>
+          </template>
+        </el-table-column>
+        <el-table-column prop="jsysxlh" label="结束印刷序列号" width="200">
+          <template slot-scope="scope">
+            <span v-if="scope.row.jsysxlh == ''" class="font-red">系统计算</span>
+            <span v-else>{{ scope.row.jsysxlh }}</span>
+          </template>
+        </el-table-column>
+      </el-table>
     </div>
-  </dialogBox>
+    <el-form-item label="备注" class="middle-margin-bottom">
+      <el-input type="textarea" v-model="ruleForm.bz" :rows="4" :disabled="!readOnly"></el-input>
+    </el-form-item>
+
+    <el-form-item v-if="readOnly">
+      <el-button type="primary" @click="submitForm">保存</el-button>
+      <el-button @click="closeDialog">取消</el-button>
+    </el-form-item>
+  </el-form>
 </template>
 
 <script>
-import { getZsStartNo, getSysSerialSingle, getZsEndNo, zsff ,getZsglInfo} from "@/api/zsgl.js"
+import { getZsStartNo, getSysSerialSingle, getZsEndNo, zsff, getZsglInfo } from "@/api/zsgl.js"
 export default {
-  components: {
-  },
-  computed: {
-  },
   props: {
-    value: { type: Boolean, default: false },
+    formData: {
+      type: Object,
+      default: () => { }
+    }
   },
   data () {
     return {
-      myValue: this.value,
       readOnly: false,
       //表单提交数据
       ruleForm: {
@@ -126,9 +123,12 @@ export default {
       },
     }
   },
-  watch: {
-    value (val) {
-      this.myValue = val
+  mounted () {
+    if (this.formData.bsmBatch) {
+      this.getDetailInfo(this.formData.bsmBatch);
+    } else {
+      this.ywhSerial();
+      this.initStartNo();
     }
   },
   methods: {
@@ -156,19 +156,19 @@ export default {
       })
     },
     //获取详情信息
-    getDetailInfo(bsmBatch) {
-       getZsglInfo({"bsmBatch": bsmBatch}).then(res => {
-          if(res.code == 200){
-            this.ruleForm = res.result;
-            this.readOnly = false;
-            this.tableForm[0].ksysxlh = res.result.zsstarno;
-            this.tableForm[0].jsysxlh = res.result.zsendno;
-            this.tableForm[0].bs = res.result.zsnum;
-            this.tableForm[1].ksysxlh = res.result.zmstarno;
-            this.tableForm[1].jsysxlh = res.result.zmendno;
-            this.tableForm[1].bs = res.result.zmnum;
-          }
-       })
+    getDetailInfo (bsmBatch) {
+      getZsglInfo({ "bsmBatch": bsmBatch }).then(res => {
+        if (res.code == 200) {
+          this.ruleForm = res.result;
+          this.readOnly = false;
+          this.tableForm[0].ksysxlh = res.result.zsstarno;
+          this.tableForm[0].jsysxlh = res.result.zsendno;
+          this.tableForm[0].bs = res.result.zsnum;
+          this.tableForm[1].ksysxlh = res.result.zmstarno;
+          this.tableForm[1].jsysxlh = res.result.zmendno;
+          this.tableForm[1].bs = res.result.zmnum;
+        }
+      })
     },
     //初始化开始序列号
     initStartNo () {
@@ -240,6 +240,7 @@ export default {
 <style scoped lang="scss">
 @import "~@/styles/mixin.scss";
 @import "~@/styles/dialogBoxheader.scss";
+
 .font-red {
   color: red
 }

@@ -19,8 +19,8 @@
           </el-col>
           <el-col :span="5">
             <el-form-item label="结束时间">
-              <el-date-picker v-model="ruleForm.ffjssj" :picker-options="pickerOptionsEnd" type="date"
-                placeholder="结束日期" value-format="yyyy-MM-dd" clearable>
+              <el-date-picker v-model="ruleForm.ffjssj" :picker-options="pickerOptionsEnd" type="date" placeholder="结束日期"
+                value-format="yyyy-MM-dd" clearable>
               </el-date-picker>
             </el-form-item>
           </el-col>
@@ -96,18 +96,11 @@ export default {
     }
   },
   methods: {
+    // 查看弹框
     openDialog (bsmBatch) {
-      if (bsmBatch) {
-        this.$nextTick(() => {
-          this.$refs.addDialog.getDetailInfo(bsmBatch);
-        })
-      } else {
-        this.$nextTick(() => {
-          this.$refs.addDialog.ywhSerial();
-          this.$refs.addDialog.initStartNo();
-        })
-      }
-      this.isDialog = true;
+      this.$popupDialog("证书分发", "zsgl/zsff/components/addDialog", {
+        bsmBatch: bsmBatch
+      }, "50%")
     },
     queryClick () {
       getZsglffList({ ...this.ruleForm, ...this.pageData }).then(res => {

 <template>
-  <!-- <dialogBox title="证书入库" @submitForm="submitForm" saveButton="保存" :isFullscreen="false" width="50%"
-    @closeDialog="closeDialog" v-model="myValue" :isButton="readOnly">
-    <el-form ref="ruleForm" :model="ruleForm" label-width="100px" :rules="rules">
-      <el-row>
-        <el-col :span="12">
-          <el-form-item label="入库编号:" prop="batchno">
-            <el-input v-model="ruleForm.batchno" :disabled="true"></el-input>
-          </el-form-item>
-        </el-col>
-        <el-col :span="12">
-          <el-form-item label="登记机构:" prop="djjg">
-            <el-select v-model="ruleForm.djjg" class="width100" placeholder="请选择" :disabled="!readOnly">
-              <el-option v-for="item in dictData['ywly']" :key="item.dname" :label="item.dname" :value="item.dname">
-              </el-option>
-            </el-select>
-          </el-form-item>
-        </el-col>
-      </el-row>
-      <el-row>
-        <el-col :span="12">
-          <el-form-item label="入库人员:">
-            <el-input v-model="ruleForm.operator" :disabled="true"></el-input>
-          </el-form-item>
-        </el-col>
-        <el-col :span="12">
-          <el-form-item label="入库时间:" prop="operationtime">
-            <el-date-picker v-model="ruleForm.operationtime" class="width100" type="datetime" :disabled="!readOnly" value-format="yyyy-MM-dd HH:mm:ss">
-            </el-date-picker>
-          </el-form-item>
-        </el-col>
-      </el-row>
-      <div>
-        <el-table :data="tableForm" border style="width: 100%"
-          :header-cell-style="{'text-align':'center',background: 'rgb(236, 245, 255)'}"
-          :cell-style="{'text-align':'center'}">
-          <el-table-column prop="name" label="纸质证书类型" width="200"></el-table-column>
-          <el-table-column prop="ksysxlh" label="开始印刷序列号" width="200">
-            <template slot-scope="scope">
-              <el-input v-model="scope.row.ksysxlh" @blur="ysxlhDeal(scope.row)" maxlength="11"
-                oninput="value=value.replace(/[^\d.]/g,'')" :disabled="!readOnly"></el-input>
-            </template>
-          </el-table-column>
-          <el-table-column prop="jsysxlh" label="结束印刷序列号" width="200">
-            <template slot-scope="scope">
-              <el-input v-model="scope.row.jsysxlh" @blur="ysxlhDeal(scope.row)" maxlength="11"
-                oninput="value=value.replace(/[^\d.]/g,'')" :disabled="!readOnly"></el-input>
-            </template>
-          </el-table-column>
-          <el-table-column prop="bs" label="本数">
-            <template slot-scope="scope">
-              <span v-if="scope.row.bs == 0" class="font-red">系统计算</span>
-              <span v-else-if="scope.row.bs < 0" class="font-red">印刷序列号有误</span>
-              <span v-else>{{scope.row.bs}}</span>
-            </template>
-          </el-table-column>
-        </el-table>
-      </div>
-      <el-form-item label="备注" class="middle-margin-bottom">
-        <el-input type="textarea" v-model="ruleForm.bz" :rows="4" :disabled="!readOnly"></el-input>
-      </el-form-item>
-    </el-form>
-  </dialogBox> -->
-  <div>
-    <el-form ref="ruleForm" :model="ruleForm" label-width="100px" :rules="rules">
-      <el-row>
-        <el-col :span="12">
-          <el-form-item label="入库编号:" prop="batchno">
-            <el-input v-model="ruleForm.batchno" :disabled="true"></el-input>
-          </el-form-item>
-        </el-col>
-        <el-col :span="12">
-          <el-form-item label="登记机构:" prop="djjg">
-            <el-select v-model="ruleForm.djjg" class="width100" placeholder="请选择" :disabled="!readOnly">
-              <el-option v-for="item in  DJJGLIST" :key="item.dname" :label="item.dname" :value="item.dname">
-              </el-option>
-            </el-select>
-          </el-form-item>
-        </el-col>
-      </el-row>
-      <el-row>
-        <el-col :span="12">
-          <el-form-item label="入库人员:">
-            <el-input v-model="ruleForm.operator" :disabled="true"></el-input>
-          </el-form-item>
-        </el-col>
-        <el-col :span="12">
-          <el-form-item label="入库时间:" prop="operationtime">
-            <el-date-picker v-model="ruleForm.operationtime" class="width100" type="datetime" :disabled="!readOnly"
-              value-format="yyyy-MM-dd HH:mm:ss">
-            </el-date-picker>
-          </el-form-item>
-        </el-col>
-      </el-row>
-      <div>
-        <el-table :data="tableForm" border style="width: 100%"
-          :header-cell-style="{ 'text-align': 'center', background: 'rgb(236, 245, 255)' }"
-          :cell-style="{ 'text-align': 'center' }">
-          <el-table-column prop="name" label="纸质证书类型" width="200"></el-table-column>
-          <el-table-column prop="ksysxlh" label="开始印刷序列号" width="200">
-            <template slot-scope="scope">
-              <el-input v-model="scope.row.ksysxlh" @blur="ysxlhDeal(scope.row)" maxlength="11"
-                oninput="value=value.replace(/[^\d.]/g,'')" :disabled="!readOnly"></el-input>
-            </template>
-          </el-table-column>
-          <el-table-column prop="jsysxlh" label="结束印刷序列号" width="200">
-            <template slot-scope="scope">
-              <el-input v-model="scope.row.jsysxlh" @blur="ysxlhDeal(scope.row)" maxlength="11"
-                oninput="value=value.replace(/[^\d.]/g,'')" :disabled="!readOnly"></el-input>
-            </template>
-          </el-table-column>
-          <el-table-column prop="bs" label="本数">
-            <template slot-scope="scope">
-              <span v-if="scope.row.bs == 0" class="font-red">系统计算</span>
-              <span v-else-if="scope.row.bs < 0" class="font-red">印刷序列号有误</span>
-              <span v-else>{{ scope.row.bs }}</span>
-            </template>
-          </el-table-column>
-        </el-table>
-      </div>
-      <el-form-item label="备注" class="middle-margin-bottom">
-        <el-input type="textarea" v-model="ruleForm.bz" :rows="4" :disabled="!readOnly"></el-input>
-      </el-form-item>
-      <el-row v-if="readOnly">
-        <el-form-item>
-          <el-button type="primary" @click="submitForm">保存</el-button>
-          <el-button @click="closeDialog">取消</el-button>
+  <el-form ref="ruleForm" :model="ruleForm" label-width="100px" :rules="rules">
+    <el-row>
+      <el-col :span="12">
+        <el-form-item label="入库编号:" prop="batchno">
+          <el-input v-model="ruleForm.batchno" :disabled="true"></el-input>
         </el-form-item>
-      </el-row>
-    </el-form>
-  </div>
+      </el-col>
+      <el-col :span="12">
+        <el-form-item label="登记机构:" prop="djjg">
+          <el-select v-model="ruleForm.djjg" class="width100" placeholder="请选择" :disabled="!readOnly">
+            <el-option v-for="item in  DJJGLIST" :key="item.dname" :label="item.dname" :value="item.dname">
+            </el-option>
+          </el-select>
+        </el-form-item>
+      </el-col>
+    </el-row>
+    <el-row>
+      <el-col :span="12">
+        <el-form-item label="入库人员:">
+          <el-input v-model="ruleForm.operator" :disabled="true"></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="12">
+        <el-form-item label="入库时间:" prop="operationtime">
+          <el-date-picker v-model="ruleForm.operationtime" class="width100" type="datetime" :disabled="!readOnly"
+            value-format="yyyy-MM-dd HH:mm:ss">
+          </el-date-picker>
+        </el-form-item>
+      </el-col>
+    </el-row>
+    <div>
+      <el-table :data="tableForm" border style="width: 100%"
+        :header-cell-style="{ 'text-align': 'center', background: 'rgb(236, 245, 255)' }"
+        :cell-style="{ 'text-align': 'center' }">
+        <el-table-column prop="name" label="纸质证书类型" width="200"></el-table-column>
+        <el-table-column prop="ksysxlh" label="开始印刷序列号" width="200">
+          <template slot-scope="scope">
+            <el-input v-model="scope.row.ksysxlh" @blur="ysxlhDeal(scope.row)" maxlength="11"
+              oninput="value=value.replace(/[^\d.]/g,'')" :disabled="!readOnly"></el-input>
+          </template>
+        </el-table-column>
+        <el-table-column prop="jsysxlh" label="结束印刷序列号" width="200">
+          <template slot-scope="scope">
+            <el-input v-model="scope.row.jsysxlh" @blur="ysxlhDeal(scope.row)" maxlength="11"
+              oninput="value=value.replace(/[^\d.]/g,'')" :disabled="!readOnly"></el-input>
+          </template>
+        </el-table-column>
+        <el-table-column prop="bs" label="本数">
+          <template slot-scope="scope">
+            <span v-if="scope.row.bs == 0" class="font-red">系统计算</span>
+            <span v-else-if="scope.row.bs < 0" class="font-red">印刷序列号有误</span>
+            <span v-else>{{ scope.row.bs }}</span>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+    <el-form-item label="备注" class="middle-margin-bottom">
+      <el-input type="textarea" v-model="ruleForm.bz" :rows="4" :disabled="!readOnly"></el-input>
+    </el-form-item>
+    <el-form-item v-if="readOnly">
+      <el-button type="primary" @click="submitForm">保存</el-button>
+      <el-button @click="closeDialog">取消</el-button>
+    </el-form-item>
+  </el-form>
 </template>
 
 <script>

@@ -93,6 +93,7 @@ export default {
     }
   },
   methods: {
+    // 查看弹框
     openDialog (bsmBatch) {
       this.$popupDialog("证书入库", "zsgl/zsrk/components/addDialog", {
         bsmBatch: bsmBatch