更新结构字段

src/api/org.js

@@ -21,6 +21,17 @@ export function createUser(data) {
 }
 
 // 得到机构信息
-export function getOrgInfo(data) {
+export function GetOrgInfo(data) {
   return http.post(`${process.env.VUE_APP_EepServer}?MethodName=org_manager-GetOrgInfo`, data);
 }
+
+/**
+ * 更改机构指定字段的值
+ * @param {object} data 请求数据
+ * @param {string} data.org_id 机构 ID
+ * @param {string} data.field_name 字段名称
+ * @param {any} data.value 字段值
+ */
+export function UpdateOrgFieldValue(data) {
+  return http.post(`${process.env.VUE_APP_EepServer}?MethodName=org_manager-UpdateOrgFieldValue`, data);
+}

src/views/org_manage/OrgManageInfo.vue

@@ -17,27 +17,25 @@
         <span class="label">名称</span>
         <div class="project-item">
           <span>{{ org_info.name }}</span>
-          <span class="link">更改</span>
+          <span class="link" @click="showUpdateField('name', org_info.name)">更改</span>
         </div>
         <span class="label">最大用户量</span>
         <div class="project-item">
           <span>{{ org_info.user_count_max }}</span>
-          <span class="link">更改</span>
+          <span class="link" @click="showUpdateField('user_count_max', org_info.user_count_max)">更改</span>
         </div>
         <span class="label">已注册用户数</span>
         <div class="project-item">
           <span>{{ org_info.user_count }}</span>
-          <span class="link">更改</span>
         </div>
         <span class="label">已停用用户数</span>
         <div class="project-item">
           <span>{{ org_info.user_count_stop }}</span>
-          <span class="link">更改</span>
         </div>
         <span class="label">最大项目量</span>
         <div class="project-item">
           <span>{{ org_info.project_count_max }}</span>
-          <span class="link">更改</span>
+          <span class="link" @click="showUpdateField('project_count_max', org_info.project_count_max)">更改</span>
         </div>
         <span class="label">已创建项目数</span>
         <div class="project-item">
@@ -54,152 +52,106 @@
         <span class="label" style="line-height: 16px">教材编辑<br />使用期限</span>
         <div class="project-item">
           <span>{{ org_info.use_end_date_book_edit }}</span>
-          <span class="link">更改</span>
+          <span class="link" @click="showUpdateField('use_end_date_book_edit', org_info.use_end_date_book_edit)">
+            更改
+          </span>
         </div>
         <span class="label" style="line-height: 16px">教材仓库<br />使用期限</span>
         <div class="project-item">
           <span>{{ org_info.use_end_date_book_store }}</span>
-          <span class="link">更改</span>
+          <span class="link" @click="showUpdateField('use_end_date_book_store', org_info.use_end_date_book_store)">
+            更改
+          </span>
         </div>
-      </div>
-      <div class="table-twocolumn">
         <span class="label">机构管理员</span>
         <div class="project-item">
           <span>{{ org_info.org_manager_name_desc }}</span>
-          <span class="link">更改</span>
         </div>
-        <span class="label">机构权限</span>
+        <span class="label" style="line-height: 16px">语音引擎<br />剩余可用次数</span>
         <div class="project-item">
-          <span>{{ org_info.org_popedom_name_desc }}</span>
-          <span class="link">更改</span>
+          <span>{{ org_info.speech_engine_lave_can_use_count }}</span>
+          <span
+            class="link"
+            @click="showUpdateField('speech_engine_lave_can_use_count', org_info.speech_engine_lave_can_use_count)"
+            >更改</span
+          >
         </div>
+      </div>
+      <div class="table-twocolumn">
         <span class="label">备注</span>
         <div class="project-item">
           <span>{{ org_info.memo }}</span>
-          <span class="link">更改</span>
+          <span class="link" @click="showUpdateField('memo', org_info.memo)">更改</span>
         </div>
       </div>
-      <!-- <el-form-item label="名称" prop="name" class="link-item">
-        <el-input v-if="1 === 2" v-model="org_info.name" placeholder="请输入名称" maxlength="20" disabled />
-
-        <span>{{ org_info.name }}</span>
-        <span class="link">更改</span>
-      </el-form-item>
-      <el-form-item label="最大用户量" prop="user_count_max" class="link-item">
-        <el-input v-if="1 === 2" v-model="org_info.user_count_max" type="number" disabled />
-        <span class="link">更改</span>
-      </el-form-item>
-      <el-form-item label="已注册用户数" prop="user_count" class="label-input link-item">
-        <el-input v-if="1 === 2" v-model="org_info.user_count" type="text" disabled />
-        <span class="link"></span>
-      </el-form-item>
-      <el-form-item label="已停用用户数" prop="user_count_stop" class="link-item">
-        <el-input v-if="1 === 2" v-model="org_info.user_count_stop" type="text" disabled />
-        <span class="link"></span>
-      </el-form-item>
-      <el-form-item label="最大项目量" prop="project_count_max" class="link-item">
-        <el-input
-          v-if="1 === 2"
-          v-model="org_info.project_count_max"
-          type="number"
-          placeholder="请输入最大项目量"
-          disabled
-        />
-        <span class="link">更改</span>
-      </el-form-item>
-      <el-form-item label="已创建项目数" prop="project_count" class="link-item">
-        <el-input v-if="1 === 2" v-model="org_info.project_count" disabled />
-        <span class="link"></span>
-      </el-form-item>
-
-      <el-form-item label="已上架教材数" prop="book_count" class="link-item">
-        <el-input v-if="1 === 2" v-model="org_info.book_count" disabled />
-        <span class="link"></span>
-      </el-form-item>
-      <el-form-item label="创建时间" prop="create_time" class="link-item">
-        <el-date-picker v-if="1 === 2" v-model="org_info.create_time" disabled />
-        <span class="link"></span>
-      </el-form-item>
-      <el-form-item prop="use_end_date_book_edit" class="link-item">
-        <span slot="label">教材编辑<br />使用期限</span>
-        <el-date-picker
-          v-if="1 === 2"
-          v-model="org_info.use_end_date_book_edit"
-          format="yyyy-MM-dd"
-          value-format="yyyy-MM-dd"
-          placeholder="选择日期"
-          disabled
-        ></el-date-picker>
-
-        <span class="link">更改</span>
-      </el-form-item>
-      <el-form-item prop="use_end_date_book_store" class="link-item">
-        <span slot="label">教材仓库<br />使用期限</span>
-
-        <el-date-picker
-          v-if="1 === 2"
-          v-model="org_info.use_end_date_book_store"
-          format="yyyy-MM-dd"
-          value-format="yyyy-MM-dd"
-          placeholder="选择日期"
-          disabled
-        ></el-date-picker>
-        <span class="link">更改</span>
-      </el-form-item>
-      <el-form-item label="机构管理员" prop="org_manager_name_desc" class="link-item link-all">
-        <el-input v-if="1 === 2" v-model="org_info.org_manager_name_desc" type="text" disabled />
-        <span class="link">更改</span>
-      </el-form-item>
-      <el-form-item label="机构权限" prop="org_popedom_name_desc" class="link-item link-all">
-        <el-input
-          v-if="1 === 2"
-          v-model="org_info.org_popedom_name_desc"
-          type="text"
-          placeholder="请输入机构权限"
-          disabled
-        />
-        <span class="link">更改</span>
-      </el-form-item>
-
-      <el-form-item label="备注" prop="memo" class="link-item link-all">
-        <el-input
-          v-if="1 === 2"
-          v-model="org_info.memo"
-          type="textarea"
-          :autosize="{ minRows: 4 }"
-          maxlength="1500"
-          show-word-limit
-          placeholder="请输入备注"
-          disabled
-        />
-        <span class="link">更改</span>
-      </el-form-item> -->
     </main>
+
+    <UpdateOrgField
+      :field="curField"
+      :value="curFieldValue"
+      :org-id="id"
+      :visible.sync="visibleUpdateField"
+      @updateOrgFieldValue="updateOrgFieldValue"
+    />
   </div>
 </template>
 
 <script>
-import { getOrgInfo } from '@/api/org.js';
+import UpdateOrgField from './components/UpdateOrgField.vue';
+
+import { GetOrgInfo, UpdateOrgFieldValue } from '@/api/org.js';
 
 export default {
   name: 'OrgManageInfo',
-  components: {},
+  components: {
+    UpdateOrgField,
+  },
   data() {
     return {
       id: this.$route.params.id,
-
       org_info: null,
+      visibleUpdateField: false,
+      curField: '',
+      curFieldValue: '',
     };
   },
   created() {
-    this.getProjectInfo();
+    this.getOrgInfo();
   },
   methods: {
-    getProjectInfo() {
-      getOrgInfo({ id: this.id }).then(({ org_info }) => {
+    getOrgInfo() {
+      GetOrgInfo({ id: this.id }).then(({ org_info }) => {
         this.org_info = org_info;
       });
     },
+    /**
+     * 显示更新字段弹窗
+     * @param {string} field - 字段名称
+     * @param {any} value - 字段值
+     */
+    showUpdateField(field, value) {
+      this.curField = field;
+      this.curFieldValue = value;
+      this.visibleUpdateField = true;
+    },
+    /**
+     * 更新机构字段值
+     * @param {string} field_name - 字段名称
+     * @param {any} value - 新的字段值
+     */
+    updateOrgFieldValue(field_name, value) {
+      UpdateOrgFieldValue({
+        org_id: this.id,
+        field_name,
+        value,
+      })
+        .then(() => {
+          this.getOrgInfo();
+        })
+        .catch((error) => {
+          console.error('更新机构字段值失败:', error);
+        });
+    },
   },
 };
 </script>

src/views/org_manage/components/UpdateOrgField.vue

@@ -0,0 +1,104 @@
+<template>
+  <el-dialog
+    :title="`更新${fieldObj[field]}`"
+    :visible="visible"
+    :width="dialogWidth"
+    :close-on-click-modal="false"
+    @close="handleClose"
+  >
+    <template v-if="['name'].includes(field)">
+      <el-input v-model="stringValue" type="text" />
+    </template>
+
+    <template v-if="['memo'].includes(field)">
+      <el-input v-model="stringValue" type="textarea" :autosize="{ minRows: 4 }" maxlength="1500" show-word-limit />
+    </template>
+
+    <template v-if="['use_end_date_book_edit', 'use_end_date_book_store'].includes(field)">
+      <el-date-picker
+        v-model="stringValue"
+        type="date"
+        placeholder="选择日期"
+        format="yyyy-MM-dd"
+        value-format="yyyy-MM-dd"
+      />
+    </template>
+
+    <template v-if="['user_count_max', 'project_count_max', 'speech_engine_lave_can_use_count'].includes(field)">
+      <el-input v-model="stringValue" type="number" />
+    </template>
+
+    <div slot="footer">
+      <el-button @click="handleClose">取消</el-button>
+      <el-button type="primary" @click="confirm">确定</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+export default {
+  name: 'UpdateOrgField',
+  props: {
+    field: {
+      type: String,
+      required: true,
+    },
+    value: {
+      type: [String, Number, Array, Object],
+      required: true,
+    },
+    orgId: {
+      type: String,
+      required: true,
+    },
+    visible: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  data() {
+    return {
+      fieldObj: {
+        name: '名称',
+        user_count_max: '最大用户量',
+        project_count_max: '最大项目量',
+        speech_engine_lave_can_use_count: '语音引擎剩余可用次数',
+        use_end_date_book_edit: '教材编辑使用期限',
+        use_end_date_book_store: '教材仓库使用期限',
+        memo: '备注',
+      },
+      stringValue: this.value,
+    };
+  },
+  computed: {
+    dialogWidth() {
+      if (['use_end_date_book_edit', 'use_end_date_book_store'].includes(this.field)) {
+        return '260px';
+      }
+      return '550px';
+    },
+  },
+  watch: {
+    value(newVal) {
+      this.stringValue = newVal;
+
+      if (['use_end_date_book_edit', 'use_end_date_book_store'].includes(this.field)) {
+        const date = new Date();
+        this.stringValue = newVal === '0-00-00' ? `${date.getFullYear()}-${date.getMonth()}-${date.getDay()}` : newVal;
+      }
+    },
+  },
+  methods: {
+    handleClose() {
+      this.$emit('update:visible', false);
+    },
+    confirm() {
+      this.$emit('updateOrgFieldValue', this.field, this.stringValue);
+
+      this.handleClose();
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped></style>