添加唱名设置

src/router/constant.ts

@@ -35,4 +35,5 @@ export const asyncRoutes = {
   wxTemplateConfig: () => import('@views/message/message-config/wechat/wechat-config-template') ,// 推送消息配置模板
   wxTemplateMessage: () => import('@views/message/message-config/wechat/wechat-config-template-message') ,// 推送消息配置模板内容
   sysExceptionLog: () => import('@views/system-manage/expection-log/index') ,// 异常上报
+  calligraphy: () => import('@views/music-library/calligraphy/index') ,// 唱名设置
 }

src/views/music-library/api.ts

@@ -342,3 +342,59 @@ export const musicSheetApplicationExtendDel = (applicationExtendId?: any) => {
     method: 'post'
   } as any)
 }
+
+/**
+ *
+ * 唱名设置分页
+ */
+export const rollCallSettingPage = (params?: any) => {
+  return request({
+    url: '/cbs-app/rollCallSetting/page',
+    method: 'post',
+    data: params
+  } as any)
+}
+
+/**
+ *
+ * 唱名设置分页
+ */
+export const rollCallSettingStatus = (params?: any) => {
+  return request({
+    url: '/cbs-app/rollCallSetting/status',
+    method: 'post',
+    data: params
+  } as any)
+}
+
+/**
+ * @description: 添加唱名
+ */
+export const rollCallSettingAdd = (params: object) => {
+  return request({
+    url: '/cbs-app/rollCallSetting/save',
+    method: 'post',
+    data: params
+  } as any)
+}
+
+/**
+ * @description: 修改唱名
+ */
+export const rollCallSettingUpdata = (params: object) => {
+  return request({
+    url: '/cbs-app/rollCallSetting/update',
+    method: 'post',
+    data: params
+  } as any)
+}
+
+/**
+ * @description: 删除唱名
+ */
+export const rollCallSettingRemove = (id?: any) => {
+  return request({
+    url: '/cbs-app/rollCallSetting/remove?id=' + id,
+    method: 'post'
+  } as any)
+}

src/views/music-library/calligraphy/index.tsx

@@ -0,0 +1,321 @@
+import SaveForm from '@/components/save-form'
+import Pagination from '@/components/pagination'
+import {DataTableRowKey, NButton, NDataTable, NFormItem, NInput, NModal, NSelect, NSpace, NTag, useDialog, useMessage} from 'naive-ui'
+import {defineComponent, onMounted, reactive, ref} from 'vue'
+import {rollCallSettingPage, rollCallSettingRemove, rollCallSettingStatus} from "@views/music-library/api";
+import Edit from "@views/music-library/calligraphy/modal/edit";
+
+export default defineComponent({
+  name: 'music-calligraphy',
+  setup(props, {emit}) {
+    const dialog = useDialog()
+    const message = useMessage()
+    const state = reactive({
+      loading: false,
+      pagination: {
+        page: 1,
+        rows: 10,
+        pageTotal: 0
+      },
+      searchForm: {
+        keyword: null,
+        status: null,
+      },
+      showEdit: false,
+      editMode: 'add' as any,
+      dataList: [] as any,
+      rowData: null as any,
+
+    })
+
+    const columns = (): any => {
+      return [
+        {
+          type: 'selection'
+        },
+        {
+          title: '编号',
+          key: 'id',
+        },
+        {
+          title: '调号',
+          key: 'name',
+        },
+        {
+          title: '连接地址',
+          key: 'url',
+        },
+        {
+          title: '更新人',
+          key: 'updateName',
+        },
+        {
+          title: '更新时间',
+          key: 'updateTime',
+        },
+        {
+          title: '消息状态',
+          key: 'status',
+          render(row: any) {
+            return (
+                <NTag type={row.status ? 'primary' : 'default'}>{row.status ? '启用' : '停用'}</NTag>
+            )
+          }
+        },
+        {
+          title: '操作',
+          key: 'operation',
+          fixed: 'right',
+          width: '300px',
+          render(row: any) {
+            return (
+                <NSpace>
+                  <NButton
+                      type="primary"
+                      size="small"
+                      text
+                      // v-auth="musicSheet/save1751241178962984962"
+                      onClick={() => {
+                        state.showEdit = true
+                        state.editMode = 'edit'
+                        state.rowData = row
+                      }}
+                  >
+                    修改
+                  </NButton>
+                  <NButton
+                      type="primary"
+                      size="small"
+                      text
+                      // v-auth="musicSheet/statusList1751241653309407234"
+                      onClick={() => onChangeStatus(row)}
+                  >
+                    {row.status ? '停用' : '启用'}
+                  </NButton>
+                  <NButton
+                      type="primary"
+                      size="small"
+                      text
+                      disabled={!!row.status}
+                      onClick={() => onRmove(row)}
+                      // v-auth="musicSheet/remove1753457445635645442"
+                  >
+                    删除
+                  </NButton>
+                </NSpace>
+            )
+          }
+        }
+      ]
+    }
+
+    const checkedRowKeysRef = ref<DataTableRowKey[]>([])
+    const handleCheck = (rowKeys: DataTableRowKey[]) => {
+      checkedRowKeysRef.value = rowKeys
+    }
+
+    const onChangeStatus = (row: any) => {
+      const statusStr = row.status ? '停用' : '启用'
+      dialog.warning({
+        title: '提示',
+        content: `是否${statusStr}？`,
+        positiveText: '确定',
+        negativeText: '取消',
+        onPositiveClick: async () => {
+          try {
+            await rollCallSettingStatus({
+              ids: new Array(row.id),
+              status: !row.status
+            })
+            getList()
+            message.success(`${statusStr}成功`)
+          } catch {
+          }
+        }
+      })
+    }
+
+    const onBatchChangeStatus = (status: boolean) => {
+      const length = checkedRowKeysRef.value.length
+      if (length == 0) {
+        message.warning('未选择数据')
+      }
+      const statusStr = !status ? '停用' : '启用'
+      dialog.warning({
+        title: '提示',
+        content: `是否${statusStr}` + length + `条数据？`,
+        positiveText: '确定',
+        negativeText: '取消',
+        onPositiveClick: async () => {
+          try {
+            await rollCallSettingStatus({
+              ids: checkedRowKeysRef.value,
+              status: status
+            })
+            getList()
+            message.success(`${statusStr}成功`)
+          } catch {
+          }
+        }
+      })
+    }
+
+    const onRmove = (row: any): void => {
+      dialog.warning({
+        title: '提示',
+        content: `删除"${row.name}"，是否继续？`,
+        positiveText: '确定',
+        negativeText: '取消',
+        onPositiveClick: async () => {
+          try {
+            await rollCallSettingRemove(row.id)
+            getList()
+            message.success('删除成功')
+          } catch {
+          }
+        }
+      })
+    }
+
+    const getList = async () => {
+      try {
+        state.loading = true
+        const {data} = await rollCallSettingPage({...state.pagination, ...state.searchForm})
+        state.pagination.pageTotal = Number(data.total)
+        state.dataList = data.rows || []
+      } catch {
+      }
+      state.loading = false
+    }
+
+    const saveForm = ref()
+    const onSubmit = () => {
+      state.pagination.page = 1
+      getList()
+    }
+    const onSearch = () => {
+      saveForm.value?.submit()
+    }
+    const onBtnReset = () => {
+      saveForm.value?.reset()
+    }
+
+    onMounted(async () => {
+      state.loading = true
+      // getTagList()
+      getList()
+    })
+
+    return () => (
+        <div class="system-menu-container">
+          <SaveForm
+              ref={saveForm}
+              model={state.searchForm}
+              onSubmit={onSubmit}
+              saveKey="music-calligraphy"
+              onSetModel={(val: any) => (state.searchForm = val)}
+          >
+            <NFormItem label="关键词" path="keyword">
+              <NInput
+                  placeholder="请输入编号/调号"
+                  v-model:value={state.searchForm.keyword}
+                  clearable
+              />
+            </NFormItem>
+            <NFormItem label="状态" path="status">
+              <NSelect
+                  placeholder="请选择多声轨渲染"
+                  v-model:value={state.searchForm.status}
+                  options={[
+                    {
+                      label: '是',
+                      value: true
+                    },
+                    {
+                      label: '否',
+                      value: false
+                    }
+                  ] as any}
+                  clearable
+              />
+            </NFormItem>
+            <NFormItem>
+              <NSpace>
+                <NButton type="primary" onClick={onSearch}>
+                  搜索
+                </NButton>
+                <NButton type="default" onClick={onBtnReset}>
+                  重置
+                </NButton>
+              </NSpace>
+            </NFormItem>
+          </SaveForm>
+          <div class={['section-container']}>
+            <NSpace style={{paddingBottom: '12px'}}>
+              <NButton
+                  type="primary"
+                  // v-auth="musicSheet/save1751241178962984962"
+                  onClick={() => {
+                    state.showEdit = true
+                    state.editMode = 'add'
+                  }}
+              >
+                新增
+              </NButton>
+              <NButton
+                  disabled={checkedRowKeysRef.value.length == 0}
+                  // v-auth="musicSheet/statusList1751241653309407234"
+                  onClick={() => {
+                    onBatchChangeStatus(false)
+                  }}
+              >
+                批量停用
+              </NButton>
+              <NButton
+                  disabled={checkedRowKeysRef.value.length == 0}
+                  // v-auth="musicSheet/statusList1751241653309407234"
+                  onClick={() => {
+                    onBatchChangeStatus(true)
+                  }}
+              >
+                批量启用
+              </NButton>
+            </NSpace>
+
+            <NDataTable
+                loading={state.loading}
+                columns={columns()}
+                data={state.dataList}
+                rowKey={(row: any) => row.id}
+                onUpdateCheckedRowKeys={handleCheck}
+                scrollX={'1200'}
+            ></NDataTable>
+            <Pagination
+                v-model:page={state.pagination.page}
+                v-model:pageSize={state.pagination.rows}
+                v-model:pageTotal={state.pagination.pageTotal}
+                onList={getList}
+                sync
+                saveKey="music-list"
+            ></Pagination>
+          </div>
+
+          <NModal
+              blockScroll={true}
+              v-model:show={state.showEdit}
+              preset="dialog"
+              showIcon={false}
+              title={state.editMode == 'add' ? '新增' : '修改'}
+              style={{width: '500px'}}
+          >
+            <Edit
+                rowData={state.rowData}
+                editMode={state.editMode}
+                onClose={() => (state.showEdit = false)}
+                onGetList={getList}
+            />
+          </NModal>
+        </div>
+    )
+  }
+})

src/views/music-library/calligraphy/modal/edit.tsx

@@ -0,0 +1,129 @@
+import {defineComponent, onMounted, reactive, ref} from "vue";
+import {NButton, NForm, NFormItemGi, NGrid, NInput, NSpace, useMessage} from "naive-ui";
+import {rollCallSettingAdd, rollCallSettingUpdata} from "@views/music-library/api";
+
+export default defineComponent({
+  name: 'music-calligraphy-edit',
+  props: {
+    editMode: {
+      type: String,
+      required: true
+    },
+    rowData: {
+      type: Object,
+      required: false
+    },
+  },
+  emits: ['close', 'getList'],
+  setup(props, {slots, attrs, emit}) {
+    const message = useMessage()
+    const btnLoading = ref(false)
+    const forms = reactive({
+      name: null,
+      url: null,
+    })
+    const formsRef = ref()
+
+    const state = reactive({
+      rowData: null as any,
+      musicSheetCategories: [] as any,
+    })
+
+    onMounted(async () => {
+      state.rowData = props.rowData
+      if (props.editMode == 'edit' && props.rowData) {
+        forms.name = state.rowData.name
+        forms.url = state.rowData.url
+      }
+    })
+
+    const onSubmit = async () => {
+      formsRef.value.validate(async (error: any) => {
+        if (error) return false
+        btnLoading.value = true
+        try {
+          let res;
+          if (props.editMode == 'add') {
+            res = await rollCallSettingAdd(
+                {
+                  ...forms,
+                }
+            ) as any;
+          } else {
+            res = await rollCallSettingUpdata(
+                {
+                  ...forms,
+                  id: state.rowData.id
+                }
+            ) as any;
+          }
+          if (res && res.code === 200) {
+            emit('close')
+            emit('getList')
+          }
+        } catch (error) {
+        }
+        btnLoading.value = false
+      })
+    }
+
+    return () => {
+      return (
+          <div style="background: #fff; padding-top: 12px">
+            <NForm
+                ref={formsRef}
+                labelPlacement="top"
+                model={forms}
+                label-placement="left"
+                label-width="100"
+            >
+              <NGrid cols={1}>
+                <NFormItemGi
+                    label="调号"
+                    path="name"
+                    rule={[
+                      {
+                        required: true,
+                        message: '请输入调号'
+                      }
+                    ]}
+                >
+                  <NInput
+                      v-model:value={forms.name}
+                      placeholder="请输入调号"
+                      clearable
+                  />
+                </NFormItemGi>
+                <NFormItemGi
+                    label="连接地址"
+                    path="url"
+                    rule={[
+                      {
+                        required: true,
+                        message: '请输入连接地址'
+                      }
+                    ]}
+                >
+                  <NInput
+                      v-model:value={forms.url}
+                      placeholder="请输入平台标识"
+                      clearable
+                  />
+                </NFormItemGi>
+              </NGrid>
+            </NForm>
+
+            <NSpace justify="end">
+              <NButton onClick={() => emit('close')}>取消</NButton>
+              <NButton type="primary" onClick={onSubmit}
+                       loading={btnLoading.value}
+                       disabled={btnLoading.value}
+              >
+                保存
+              </NButton>
+            </NSpace>
+          </div>
+      )
+    }
+  }
+})