{"ast":null,"code":"import { ref, watch, nextTick, computed } from \"vue\";\nimport { useStore } from \"vuex\";\nimport { waybillAsk, waybillConfig, autoask } from \"@/assets/js/waybill.js\";\nexport default {\n  name: \"PlayWay\",\n  components: {},\n  props: {\n    tableData: {\n      type: Object,\n      default: () => ({\n        ludan: {},\n        game_id: 1\n      })\n    }\n  },\n  setup(props) {\n    const refItem = ref(null);\n    const autoaskData = ref({});\n    const store = useStore();\n    const Type = computed(() => store.state.config.$Type);\n    const Lang = computed(() => store.state.config.$lang);\n    const toningShowBigWay = computed(() => store.state.config.toningShowBigWay);\n    const timeStamp = computed(() => store.state.config.timeStamp);\n    const askWay = type => {\n      const data = props.tableData;\n      waybillAsk(refItem.value, type, data, data.game_id);\n    };\n    const switchBigWay = () => {\n      store.commit(\"config/toningShowBigWay\");\n    };\n    watch(() => [props.tableData.ludan, timeStamp.value, Type.value, toningShowBigWay.value], () => {\n      nextTick(() => {\n        waybillConfig(refItem.value, props.tableData, props.tableData.game_id);\n        autoaskData.value = autoask(props.tableData);\n      });\n    }, {\n      immediate: true,\n      deep: true\n    });\n    return {\n      Type,\n      Lang,\n      refItem,\n      autoaskData,\n      askWay,\n      switchBigWay\n    };\n  }\n};","map":{"version":3,"names":["ref","watch","nextTick","computed","useStore","waybillAsk","waybillConfig","autoask","name","components","props","tableData","type","Object","default","ludan","game_id","setup","refItem","autoaskData","store","Type","state","config","$Type","Lang","$lang","toningShowBigWay","timeStamp","askWay","data","value","switchBigWay","commit","immediate","deep"],"sources":["/Users/li/Desktop/work/work2/OG/GamePortrait/src/components/PlayWay.vue"],"sourcesContent":["<template>\n  <div class=\"playway\">\n    <div class=\"canvas-box\">\n      <canvas class=\"canvas\" ref=\"refItem\"></canvas>\n      <div\n        class=\"switch-btn\"\n        @click=\"switchBigWay\"\n        v-if=\"tableData.game_id == 6\"\n      >\n        {{ Lang[Type].zhupan }}\n      </div>\n    </div>\n    <div\n      class=\"btn-box\"\n      v-if=\"tableData.game_id == 1 || tableData.game_id == 2\"\n    >\n      <div class=\"left\">\n        <div class=\"item\">\n          <span class=\"lab\">\n            {{ tableData.game_id == 1 ? Lang[Type].banker : Lang[Type].dragon }}\n          </span>\n          <span class=\"num banker\">{{ tableData.bankerCount || 0 }}</span>\n        </div>\n        <div class=\"item\" v-if=\"tableData.game_id == 1\">\n          <span class=\"lab\">{{ Lang[Type].p_banker }}</span>\n          <span class=\"num banker\">{{ tableData.banker_pair_Count || 0 }}</span>\n        </div>\n        <div class=\"item\">\n          <span class=\"lab\">\n            {{ tableData.game_id == 1 ? Lang[Type].player : Lang[Type].tiger }}\n          </span>\n          <span class=\"num palyer\">{{ tableData.playerCount || 0 }}</span>\n        </div>\n        <div class=\"item\" v-if=\"tableData.game_id == 1\">\n          <span class=\"lab\">{{ Lang[Type].p_player }}</span>\n          <span class=\"num palyer\">{{ tableData.player_pair_Count || 0 }}</span>\n        </div>\n        <div class=\"item\">\n          <span class=\"lab\">{{ Lang[Type].tie }}</span>\n          <span class=\"num tie\">{{ tableData.tieCount || 0 }}</span>\n        </div>\n        <div class=\"item\">\n          <span class=\"lab\">{{ Lang[Type].game }}</span>\n          <span class=\"num\">{{ tableData.number_tab_number - 1 || 0 }}</span>\n        </div>\n      </div>\n      <div class=\"right\">\n        <div class=\"banker ask\" @click=\"askWay('banker')\">\n          <span class=\"text\">\n            {{\n              tableData.game_id == 1\n                ? Lang[Type].askbanker\n                : Lang[Type].askdragon\n            }}\n          </span>\n          <ul class=\"btn\">\n            <li\n              class=\"li circle\"\n              :class=\"autoaskData.BbigEyeRoadcolor\"\n              v-show=\"autoaskData.BbigEyeRoadisshow\"\n            ></li>\n            <li\n              class=\"li round\"\n              :class=\"autoaskData.Bpathwaycolor\"\n              v-show=\"autoaskData.Bpathwayisshow\"\n            ></li>\n            <li\n              class=\"li line\"\n              :class=\"autoaskData.Broachcolor\"\n              v-show=\"autoaskData.Broachisshow\"\n            ></li>\n          </ul>\n        </div>\n        <div class=\"palyer ask\" @click=\"askWay('palyer')\">\n          <span class=\"text\">\n            {{\n              tableData.game_id == 1\n                ? Lang[Type].askplayer\n                : Lang[Type].asktiger\n            }}\n          </span>\n          <ul class=\"btn\">\n            <li\n              class=\"li circle\"\n              :class=\"autoaskData.PbigEyeRoadcolor\"\n              v-show=\"autoaskData.PbigEyeRoadisshow\"\n            ></li>\n            <li\n              class=\"li round\"\n              :class=\"autoaskData.Ppathwaycolor\"\n              v-show=\"autoaskData.Ppathwayisshow\"\n            ></li>\n            <li\n              class=\"li line\"\n              :class=\"autoaskData.Proachcolor\"\n              v-show=\"autoaskData.Proachisshow\"\n            ></li>\n          </ul>\n        </div>\n      </div>\n    </div>\n    <div\n      class=\"totle-box\"\n      style=\"width: 2.6rem\"\n      v-if=\"tableData.game_id == 4 || tableData.game_id == 5\"\n    >\n      <div class=\"list\" style=\"max-width: 100%\">\n        <div class=\"item\">\n          <span class=\"lab\">{{ Lang[Type].player }}1</span>\n          <span class=\"num banker\">{{ tableData.player_1_count || 0 }}</span>\n        </div>\n        <div class=\"item\">\n          <span class=\"lab\">{{ Lang[Type].player }}2</span>\n          <span class=\"num palyer\">{{ tableData.player_2_count || 0 }}</span>\n        </div>\n        <div class=\"item\">\n          <span class=\"lab\">{{ Lang[Type].player }}3</span>\n          <span class=\"num tie\">{{ tableData.player_3_count || 0 }}</span>\n        </div>\n        <div class=\"item\">\n          <span class=\"lab\">{{ Lang[Type].game }}</span>\n          <span class=\"num\">{{ tableData.number_tab_number - 1 || 0 }}</span>\n        </div>\n      </div>\n    </div>\n    <div class=\"totle-box\" v-if=\"tableData.game_id == 6\">\n      <div class=\"list\">\n        <div class=\"item\">\n          <span class=\"lab\">0</span>\n          <span class=\"num black\">{{ tableData.count.zero_count || 0 }}</span>\n        </div>\n        <div class=\"item\">\n          <span class=\"lab\">1</span>\n          <span class=\"num palyer\">{{ tableData.count.one_count || 0 }}</span>\n        </div>\n        <div class=\"item\">\n          <span class=\"lab\">2</span>\n          <span class=\"num tie\">{{ tableData.count.two_count || 0 }}</span>\n        </div>\n        <div class=\"item\">\n          <span class=\"lab\">3</span>\n          <span class=\"num yellow\">{{ tableData.count.three_count || 0 }}</span>\n        </div>\n        <div class=\"item\">\n          <span class=\"lab\">4</span>\n          <span class=\"num banker\">{{ tableData.count.four_count || 0 }}</span>\n        </div>\n      </div>\n      <div class=\"list\">\n        <div class=\"item\">\n          <span class=\"lab\">{{ Lang[Type].odd }}</span>\n          <span class=\"num palyer\">\n            {{ tableData.count.singular_count || 0 }}\n          </span>\n        </div>\n        <div class=\"item\">\n          <span class=\"lab\">{{ Lang[Type].even }}</span>\n          <span class=\"num banker\">\n            {{ tableData.count.plural_count || 0 }}\n          </span>\n        </div>\n        <div class=\"item\">\n          <span class=\"lab\">{{ Lang[Type].big }}</span>\n          <span class=\"num banker\">{{ tableData.count.big_count || 0 }}</span>\n        </div>\n        <div class=\"item\">\n          <span class=\"lab\">{{ Lang[Type].small }}</span>\n          <span class=\"num palyer\">{{ tableData.count.small_count || 0 }}</span>\n        </div>\n        <div class=\"item\">\n          <span class=\"lab\">{{ Lang[Type].game }}</span>\n          <span class=\"num\">{{ tableData.number_tab_number - 1 || 0 }}</span>\n        </div>\n      </div>\n    </div>\n    <div class=\"totle-box\" v-if=\"tableData.game_id == 7\">\n      <div class=\"list\">\n        <div class=\"item\">\n          <span class=\"lab\">{{ Lang[Type].big }}</span>\n          <span class=\"num banker\">{{ tableData.count.big_count || 0 }}</span>\n        </div>\n        <div class=\"item\">\n          <span class=\"lab\">{{ Lang[Type].small }}</span>\n          <span class=\"num palyer\">{{ tableData.count.small_count || 0 }}</span>\n        </div>\n        <div class=\"item\">\n          <span class=\"lab\">{{ Lang[Type].wai_dice }}</span>\n          <span class=\"num tie\">{{ tableData.count.leopard_count || 0 }}</span>\n        </div>\n      </div>\n      <div class=\"list\">\n        <div class=\"item\">\n          <span class=\"lab\">{{ Lang[Type].even }}</span>\n          <span class=\"num banker\">\n            {{ tableData.count.plural_count || 0 }}\n          </span>\n        </div>\n        <div class=\"item\">\n          <span class=\"lab\">{{ Lang[Type].odd }}</span>\n          <span class=\"num palyer\">\n            {{ tableData.count.singular_count || 0 }}\n          </span>\n        </div>\n        <div class=\"item\">\n          <span class=\"lab\">{{ Lang[Type].game }}</span>\n          <span class=\"num\">{{ tableData.number_tab_number - 1 || 0 }}</span>\n        </div>\n      </div>\n    </div>\n    <div class=\"totle-box\" v-if=\"tableData.game_id == 8\">\n      <div class=\"list\">\n        <div class=\"item\">\n          <span class=\"lab\">{{ Lang[Type].red }}</span>\n          <span class=\"num banker\">{{ tableData.count.red_count || 0 }}</span>\n        </div>\n        <div class=\"item\">\n          <span class=\"lab\">{{ Lang[Type].big }}</span>\n          <span class=\"num banker\">{{ tableData.count.high_count || 0 }}</span>\n        </div>\n        <div class=\"item\">\n          <span class=\"lab\">{{ Lang[Type].odd }}</span>\n          <span class=\"num palyer\">{{ tableData.count.odd_count || 0 }}</span>\n        </div>\n        <div class=\"item\">\n          <span class=\"lab\">{{ Lang[Type].zero }}</span>\n          <span class=\"num tie\">{{ tableData.count.zero_count || 0 }}</span>\n        </div>\n      </div>\n      <div class=\"list\">\n        <div class=\"item\">\n          <span class=\"lab\">{{ Lang[Type].black }}</span>\n          <span class=\"num black\">\n            {{ tableData.count.black_count || 0 }}\n          </span>\n        </div>\n        <div class=\"item\">\n          <span class=\"lab\">{{ Lang[Type].small }}</span>\n          <span class=\"num palyer\">\n            {{ tableData.count.low_count || 0 }}\n          </span>\n        </div>\n        <div class=\"item\">\n          <span class=\"lab\">{{ Lang[Type].even }}</span>\n          <span class=\"num banker\">\n            {{ tableData.count.even_count || 0 }}\n          </span>\n        </div>\n        <div class=\"item\">\n          <span class=\"lab\">{{ Lang[Type].game }}</span>\n          <span class=\"num\">{{ tableData.number_tab_number - 1 || 0 }}</span>\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script>\nimport { ref, watch, nextTick, computed } from \"vue\"\nimport { useStore } from \"vuex\"\nimport { waybillAsk, waybillConfig, autoask } from \"@/assets/js/waybill.js\"\nexport default {\n  name: \"PlayWay\",\n  components: {},\n  props: {\n    tableData: {\n      type: Object,\n      default: () => ({\n        ludan: {},\n        game_id: 1\n      })\n    }\n  },\n  setup(props) {\n    const refItem = ref(null)\n    const autoaskData = ref({})\n    const store = useStore()\n    const Type = computed(() => store.state.config.$Type)\n    const Lang = computed(() => store.state.config.$lang)\n    const toningShowBigWay = computed(() => store.state.config.toningShowBigWay)\n    const timeStamp = computed(() => store.state.config.timeStamp)\n    const askWay = (type) => {\n      const data = props.tableData\n      waybillAsk(refItem.value, type, data, data.game_id)\n    }\n    const switchBigWay = () => {\n      store.commit(\"config/toningShowBigWay\")\n    }\n    watch(\n      () => [\n        props.tableData.ludan,\n        timeStamp.value,\n        Type.value,\n        toningShowBigWay.value\n      ],\n      () => {\n        nextTick(() => {\n          waybillConfig(refItem.value, props.tableData, props.tableData.game_id)\n          autoaskData.value = autoask(props.tableData)\n        })\n      },\n      { immediate: true, deep: true }\n    )\n    return {\n      Type,\n      Lang,\n      refItem,\n      autoaskData,\n      askWay,\n      switchBigWay\n    }\n  }\n}\n</script>\n<style lang=\"scss\" scoped>\n.playway {\n  width: 100%;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  .canvas-box {\n    width: 100%;\n    height: 100%;\n    position: relative;\n    .canvas {\n      display: block;\n      width: 100%;\n      height: 100%;\n    }\n    .switch-btn {\n      position: absolute;\n      bottom: 0;\n      left: 32%;\n      font-size: 0.2rem;\n      background: rgba(3, 169, 244, 0.6);\n      color: #fff;\n      padding: 0.05rem 0.1rem 0 0.1rem;\n      border-top-left-radius: 0.1rem;\n      border-top-right-radius: 0.1rem;\n      &:active {\n        opacity: 0.4;\n      }\n    }\n  }\n  .btn-box {\n    display: flex;\n    flex: 1;\n    height: 100%;\n    font-size: 0.4rem;\n    font-weight: 600;\n    background: #fff;\n    .left {\n      display: flex;\n      flex-wrap: wrap;\n      width: 3.169rem;\n      line-height: 1;\n      color: #7a7a7a;\n      border-left: 1px solid #eaebec;\n      min-width: 90px;\n      max-width: 180px;\n      .item {\n        min-width: 45%;\n        display: flex;\n        align-items: center;\n        .lab {\n          padding: 0 0.153rem;\n        }\n      }\n    }\n    .right {\n      border-left: 1px solid #eaebec;\n      text-align: center;\n      font-size: 0.369rem;\n      display: flex;\n      flex-direction: column;\n      justify-items: center;\n      min-width: 55px;\n      max-width: 100px;\n      flex: 1;\n      .ask {\n        height: 50%;\n        display: flex;\n        flex-direction: column;\n        align-items: center;\n        justify-content: center;\n        margin: 0 0.2rem;\n        .btn {\n          height: 0.55rem;\n          border-radius: 0.55rem;\n          background: rgb(238, 241, 246);\n          background: linear-gradient(\n            180deg,\n            rgba(238, 241, 246, 1) 0%,\n            rgba(252, 252, 253, 1) 35%,\n            rgba(255, 255, 255, 1) 100%\n          );\n          box-shadow: 0px 0px 1px 0.5px rgba(0, 0, 0, 0.1);\n          display: flex;\n          align-items: center;\n          justify-content: center;\n          margin-bottom: 2px;\n          padding: 0 0.1rem;\n          min-width: 90%;\n          &:active {\n            opacity: 0.5;\n          }\n          .li {\n            width: 0.369rem;\n            min-width: 0.369rem;\n            height: 0.369rem;\n\n            &.circle {\n              border-radius: 0.369rem;\n              box-sizing: border-box;\n              border: 3px solid #fff;\n              &.red {\n                border-color: #d14458;\n              }\n              &.blue {\n                border-color: #3779d7;\n              }\n            }\n            &.line {\n              position: relative;\n              &:after {\n                content: \"\";\n                position: absolute;\n                top: 5%;\n                width: 3px;\n                height: 90%;\n                border-radius: 3px;\n                transform: skewX(-30deg);\n              }\n              &.red:after {\n                background: #d14458;\n              }\n              &.blue:after {\n                background: #3779d7;\n              }\n            }\n            &.round {\n              border-radius: 12px;\n              margin-left: 5px;\n              &.red {\n                background: #d14458;\n              }\n              &.blue {\n                background: #3779d7;\n              }\n            }\n          }\n        }\n        &.banker {\n          border-bottom: 1px solid #eaebec;\n        }\n      }\n    }\n  }\n  .totle-box {\n    display: flex;\n    width: 5.2rem;\n    height: 100%;\n    border-left: 1px solid #deded9;\n    .list {\n      flex: 1;\n      font-size: 0.38rem;\n      font-weight: 600;\n      padding: 0.15rem 0.25rem;\n      display: flex;\n      flex-direction: column;\n      justify-content: space-between;\n      height: 100%;\n      box-sizing: border-box;\n      &:first-child {\n        max-width: 42%;\n      }\n      .item {\n        display: flex;\n        justify-content: space-between;\n        align-items: center;\n        line-height: 1;\n        color: #7a7a7a;\n        .black {\n          color: #2e2e2e;\n        }\n        .yellow {\n          color: #ffc107;\n        }\n      }\n    }\n  }\n}\n</style>\n"],"mappings":"AAiQA,SAASA,GAAG,EAAEC,KAAK,EAAEC,QAAQ,EAAEC,QAAO,QAAS,KAAI;AACnD,SAASC,QAAO,QAAS,MAAK;AAC9B,SAASC,UAAU,EAAEC,aAAa,EAAEC,OAAM,QAAS,wBAAuB;AAC1E,eAAe;EACbC,IAAI,EAAE,SAAS;EACfC,UAAU,EAAE,CAAC,CAAC;EACdC,KAAK,EAAE;IACLC,SAAS,EAAE;MACTC,IAAI,EAAEC,MAAM;MACZC,OAAO,EAAEA,CAAA,MAAO;QACdC,KAAK,EAAE,CAAC,CAAC;QACTC,OAAO,EAAE;MACX,CAAC;IACH;EACF,CAAC;EACDC,KAAKA,CAACP,KAAK,EAAE;IACX,MAAMQ,OAAM,GAAIlB,GAAG,CAAC,IAAI;IACxB,MAAMmB,WAAU,GAAInB,GAAG,CAAC,CAAC,CAAC;IAC1B,MAAMoB,KAAI,GAAIhB,QAAQ,EAAC;IACvB,MAAMiB,IAAG,GAAIlB,QAAQ,CAAC,MAAMiB,KAAK,CAACE,KAAK,CAACC,MAAM,CAACC,KAAK;IACpD,MAAMC,IAAG,GAAItB,QAAQ,CAAC,MAAMiB,KAAK,CAACE,KAAK,CAACC,MAAM,CAACG,KAAK;IACpD,MAAMC,gBAAe,GAAIxB,QAAQ,CAAC,MAAMiB,KAAK,CAACE,KAAK,CAACC,MAAM,CAACI,gBAAgB;IAC3E,MAAMC,SAAQ,GAAIzB,QAAQ,CAAC,MAAMiB,KAAK,CAACE,KAAK,CAACC,MAAM,CAACK,SAAS;IAC7D,MAAMC,MAAK,GAAKjB,IAAI,IAAK;MACvB,MAAMkB,IAAG,GAAIpB,KAAK,CAACC,SAAQ;MAC3BN,UAAU,CAACa,OAAO,CAACa,KAAK,EAAEnB,IAAI,EAAEkB,IAAI,EAAEA,IAAI,CAACd,OAAO;IACpD;IACA,MAAMgB,YAAW,GAAIA,CAAA,KAAM;MACzBZ,KAAK,CAACa,MAAM,CAAC,yBAAyB;IACxC;IACAhC,KAAK,CACH,MAAM,CACJS,KAAK,CAACC,SAAS,CAACI,KAAK,EACrBa,SAAS,CAACG,KAAK,EACfV,IAAI,CAACU,KAAK,EACVJ,gBAAgB,CAACI,KAAI,CACtB,EACD,MAAM;MACJ7B,QAAQ,CAAC,MAAM;QACbI,aAAa,CAACY,OAAO,CAACa,KAAK,EAAErB,KAAK,CAACC,SAAS,EAAED,KAAK,CAACC,SAAS,CAACK,OAAO;QACrEG,WAAW,CAACY,KAAI,GAAIxB,OAAO,CAACG,KAAK,CAACC,SAAS;MAC7C,CAAC;IACH,CAAC,EACD;MAAEuB,SAAS,EAAE,IAAI;MAAEC,IAAI,EAAE;IAAK,EAChC;IACA,OAAO;MACLd,IAAI;MACJI,IAAI;MACJP,OAAO;MACPC,WAAW;MACXU,MAAM;MACNG;IACF;EACF;AACF"},"metadata":{},"sourceType":"module","externalDependencies":[]}