共享图表

.env.development

@@ -4,6 +4,6 @@ NODE_ENV = 'development'
 VUE_APP_MODE = 'development'
 
 # VUE_APP_BASE_API = 'http://192.168.3.149:7654'
-VUE_APP_BASE_API = '/api'
+VUE_APP_BASE_API = '/op/base'
 
 VUE_APP_DATA_OPS = 'https://company.citupro.com:18183'

src/api/accumulatePoint.js

@@ -50,17 +50,22 @@ export function getAccumulatePointProductHistory (data) {
   return http.post('/score/consumption/record/user/page', data)
 }
 
-// 积分规则 列表
+// 积分规则模块 列表
 export function getAccumulatePointRulesList (data) {
   return http.post('/employee/score/rule/page', data)
 }
 
-// 积分规则 列表
+// 积分规则模块 保存
 export function saveAccumulatePointRules (data) {
   return http.post('/employee/score/rule/save', data)
 }
 
-// 积分规则 列表
+// 积分规则模块 删除
 export function deleteAccumulatePointRules (data) {
   return http.post('/employee/score/rule/del', data)
 }
+
+// 积分规则模块 明细
+export function getAccumulatePointRules (data) {
+  return http.post('/employee/score/rule/detail', data)
+}

src/api/dataOps.js

@@ -0,0 +1,6 @@
+import http from '@/utils/request'
+
+// 积分 列表
+export function getAsk (data) {
+  return http.post('/api/v0/ask', data)
+}

src/utils/request.js

@@ -102,7 +102,7 @@ service.interceptors.response.use(
       }
     }
 
-    if (res.code !== 20000) {
+    if (res.code !== 20000 && res.code !== 200) {
       if (res.data && Object.keys(res.data).length) {
         return Promise.reject(res)
       }

src/views/accumulatePoints/accumulatePointsRules/accumulatePointsRulesEdit.vue

@@ -1,5 +1,5 @@
 <template>
-  <m-dialog ref="dialog" title="编辑积分规则">
+  <m-dialog ref="dialog" :title="`${itemData.employeeScoreRuleId ? '编辑' : '新增'}积分模块`">
 
   </m-dialog>
 </template>
@@ -7,6 +7,11 @@
 <script>
 export default {
   name: 'accumulatePointsRulesEdit',
+  data () {
+    return {
+      itemData: {}
+    }
+  },
   methods: {
     open (item) {
       this.$refs.dialog.open()

src/views/accumulatePoints/accumulatePointsRules/index.vue

@@ -19,6 +19,7 @@
         <m-button type="danger" text @click="onDelete(row)">删除</m-button>
       </template>
     </m-table>
+    <AccumulatePointsRulesEdit ref="accumulatePointsRulesEditRefs"></AccumulatePointsRulesEdit>
   </div>
 </template>
 
@@ -26,8 +27,12 @@
 import {
   getAccumulatePointRulesList
 } from '@/api/accumulatePoint'
+import AccumulatePointsRulesEdit from './accumulatePointsRulesEdit.vue'
 export default {
   name: 'AccumulatePointRules',
+  components: {
+    AccumulatePointsRulesEdit
+  },
   data () {
     return {
       searchItems: [
@@ -89,10 +94,10 @@ export default {
       }
     },
     onAdd () {
-      this.$refs.accumulatePointRefs.open()
+      this.$refs.accumulatePointsRulesEditRefs.open()
     },
     onEdit (item) {
-      this.$refs.accumulatePointRefs.open(item)
+      this.$refs.accumulatePointsRulesEditRefs.open(item)
     },
     onDetails () {},
     onDelete (row) {

src/views/dataChart/privateChart/privateChartEdit.vue

@@ -1,5 +1,5 @@
 <template>
-  <m-dialog ref="dialog" v-bind="$attrs" title="图表编辑" @sure="onSure">
+  <m-dialog ref="dialog" v-bind="$attrs" title="图表编辑" hideFooter>
     <div class="pa-3 fullscreen border-box" v-loading="loading">
       <m-card shadow="never" class="fullscreen border-box" :body-style="{ height: '100%', padding: 0 }">
         <div class="d-flex box fullscreen">
@@ -10,7 +10,13 @@
             ></PrivateChartEditType>
           </div>
           <div class="box-main border-box">
-            <m-card shadow="never" class="fullHeight" :bodyStyle="{ height: '100%' }">
+            <m-card class="box-main-top" shadow="never">
+              <div class="d-flex justify-between">
+                <el-tag>{{ itemData.content?.name }}</el-tag>
+                <m-button type="orange" size="small" @click="onSave" :disabled="empty">保存图表</m-button>
+              </div>
+            </m-card>
+            <m-card shadow="never" class="box-main-bottom" :bodyStyle="{ height: '100%', 'box-sizing': 'border-box' }">
               <el-empty v-if="empty"></el-empty>
               <PrivateChartEditShow
                 ref="privateChartEditShowRefs"
@@ -23,7 +29,6 @@
               ref="privateChartEditParamsRefs"
               class="fullscreen"
               @render="onChangParams"
-              @render:config="onChangeConfig"
             ></PrivateChartEditParams>
           </div>
         </div>
@@ -36,6 +41,10 @@
 import PrivateChartEditShow from './privateChartEditShow.vue'
 import PrivateChartEditType from './privateChartEditType.vue'
 import PrivateChartEditParams from './privateChartEditParams.vue'
+import {
+  getWebSetting,
+  saveWebSetting
+} from '@/api/system'
 export default {
   name: 'privateChartEdit',
   components: {
@@ -51,29 +60,42 @@ export default {
       option: {
         xAxisData: []
       },
-      data: [[1, 2, 3, 4, 5, 6]]
+      data: [[1, 2, 3, 4, 5, 6]],
+      itemData: {}
     }
   },
   methods: {
     async open (item) {
       this.$refs.dialog.open()
-      // this.loading = true
-      this.$nextTick(async () => {
+      this.loading = true
+      try {
+        const { data } = await getWebSetting({
+          webSettingId: item.webSettingId
+        })
+        this.itemData = data
+        this.$nextTick(async () => {
         // 实例化图例
-        this.$refs.privateChartEditShowRefs.onInit()
-        if (!item.data) {
-          this.empty = true
-          return
-        }
-        this.empty = false
-        //   // 获取初始化设置
-        //   const { key } = this.$refs.privateChartEditTypeRefs.getDefault()
-        //   this.key = key
-        //   this.option.xAxisData = ['星期一', '星期二', '星期三', '星期四', '星期五', '星期六']
-        //   this.setData()
-        //   this.loading = false
-        // }
-      })
+          this.$refs.privateChartEditShowRefs.onInit()
+          const _data = data.content.data
+          if (!_data) {
+            this.empty = true
+            return
+          }
+          this.empty = false
+          this.key = _data.key
+          this.option = _data.option
+          this.data = _data.data
+          //   // 获取初始化设置
+          // const { key } = this.$refs.privateChartEditTypeRefs.getDefault()
+          // this.key = key
+          // this.option.xAxisData = ['星期一', '星期二', '星期三', '星期四', '星期五', '星期六']
+          this.setData()
+        })
+      } catch (error) {
+        this.$message.error(error)
+      } finally {
+        this.loading = false
+      }
     },
     setData () {
       this.empty = false
@@ -85,18 +107,45 @@ export default {
       this.setData()
     },
     // 改变数据参数
-    onChangParams (data) {
+    onChangParams ({ type, data }) {
+      this.option.xAxisData = type
       this.data = data
+      if (!this.key) {
+        const { key } = this.$refs.privateChartEditTypeRefs.getDefault()
+        this.key = key
+      }
       this.setData()
+      console.log(type, data)
     },
     // x、y轴数据
-    onChangeConfig (obj) {
-      // const { x, y } = obj
-      console.log(obj)
-    },
-    onSure () {
-      this.$refs.dialog.close()
-      this.$emit('refresh')
+    // onChangeConfig (obj) {
+    //   // const { x, y } = obj
+    //   console.log(obj)
+    // },
+    async onSave () {
+      const {
+        data,
+        ...obj
+      } = this.itemData.content
+      try {
+        await saveWebSetting({
+          webSettingId: this.itemData.webSettingId,
+          content: {
+            ...obj,
+            data: {
+              data: this.data,
+              key: this.key,
+              option: this.option
+            }
+          }
+        })
+        this.$refs.dialog.close()
+        this.$emit('refresh')
+      } catch (error) {
+        this.$message.error(error)
+      } finally {
+        this.loading = false
+      }
     }
   }
 }
@@ -108,7 +157,8 @@ export default {
 }
 .box {
   $left: 146px;
-  $right: 500px;
+  $right: 650px;
+  box-sizing: border-box;
   &-left {
     width: $left;
   }
@@ -116,6 +166,15 @@ export default {
     padding: 10px 0;
     width: calc(100% - #{$left} - #{$right});
     height: 100%;
+    $h: 72px;
+    $heightMB: 12px;
+    &-top {
+      height: $h;
+      margin-bottom: 12px;
+    }
+    &-bottom {
+      height: calc(100% - 84px);
+    }
   }
   &-right {
     width: $right;

src/views/dataChart/privateChart/privateChartEditParams.vue

@@ -18,9 +18,38 @@
                 <div class="box-msg-items-item-title">
                   {{ item.type === 1 ? '我' : '图表助手' }}
                 </div>
-                <div class="box-msg-items-item-content">
+                <div v-if="item.type === 1" class="box-msg-items-item-content">
                   {{ item.content }}
                 </div>
+                <div v-if="item.type === 2" class="box-msg-items-item-content">
+                  <template v-if="Object.keys(item.content).length === 0">
+                    正在思考中...
+                  </template>
+                  <template v-else>
+                    <div>
+                      {{ item.content.sql }}
+                    </div>
+                    <div class="mt-3">
+                      <m-table
+                        clearHeader
+                        shadow="never"
+                        :headers="item.content.columns"
+                        :items="item.content.rows"
+                      ></m-table>
+                      <el-popover
+                        placement="bottom"
+                        width="200"
+                        trigger="click"
+                      >
+                        <m-form :ref="`form${i}`" label-width="60px" :items="formItems(item.content.columns)" v-model="item.model"></m-form>
+                        <div style="text-align: right; margin: 0">
+                          <m-button type="primary" size="mini" @click="onRender($refs[`form${i}`], item)">生成图表</m-button>
+                        </div>
+                        <m-button type="primary" text slot="reference">我要作图</m-button>
+                      </el-popover>
+                    </div>
+                  </template>
+                </div>
               </div>
             </div>
           </div>
@@ -39,6 +68,9 @@
 // 数据模块
 // import PrivateChartEditParamsData from './privateChartEditParamsData.vue'
 // import PrivateChartEditParamsConfig from './privateChartEditParamsConfig.vue'
+import {
+  getAsk
+} from '@/api/dataOps'
 export default {
   name: 'privateChartEditParams',
   // components: {
@@ -48,21 +80,36 @@ export default {
   data () {
     return {
       activeName: 'third',
-      inputTxt: null,
-      items: [
+      inputTxt: '男女持卡比例',
+      items: []
+    }
+  },
+  methods: {
+    formItems (items) {
+      return [
         {
-          type: 1,
-          content: 'Lorem ipsum dolor sit amet consectetur, adipisicing elit. Sed, eos beatae? Labore maiores soluta tempore iste dolores adipisci libero quo sed, sunt non quam cupiditate, dolor dolorum, earum fugit nemo.'
+          label: '类型轴',
+          prop: 'typeAxis',
+          type: 'select',
+          style: 'margin-bottom: 0 !important',
+          options: {
+            size: 'mini',
+            items
+          }
         },
         {
-          type: 2,
-          content: 'Lorem ipsum dolor sit amet consectetur, adipisicing elit. Sed, eos beatae? Labore maiores soluta tempore iste dolores adipisci libero quo sed, sunt non quam cupiditate, dolor dolorum, earum fugit nemo.'
+          label: '数据轴',
+          prop: 'dataAxis',
+          type: 'select',
+          options: {
+            size: 'mini',
+            multiple: true,
+            items
+          }
         }
       ]
-    }
-  },
-  methods: {
-    onSubmit () {
+    },
+    async onSubmit () {
       if (!this.inputTxt) {
         return
       }
@@ -70,8 +117,29 @@ export default {
         type: 1,
         content: this.inputTxt
       })
-      this.inputTxt = null
-      // this.submitForm()
+      const ask = {
+        type: 2,
+        content: {},
+        model: {
+          dataAxis: null,
+          typeAxis: null
+        }
+      }
+      this.items.push(ask)
+      try {
+        const { data } = await getAsk({
+          question: this.inputTxt
+        })
+        const { columns, ...obj } = data
+        ask.content = {
+          ...obj,
+          columns: columns.map(e => ({ label: e, prop: e, value: e }))
+        }
+      } catch (error) {
+        this.$message.error(error)
+      } finally {
+        this.inputTxt = null
+      }
     },
     // 数据读取
     onGetRefs () {
@@ -80,19 +148,15 @@ export default {
         configRefs: this.$refs.config
       }
     },
-    // onRender (items) {
-    //   this.$refs.config.onSetConfig(Object.keys(items[0]).map(e => {
-    //     return {
-    //       name: e,
-    //       value: e
-    //     }
-    //   }))
-    //   console.log('onRender', items)
-    //   // this.$emit('render', v)
-    // },
-    // onChangeConfig (v) {
-    //   this.$emit('render:config', v)
-    // },
+    onRender (ref, { model, content }) {
+      const { typeAxis, dataAxis } = model
+      const data = {
+        type: typeAxis ? content.rows.map(e => e[typeAxis]) : [],
+        data: dataAxis ? dataAxis.map(e => content.rows.map(r => r[e])) : []
+      }
+      console.log(111, data)
+      this.$emit('render', data)
+    },
     handleClick () {}
   }
 }

src/views/dataChart/privateChart/privateChartEditShow.vue

@@ -29,6 +29,7 @@ export default {
       this.chart.showLoading()
       // 根据key值处理data
       this.data = data || [[]]
+      console.log(111, Charts[key], key)
       const _option = cloneDeep(Charts[key].option)
       const series = _option.series
       const _data = []

src/views/dataChart/shareChart/index.vue

@@ -2,7 +2,7 @@
   <div class="pa-3 white">
     <el-empty v-if="items.length === 0"></el-empty>
     <m-card
-      v-for="item in items"
+      v-for="(item, i) in items"
       :key="item.webSettingId"
       class="mb-3"
       :title="item.name"
@@ -11,16 +11,21 @@
         {{ item.name }}
       </template>
       <el-empty v-if="!item.data"></el-empty>
+      <MShow v-else :ref="`show${i}`" style="height: 400px"></MShow>
     </m-card>
   </div>
 </template>
 
 <script>
+import MShow from '../privateChart/privateChartEditShow.vue'
 import {
   webSettingList
 } from '@/api/system'
 export default {
   name: 'ShareChart',
+  components: {
+    MShow
+  },
   data () {
     return {
       items: [],
@@ -51,6 +56,19 @@ export default {
           }
         })
         this.total = data.total
+        this.$nextTick(() => {
+          console.log(this.$refs)
+          this.items.forEach((e, i) => {
+            if (!e.data) {
+              return
+            }
+            this.$refs[`show${i}`][0].onInit()
+            setTimeout(() => {
+              const { data: _data, key, option } = e.data
+              this.$refs[`show${i}`][0].setData(_data, key, option)
+            })
+          })
+        })
       } catch (error) {
         this.message.error(error.message || '请求失败')
       } finally {

vue.config.js

@@ -19,13 +19,22 @@ module.exports = defineConfig({
     hot: true,
     // https: false,
     proxy: {
-      '/api': {
+      '/op/base': {
         // target: 'http://192.168.3.162:7654',
         target: 'https://company.citupro.com:18182/op/base',
         secure: false, // 是否支持 https，默认 false
         changeOrigin: true, // 是否支持跨域
         pathRewrite: {
-          '^/api': ''
+          '^/op/base': ''
+        }
+      },
+      '/op/base/api': {
+        // target: 'http://192.168.3.162:7654',
+        target: 'https://company.citupro.com:18183',
+        secure: false, // 是否支持 https，默认 false
+        changeOrigin: true, // 是否支持跨域
+        pathRewrite: {
+          '^/op/base/api': '/op/base/api'
         }
       }
     }