|
@@ -1,277 +1,424 @@
|
|
|
-<template>
|
|
|
- <div class="backgorundbox">
|
|
|
- <div class="logsbox">
|
|
|
- <div><span>TEAMModel·BI 数据监控系统</span></div>
|
|
|
+<template>
|
|
|
+ <div class="containbox">
|
|
|
+ <el-card class="classcard1" shadow="Always">
|
|
|
+ <span class="classspan">
|
|
|
+ 統購平台 - 產品管理
|
|
|
+ </span>
|
|
|
+ <div style="width: 100%;margin-bottom: 50px;">
|
|
|
+ <el-button type="primary" plain @click="clearform(),(dialogFormVisible= true)"
|
|
|
+ style="float: left;">新增</el-button>
|
|
|
+ </div>
|
|
|
+ <el-divider />
|
|
|
+ <div class="recordbox" style="width: 100%; height: 87vh" v-loading="loading" element-loading-text="loading...">
|
|
|
+ <el-auto-resizer>
|
|
|
+ <template #default="{ height, width }">
|
|
|
+ <el-table-v2 :columns="columns" :data="tableData" :style="{ width: '100%' }" :width="width" :height="height"
|
|
|
+ fixed />
|
|
|
+ </template>
|
|
|
+ </el-auto-resizer>
|
|
|
+ </div>
|
|
|
+ </el-card>
|
|
|
+ <el-dialog v-model="dialogFormVisible" title="購買產品" width="1000" @closed="clearform">
|
|
|
+ <el-form :model="form" :rules="rules" ref="ruleFormRef" :label-position="Top">
|
|
|
+ <el-form-item label="縣市" :label-width="formLabelWidth" prop="region">
|
|
|
+ <el-select v-model="form.region" placeholder="請選擇縣市" :disabled="isRegionDisabled">
|
|
|
+ <el-option v-for="item in optionsData" :key="item.code" :label="item.name" :value="item.code" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="產品名稱" :label-width="formLabelWidth" prop="name">
|
|
|
+ <el-select v-model="form.name" placeholder="請選擇產品" @change="handleChange" :disabled="isNameDisabled">
|
|
|
+ <el-option v-for="item in nameOptions" :key="item.value" :label="item.label" :value="item.value" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="空間" :label-width="formLabelWidth" v-show="isShowSpace">
|
|
|
+ <el-input v-model.number="form.space" style="width: 240px" placeholder="請輸入容量" /> (單位GB)
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="擴充項" :label-width="formLabelWidth" v-show="isShowExtensions">
|
|
|
+ <el-checkbox v-model="form.extensions" v-for="item in extensions" :key="item.Key" :label="item.Key"
|
|
|
+ :value="item.Key">
|
|
|
+ {{ item.Name }}
|
|
|
+ <el-input v-model="exqwen[item.Key]" style="width: 100px" placeholder="請輸入數量"
|
|
|
+ v-show="isShowExQwen(item.Key)" />
|
|
|
+ </el-checkbox>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="使用期限" :label-width="formLabelWidth" prop="time">
|
|
|
+ <el-date-picker v-model="form.time" type="daterange" range-separator="To" start-placeholder="開始時間"
|
|
|
+ end-placeholder="結束時間" :size="size" format="YYYY/MM/DD" value-format="YYYY-MM-DD" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="名額" :label-width="formLabelWidth" prop="qwen">
|
|
|
+ <el-input v-model.number="form.qwen" style="width: 240px" placeholder="請輸入名額" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <template #footer>
|
|
|
+ <div class="dialog-footer">
|
|
|
+ <el-button type="primary" @click="saveData">
|
|
|
+ 確定
|
|
|
+ </el-button>
|
|
|
+ <el-button @click="clearform">取消</el-button>
|
|
|
</div>
|
|
|
- <!-- <el-button type="primary" plain @click="quit = true">{{$t(`header.quit`)}}</el-button> -->
|
|
|
- <el-space direction="vertical" style="width: 100%;margin-left: auto;margin-right: auto;margin-top: 3%;"
|
|
|
- shadow="Always">
|
|
|
-
|
|
|
- <el-card style="width: 60%;" shadow="Always">
|
|
|
- <span
|
|
|
- style="font-size: 20px;border-bottom:1px #000 solid; padding-bottom:5px; margin-bottom: 20px;">統購平台
|
|
|
- - 產品管理</span>
|
|
|
- <!-- <div style="float: right;">
|
|
|
- <el-button type="primary" plain @click="routerskip('/AdminLogin')">返回</el-button>
|
|
|
- </div> -->
|
|
|
- <div style="float: right;">
|
|
|
- <el-button type="primary" plain @click="quit">{{$t(`header.quit`)}}</el-button>
|
|
|
- </div>
|
|
|
- <br /><br /><br />
|
|
|
-
|
|
|
- <el-button type="primary" plain @click="dialogFormVisible = true">新增</el-button>
|
|
|
- <el-divider />
|
|
|
- <el-table-v2 :columns="columns" :data="tableData" :width="1500" :height="400" fixed />
|
|
|
-
|
|
|
- <!-- <el-table :data="tableData" style="width: 100%; margin-bottom: 50px;">
|
|
|
- <el-table-column prop="region" label="縣市" width="200" />
|
|
|
- <el-table-column prop="name" label="產品名稱" width="200" />
|
|
|
- <el-table-column prop="extensions" label="擴充項" width="400" />
|
|
|
- <el-table-column prop="space" label="容量(GB)" width="100" />
|
|
|
- <el-table-column prop="qwen" label="名額" width="100" />
|
|
|
- <el-table-column prop="time" label="使用期限" width="400" />
|
|
|
- </el-table> -->
|
|
|
- </el-card>
|
|
|
- </el-space>
|
|
|
- <el-dialog v-model="dialogFormVisible" title="購買產品" width="700" @closed ="clearform">
|
|
|
- <el-form :model="form">
|
|
|
- <el-form-item label="縣市" :label-width="formLabelWidth">
|
|
|
- <el-select v-model="form.region" placeholder="請選擇縣市">
|
|
|
- <el-option label="臺北市" value="臺北市" />
|
|
|
- <el-option label="新北市" value="新北市" />
|
|
|
- <el-option label="桃園市" value="桃園市" />
|
|
|
- <el-option label="新竹市" value="新竹市" />
|
|
|
- <el-option label="苗栗市" value="苗栗市" />
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
-
|
|
|
- <el-form-item label="產品名稱" :label-width="formLabelWidth">
|
|
|
- <el-select v-model="form.name" placeholder="請選擇產品" @change="handleChange">
|
|
|
- <el-option label="Hiteach" value="Hiteach" />
|
|
|
- <el-option label="IES5個人空間" value="IES5個人空間" />
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="空間" :label-width="formLabelWidth" v-show="isShowSpace">
|
|
|
- <el-input v-model="form.space" style="width: 240px" placeholder="請輸入容量" /> (單位GB)
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="擴充項" :label-width="formLabelWidth" v-show="isShowExtensions">
|
|
|
- <el-checkbox v-model="form.extensions" v-for="extension in extensions" :key="extension"
|
|
|
- :label="extension" :value="extension">
|
|
|
- {{ extension }}
|
|
|
- </el-checkbox>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="使用期限" :label-width="formLabelWidth">
|
|
|
- <el-date-picker v-model="form.time" type="daterange" range-separator="To" start-placeholder="開始時間"
|
|
|
- end-placeholder="結束時間" :size="size" format="YYYY/MM/DD" value-format="YYYY-MM-DD" />
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="名額" :label-width="formLabelWidth">
|
|
|
- <el-input v-model="form.qwen" style="width: 240px" placeholder="請輸入名額" />
|
|
|
- </el-form-item>
|
|
|
- </el-form>
|
|
|
- <template #footer>
|
|
|
- <div class="dialog-footer">
|
|
|
- <el-button type="primary" @click="insert">
|
|
|
- 確定
|
|
|
- </el-button>
|
|
|
- <el-button @click="clearform">取消</el-button>
|
|
|
-
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </el-dialog>
|
|
|
- </div>
|
|
|
+ </template>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
|
|
|
- <script setup>
|
|
|
- //import { reactive } from 'vue'
|
|
|
+ <script setup>
|
|
|
import { useRouter } from 'vue-router'
|
|
|
- import { ref, reactive, onMounted } from 'vue'
|
|
|
+ import { ref, reactive, onMounted, getCurrentInstance } from 'vue'
|
|
|
import { ElMessage } from 'element-plus'
|
|
|
+ import option_gl from '@/static/regions/region_gl.json'
|
|
|
+ const optionsData = option_gl[0].children
|
|
|
+
|
|
|
+
|
|
|
//路由
|
|
|
const routers = useRouter()
|
|
|
+ const ruleFormRef = ref(null)
|
|
|
+ let { proxy } = getCurrentInstance()
|
|
|
|
|
|
- // function quit() {
|
|
|
- // debugger
|
|
|
- // localStorage.clear();
|
|
|
- // routers.push('/QrLogin')
|
|
|
- // }
|
|
|
const dialogFormVisible = ref(false)
|
|
|
+ const isRegionDisabled = ref(false)
|
|
|
+ const isNameDisabled = ref(false)
|
|
|
const formLabelWidth = '140px'
|
|
|
+ // 檢查數字不可為零
|
|
|
+ const validateNum = (rule, value, callback) => {
|
|
|
+ if (value === 0) {
|
|
|
+ callback(new Error('不可為零'))
|
|
|
+ }
|
|
|
+ callback();
|
|
|
+
|
|
|
+ }
|
|
|
+ // 驗證規則
|
|
|
+ const rules = reactive({
|
|
|
+ region: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: '請選擇縣市'
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ name: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: '請選擇產品名稱'
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ time: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: '請選擇使用期限'
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ qwen: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: '請輸入名額'
|
|
|
+ },
|
|
|
+ { type: 'number', message: '請輸入數字' },
|
|
|
+ { validator: validateNum, trigger: 'blur' },
|
|
|
+ ],
|
|
|
+ })
|
|
|
+
|
|
|
+ // 表單資料
|
|
|
const form = reactive({
|
|
|
region: '',
|
|
|
- name: '',
|
|
|
- qwen: '',
|
|
|
- time:'',
|
|
|
- space:'',
|
|
|
- extensions:[],
|
|
|
+ name: '',
|
|
|
+ qwen: 0,
|
|
|
+ time: '',
|
|
|
+ space: 0,
|
|
|
+ extensions: [],
|
|
|
rowIndex: -1
|
|
|
})
|
|
|
+ // 擴充項 數量
|
|
|
+ const exqwen = reactive({
|
|
|
+ cligroup: 0,
|
|
|
+ soknumber: 0,
|
|
|
+ client_volume: 0
|
|
|
+ });
|
|
|
+ const nameOptions = reactive([
|
|
|
+ { label: "HiTeach5縣市授權版", value: "VA67B6EZ" },
|
|
|
+ { label: "IES5個人空間縣市授權版", value: "VAA7B6EY" }
|
|
|
+ ]);
|
|
|
+
|
|
|
let tableData = reactive([
|
|
|
- {
|
|
|
- region: '新北市',
|
|
|
- name: 'Hiteach',
|
|
|
- qwen: '600',
|
|
|
- time: '2024-05-07~2024-05-11',
|
|
|
- space: '',
|
|
|
- extensions: ["AI智能終端", "分組數", "禁用硬體IRS", "議課人數", "學校簡碼", "蘇格拉底影片", "智慧評分系統", "雲端診斷分析系統", "蘇格拉底語音轉寫", "蘇格拉底小數據", "蘇格拉底報告", "蘇格拉底桌面", "IRS連線授權數", "USB錄影支援", "AI文句分析", "蘇格拉底議課APP", "電子學生證", "協作", "AI GPT服務"]
|
|
|
- }
|
|
|
- ])
|
|
|
+ // {
|
|
|
+ // region: '新北市',
|
|
|
+ // name: 'Hiteach',
|
|
|
+ // qwen: '600',
|
|
|
+ // time: '2024-05-07~2024-05-11',
|
|
|
+ // space: '',
|
|
|
+ // extensions: ["AI智能終端", "分組數", "禁用硬體IRS", "議課人數", "學校簡碼", "蘇格拉底影片", "智慧評分系統", "雲端診斷分析系統", "蘇格拉底語音轉寫", "蘇格拉底小數據", "蘇格拉底報告", "蘇格拉底桌面", "IRS連線授權數", "USB錄影支援", "AI文句分析", "蘇格拉底議課APP", "電子學生證", "協作", "AI GPT服務"]
|
|
|
+ // }
|
|
|
+ ])
|
|
|
+ let apiListData = reactive([{}])
|
|
|
let isShowSpace = ref(false)
|
|
|
let isShowExtensions = ref(false)
|
|
|
- let extensions = reactive(['AI智能終端',
|
|
|
- '禁用硬體IRS',
|
|
|
- 'USB錄影支援',
|
|
|
- 'AI文句分析',
|
|
|
- '分組數',
|
|
|
- '議課人數',
|
|
|
- 'IRS連線授權數',
|
|
|
- '蘇格拉底議課APP',
|
|
|
- '蘇格拉底影片',
|
|
|
- '學校簡碼',
|
|
|
- '蘇格拉底桌面',
|
|
|
- '電子學生證',
|
|
|
- '智慧評分系統',
|
|
|
- '蘇格拉底小數據',
|
|
|
- '蘇格拉底報告',
|
|
|
- '雲端診斷分析系統',
|
|
|
- '蘇格拉底語音轉寫',
|
|
|
- '協作',
|
|
|
- 'AI GPT服務',
|
|
|
- ]);
|
|
|
+ // 擴充項項目
|
|
|
+ const extensions = reactive([
|
|
|
+ {
|
|
|
+ Name: "AI智能終端",
|
|
|
+ Key: "ezs"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ Name: "禁用硬體IRS",
|
|
|
+ Key: "irs"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ Name: "USB錄影支援",
|
|
|
+ Key: "hdcam"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ Name: "AI文句分析",
|
|
|
+ Key: "wordanls"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ Name: "分組數",
|
|
|
+ Key: "cligroup"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ Name: "議課人數",
|
|
|
+ Key: "soknumber"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ Name: "IRS連線授權數",
|
|
|
+ Key: "client_volume"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ Name: "蘇格拉底議課APP",
|
|
|
+ Key: "sokapp"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ Name: "蘇格拉底影片",
|
|
|
+ Key: "sokvdo"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ Name: "學校簡碼",
|
|
|
+ Key: "schoolinfo"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ Name: "蘇格拉底桌面",
|
|
|
+ Key: "sokdesk"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ Name: "電子學生證",
|
|
|
+ Key: "dgistuid"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ Name: "智慧評分系統",
|
|
|
+ Key: "scorsys"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ Name: "蘇格拉底小數據",
|
|
|
+ Key: "soksdata"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ Name: "蘇格拉底報告",
|
|
|
+ Key: "sokrpt"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ Name: "雲端診斷分析系統",
|
|
|
+ Key: "cloudas"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ Name: "蘇格拉底語音轉寫",
|
|
|
+ Key: "sokvtt"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ Name: "協作",
|
|
|
+ Key: "cowork"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ Name: "AI GPT服務",
|
|
|
+ Key: "aigpt"
|
|
|
+ },
|
|
|
+ ]);
|
|
|
+ // 列表欄位
|
|
|
let columns = ref([
|
|
|
- {
|
|
|
- key: "region",
|
|
|
- dataKey: "region",
|
|
|
- title: "城市",
|
|
|
- width: 200,
|
|
|
- headerClass: 'general',
|
|
|
- //sortable:true
|
|
|
- },
|
|
|
- {
|
|
|
- key: "name",
|
|
|
- dataKey: "name",
|
|
|
- title: "產品名稱",
|
|
|
- width: 200,
|
|
|
- headerClass: 'general',
|
|
|
- //sortable:true
|
|
|
- },
|
|
|
- {
|
|
|
- key: "extensions",
|
|
|
- dataKey: "extensions",
|
|
|
- title: "擴充項",
|
|
|
- width: 500,
|
|
|
- headerClass: 'general',
|
|
|
-
|
|
|
- //sortable:true
|
|
|
- },
|
|
|
- {
|
|
|
- key: "space",
|
|
|
- dataKey: "space",
|
|
|
- title: "容量(GB)",
|
|
|
- width: 100,
|
|
|
- headerClass: 'general',
|
|
|
- //sortable:true
|
|
|
- },
|
|
|
- {
|
|
|
- key: "qwen",
|
|
|
- dataKey: "qwen",
|
|
|
- title: "名額",
|
|
|
- width: 100,
|
|
|
- headerClass: 'general',
|
|
|
- },
|
|
|
- {
|
|
|
- key: "time",
|
|
|
- dataKey: "time",
|
|
|
- title: "使用期限",
|
|
|
- width: 200,
|
|
|
- headerClass: 'general',
|
|
|
- },
|
|
|
- {
|
|
|
- key: "handle",
|
|
|
- title: "",
|
|
|
- width: 100,
|
|
|
- align: "center",
|
|
|
- headerClass: 'btn-class',
|
|
|
- cellRenderer: (data) =>
|
|
|
- (
|
|
|
- <>
|
|
|
- <el-button type="primary" onClick={editItem.bind(this,data)}>編輯</el-button>
|
|
|
- </>
|
|
|
- )
|
|
|
- },
|
|
|
-])
|
|
|
-
|
|
|
- onMounted(() => {
|
|
|
+ {
|
|
|
+ key: "region",
|
|
|
+ dataKey: "region",
|
|
|
+ title: "城市",
|
|
|
+ width: 110,
|
|
|
+ headerClass: 'general',
|
|
|
+ //sortable:true
|
|
|
+ },
|
|
|
+ {
|
|
|
+ key: "name",
|
|
|
+ dataKey: "name",
|
|
|
+ title: "產品名稱",
|
|
|
+ width: 250,
|
|
|
+ headerClass: 'general',
|
|
|
+ //sortable:true
|
|
|
+ },
|
|
|
+ {
|
|
|
+ key: "extensions",
|
|
|
+ dataKey: "extensions",
|
|
|
+ title: "擴充項",
|
|
|
+ width: 600,
|
|
|
+ headerClass: 'general',
|
|
|
+
|
|
|
+ //sortable:true
|
|
|
+ },
|
|
|
+ {
|
|
|
+ key: "space",
|
|
|
+ dataKey: "space",
|
|
|
+ title: "容量(GB)",
|
|
|
+ width: 120,
|
|
|
+ headerClass: 'general',
|
|
|
+ //sortable:true
|
|
|
+ },
|
|
|
+ {
|
|
|
+ key: "qwen",
|
|
|
+ dataKey: "qwen",
|
|
|
+ title: "名額",
|
|
|
+ width: 100,
|
|
|
+ headerClass: 'general',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ key: "time",
|
|
|
+ dataKey: "time",
|
|
|
+ title: "使用期限",
|
|
|
+ width: 300,
|
|
|
+ headerClass: 'general',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ key: "handle",
|
|
|
+ title: "",
|
|
|
+ width: 100,
|
|
|
+ align: "center",
|
|
|
+ headerClass: 'btn-class',
|
|
|
+ cellRenderer: (data) =>
|
|
|
+ (
|
|
|
+ <>
|
|
|
+ <el-button type="primary" onClick={editItem.bind(this, data)}>編輯</el-button>
|
|
|
+ </>
|
|
|
+ )
|
|
|
+ },
|
|
|
+ ])
|
|
|
+
|
|
|
+ onMounted(() => {
|
|
|
//routers.push({ name: 'adminpanel'})
|
|
|
//routers.forward()
|
|
|
- // 統購平台大陸先遮蔽
|
|
|
- let siteValue = window.location.host === 'bi.teammodel.cn' ? 'cn' : window.location.host === 'bitest.teammodel.cn' ? 'cn' : 'international'
|
|
|
- //debugger
|
|
|
- if (siteValue === 'cn') {
|
|
|
- routers.push('/home/index')
|
|
|
- }
|
|
|
-
|
|
|
+ // 統購平台大陸先遮蔽
|
|
|
+ let siteValue = window.location.host === 'bi.teammodel.cn' ? 'cn' : window.location.host === 'bitest.teammodel.cn' ? 'cn' : 'international'
|
|
|
+ //debugger
|
|
|
+ if (siteValue === 'cn') {
|
|
|
+ routers.push('/home/index')
|
|
|
+ }
|
|
|
+ getList();
|
|
|
+ })
|
|
|
+ function getList() {
|
|
|
+ tableData.splice(0, tableData.length);
|
|
|
+ let data = {};
|
|
|
+ proxy.$api.getBBPurchase(data).then((res) => {
|
|
|
+ apiListData = res;
|
|
|
+ apiListData.forEach((element, index) => {
|
|
|
+ let item = {
|
|
|
+ index:-1,
|
|
|
+ region: '',
|
|
|
+ name: '',
|
|
|
+ qwen: 0,
|
|
|
+ time: '',
|
|
|
+ space: 0,
|
|
|
+ extensions: []
|
|
|
+ }
|
|
|
+ item.index = index;
|
|
|
+ // 設定列表用欄位值 -- start
|
|
|
+ let odItem = optionsData.find(od => od.code == element.cityId)
|
|
|
+ item.region = odItem.name;
|
|
|
+ let noItem = nameOptions.find(no => no.value == element.prodCode)
|
|
|
+ item.name = noItem.label;
|
|
|
+ item.qwen = element.seats;
|
|
|
+ item.time = proxy.$common.timestampToTime(element.startDate, '') + "~" + proxy.$common.timestampToTime(element.endDate, '');
|
|
|
+ item.space = (noItem.value === "VA67B6EZ") ? "--" : element.number;// 如果是Hiteach容量為0
|
|
|
+ element.aprule.forEach(apItem => {
|
|
|
+ let exItem = extensions.find(ex => ex.Key == apItem.key)
|
|
|
+ item.extensions.push(exItem.Name);
|
|
|
+ });
|
|
|
+ tableData.push(item);
|
|
|
+ // 設定列表用欄位值 -- end
|
|
|
+ });
|
|
|
+ }).catch((error) => {
|
|
|
+ ElMessage.error('API异常')
|
|
|
+ })
|
|
|
+ }
|
|
|
+ function saveData() {
|
|
|
+ if (!ruleFormRef) return;
|
|
|
+ ruleFormRef.value.validate((valid) => {
|
|
|
+ if (valid) {
|
|
|
+ // 表单验证通过,可以提交表单数据
|
|
|
+ let ap = [];
|
|
|
+ form.extensions.forEach(element => {
|
|
|
+ let val = 1;
|
|
|
+ if (element === "cligroup") { val = exqwen.cligroup; }
|
|
|
+ if (element === "soknumber") { val = exqwen.soknumber; }
|
|
|
+ if (element === "client_volume") { val = exqwen.client_volume; }
|
|
|
+ let item = { "key": element, "val": val }
|
|
|
+ ap.push(item);
|
|
|
+ });
|
|
|
+ let data = {
|
|
|
+ countryId: "TW",
|
|
|
+ provinceId: "",
|
|
|
+ cityId: form.region,
|
|
|
+ dataCenter: "Global",
|
|
|
+ prodCode: form.name,
|
|
|
+ startDate: form.time[0],
|
|
|
+ endDate: form.time[1],
|
|
|
+ seats: form.qwen,
|
|
|
+ number: form.space === "" ? 1 : form.space,
|
|
|
+ ap: ap
|
|
|
+ }
|
|
|
+ console.log(data);
|
|
|
+ proxy.$api.setPurchaseSeats(data).then((res) => {
|
|
|
+ res.err === '' ? console.log(res, '新增成功') : console.log(res, '新增失敗')
|
|
|
+ clearform();
|
|
|
+ getList();
|
|
|
+ }).catch((error) => {
|
|
|
+ ElMessage.error('API异常')
|
|
|
+ })
|
|
|
|
|
|
- })
|
|
|
- function insert(){
|
|
|
- //debugger
|
|
|
- dialogFormVisible.value = false
|
|
|
- if (form.rowIndex === -1) {
|
|
|
- // 新增模式
|
|
|
- var item = {
|
|
|
- region: form.region,
|
|
|
- name: form.name,
|
|
|
- qwen: form.qwen,
|
|
|
- time: form.time[0] + "~" + form.time[1],
|
|
|
- space: form.space,
|
|
|
- extensions: form.extensions
|
|
|
- }
|
|
|
- tableData.push(item);
|
|
|
- ElMessage({
|
|
|
- message: '新增成功!',
|
|
|
- type: 'success',
|
|
|
- })
|
|
|
+ // 在这里进行提交表单的操作
|
|
|
} else {
|
|
|
- // 編輯模式
|
|
|
- tableData[form.rowIndex].region = form.region
|
|
|
- tableData[form.rowIndex].name = form.name
|
|
|
- tableData[form.rowIndex].qwen = form.qwen
|
|
|
- tableData[form.rowIndex].time = form.time[0] + "~" + form.time[1],
|
|
|
- tableData[form.rowIndex].space = form.space
|
|
|
- tableData[form.rowIndex].extensions = form.extensions
|
|
|
+ // 表单验证失败,可以给出提示或处理
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ });
|
|
|
|
|
|
- }
|
|
|
- clearform();
|
|
|
|
|
|
+
|
|
|
}
|
|
|
- function handleChange(){
|
|
|
- //debugger
|
|
|
- if(form.name==='Hiteach'){
|
|
|
- isShowSpace.value = false;
|
|
|
- isShowExtensions.value = true;
|
|
|
+ // 產品表單切換
|
|
|
+ function handleChange() {
|
|
|
+ if (form.name === 'VA67B6EZ') {
|
|
|
+ isShowSpace.value = false;
|
|
|
+ isShowExtensions.value = true;
|
|
|
}
|
|
|
- if(form.name==='IES5個人空間'){
|
|
|
- isShowSpace.value = true;
|
|
|
- isShowExtensions.value = false;
|
|
|
+ if (form.name === 'VAA7B6EY') {
|
|
|
+ isShowSpace.value = true;
|
|
|
+ isShowExtensions.value = false;
|
|
|
}
|
|
|
}
|
|
|
-function editItem(obj1,obj2) {
|
|
|
- debugger
|
|
|
+ function editItem(obj1, obj2) {
|
|
|
dialogFormVisible.value = true;
|
|
|
- if(obj1.rowData.name === ""){
|
|
|
-
|
|
|
- }
|
|
|
- form.region = obj1.rowData.region
|
|
|
- form.name = obj1.rowData.name
|
|
|
- form.qwen = obj1.rowData.qwen
|
|
|
- form.time = obj1.rowData.time.split('~')
|
|
|
- form.space = obj1.rowData.space
|
|
|
- form.extensions = obj1.rowData.extensions
|
|
|
- form.rowIndex = obj1.rowIndex
|
|
|
+ isRegionDisabled.value = true;
|
|
|
+ isNameDisabled.value = true;
|
|
|
+ let dataIndex = obj1.rowData.index;
|
|
|
+
|
|
|
+ form.region = apiListData[dataIndex].cityId;
|
|
|
+ form.name = apiListData[dataIndex].prodCode;
|
|
|
+ form.qwen = apiListData[dataIndex].seats;
|
|
|
+ form.time = [proxy.$common.timestampToTime(apiListData[dataIndex].startDate, '').trim(), proxy.$common.timestampToTime(apiListData[dataIndex].endDate, '').trim()];
|
|
|
+ form.space = apiListData[dataIndex].number;
|
|
|
+ apiListData[dataIndex].aprule.forEach(item =>{
|
|
|
+ form.extensions.push( item.key );
|
|
|
+ if (item.key === "cligroup" || item.key === "soknumber" || item.key === "client_volume") {
|
|
|
+ exqwen[item.key]=item.val;
|
|
|
+ }
|
|
|
+ })
|
|
|
+ //form.extensions = obj1.rowData.extensions;
|
|
|
+ form.rowIndex = dataIndex;
|
|
|
handleChange();
|
|
|
//clearform();
|
|
|
|
|
|
-}
|
|
|
-function quit() {
|
|
|
+ }
|
|
|
+ function quit() {
|
|
|
routers.push('/login?htype=adminlogin')
|
|
|
localStorage.removeItem('userData')
|
|
|
localStorage.removeItem('id_token')
|
|
@@ -279,22 +426,36 @@ function quit() {
|
|
|
localStorage.removeItem('management')
|
|
|
localStorage.removeItem('organization')
|
|
|
// localStorage.clear()
|
|
|
-}
|
|
|
-function clearform(){
|
|
|
- form.region= ''
|
|
|
- form.name= ''
|
|
|
- form.qwen= ''
|
|
|
- form.time=''
|
|
|
- form.space=''
|
|
|
- form.extensions=[]
|
|
|
+ }
|
|
|
+ // 重置表單
|
|
|
+ function clearform() {
|
|
|
+ // 重置表單驗證狀態
|
|
|
+ if (ruleFormRef.value !== null) {
|
|
|
+ ruleFormRef.value.resetFields()
|
|
|
+ }
|
|
|
+ form.region = ''
|
|
|
+ form.name = ''
|
|
|
+ form.qwen = ''
|
|
|
+ form.time = ''
|
|
|
+ form.space = ''
|
|
|
+ form.extensions = []
|
|
|
form.rowIndex = -1
|
|
|
+ exqwen.client_volume = 0
|
|
|
+ exqwen.cligroup = 0
|
|
|
+ exqwen.soknumber = 0
|
|
|
isShowSpace.value = false;
|
|
|
isShowExtensions.value = false;
|
|
|
dialogFormVisible.value = false
|
|
|
-}
|
|
|
-
|
|
|
- </script>
|
|
|
-
|
|
|
+ isRegionDisabled.value = false;
|
|
|
+ isNameDisabled.value = false;
|
|
|
+
|
|
|
+ }
|
|
|
+ // 檢查是否為數字型擴充項
|
|
|
+ function isShowExQwen(exKey){
|
|
|
+ if (exKey === "cligroup" || exKey === "soknumber" || exKey === "client_volume") { return true; } else { return false; }
|
|
|
+ }
|
|
|
+
|
|
|
+ </script>
|
|
|
<style >
|
|
|
/* .el-table-v2__cell-text{
|
|
|
white-space: normal !important;
|
|
@@ -303,39 +464,22 @@ function clearform(){
|
|
|
width: 100% !important;
|
|
|
height: auto !important;
|
|
|
} */
|
|
|
-
|
|
|
- </style>
|
|
|
-<style scoped>
|
|
|
-.backgorundbox {
|
|
|
- background: url("../../assets/img/background1.png") no-repeat;
|
|
|
- background-size: cover;
|
|
|
- width: 100vw;
|
|
|
- height: 100vh;
|
|
|
- position: relative;
|
|
|
- /* filter: blur(2px); */
|
|
|
-}
|
|
|
-
|
|
|
-.logsbox {
|
|
|
- color:#fff;
|
|
|
- font-size: 34px;
|
|
|
- text-align: center;
|
|
|
- width: 95%;
|
|
|
- line-height: 50px;
|
|
|
- ;
|
|
|
- position: relative;
|
|
|
+ .el-main .containbox {
|
|
|
+ line-height: 50px!important;
|
|
|
}
|
|
|
-
|
|
|
-.logsbox .el-icon-s-order {
|
|
|
+.el-table-v2__cell-text{
|
|
|
font-size: 16px;
|
|
|
-}
|
|
|
-.header-icon {
|
|
|
- width: 1.2em;
|
|
|
- height: 1.2em;
|
|
|
- vertical-align: -0.3em;
|
|
|
- fill: currentColor;
|
|
|
- overflow: hidden;
|
|
|
- margin-right: 5px;
|
|
|
-}
|
|
|
+ color:black;
|
|
|
+ font-weight:500;
|
|
|
+ }
|
|
|
+ .el-table-v2__header-cell {
|
|
|
+ font-size: 16px;
|
|
|
+ color:black;
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+
|
|
|
+ </style>
|
|
|
+<style scoped>
|
|
|
|
|
|
:deep(.my-label) {
|
|
|
background: var(--el-color-success-light-9) !important;
|
|
@@ -344,5 +488,16 @@ function clearform(){
|
|
|
:deep(.my-content) {
|
|
|
background: var(--el-color-danger-light-9);
|
|
|
}
|
|
|
+.classcard1{
|
|
|
+ width: 97%;margin: 20px 30px 20px 30px ;
|
|
|
+}
|
|
|
+.classspan{
|
|
|
+ font-size: 25px;border-bottom:1px #000 solid; padding-bottom:5px; margin-bottom: 20px;
|
|
|
+}
|
|
|
+.recordbox {
|
|
|
+ width: 100%;
|
|
|
+ padding-left: 1%;
|
|
|
+ padding-right: 1%;
|
|
|
+}
|
|
|
|
|
|
</style>
|